با مجموعهها، منظم بمانید
ذخیره و طبقهبندی محتوا براساس اولویتهای شما.
این قانون زمانی فعال میشود که PageSpeed Insights تشخیص میدهد که برای نمایش محتوای بالا در صفحه مورد نیاز، رفت و برگشتهای اضافی شبکه لازم است.
بررسی اجمالی
اگر مقدار داده مورد نیاز از پنجره تراکم اولیه (معمولاً 14.6 کیلوبایت فشرده) بیشتر شود، به سفرهای رفت و برگشت اضافی بین سرور شما و مرورگر کاربر نیاز دارد. برای کاربرانی که در شبکههایی با تأخیر زیاد مانند شبکههای تلفن همراه هستند، این امر میتواند باعث تأخیر قابل توجهی در بارگذاری صفحه شود.
توصیه ها
برای اینکه صفحات سریعتر بارگذاری شوند، اندازه دادهها (نشانهگذاری HTML، تصاویر، CSS، جاوا اسکریپت) را که برای ارائه محتوای بالای صفحهتان لازم است، محدود کنید. راه های مختلفی برای این کار وجود دارد:
HTML خود را طوری ساختار دهید که ابتدا محتوای مهم و فوق العاده را بارگیری کند
ابتدا محتوای اصلی صفحه خود را بارگذاری کنید. صفحه خود را طوری ساختار دهید که پاسخ اولیه از سرور شما داده های لازم برای رندر کردن بخش مهم صفحه را فورا ارسال کند و بقیه را به تعویق بیندازد. این ممکن است به این معنی باشد که شما باید CSS خود را به دو بخش تقسیم کنید: یک بخش درون خطی که مسئول استایل بخشیدن به بخش ATF از محتوا است و بخشی که می توان آن را به تعویق انداخت.
مثالهای زیر را در نظر بگیرید که چگونه میتوان یک سایت را برای بارگذاری سریعتر بازسازی کرد:
اگر HTML شما ویجت های شخص ثالث را قبل از بارگیری محتوای اصلی بارگیری می کند، ابتدا ترتیب بارگیری محتوای اصلی را تغییر دهید.
اگر سایت شما از طراحی دو ستونی با نوار کناری ناوبری و مقاله استفاده می کند، اما HTML شما نوار کناری را قبل از مقاله بارگیری می کند، ابتدا مقاله را بارگیری کنید.
حجم داده های استفاده شده توسط منابع خود را کاهش دهید
هنگامی که سایت شما دوباره طراحی شد تا در چندین دستگاه به خوبی کار کند و ابتدا محتوای مهم را بارگیری کند، از تکنیک های زیر برای کاهش میزان داده مورد نیاز برای ارائه صفحه خود استفاده کنید:
کوچک کردن منابع : HTML، CSS و جاوا اسکریپت را می توان با حذف فضای خالی و نظرات غیر ضروری کوچک کرد. بهینه سازی های بیشتر ممکن است از طریق استفاده از ابزارهایی که نام متغیرها را در منابع شما تغییر نام می دهند امکان پذیر باشد.
تاریخ آخرین بهروزرسانی 2025-07-25 بهوقت ساعت هماهنگ جهانی.
[null,null,["تاریخ آخرین بهروزرسانی 2025-07-25 بهوقت ساعت هماهنگ جهانی."],[[["\u003cp\u003eThis PageSpeed Insights rule is triggered when additional network round trips are needed to render above-the-fold content.\u003c/p\u003e\n"],["\u003cp\u003eTo optimize, prioritize loading critical above-the-fold content first by restructuring HTML and reducing resource sizes.\u003c/p\u003e\n"],["\u003cp\u003eReduce data size by minifying resources, using CSS instead of images where possible, and enabling compression.\u003c/p\u003e\n"],["\u003cp\u003eThis documentation refers to a deprecated version of PageSpeed Insights API; the latest version is 5.\u003c/p\u003e\n"]]],["The core issue addressed is the delay in page loading caused by excessive data transfer required to render above-the-fold content. Key actions include structuring HTML to prioritize critical content, loading it first, and deferring non-essential parts. Recommendations involve reducing data size by minifying resources (HTML, CSS, JavaScript), using CSS instead of images when feasible, and enabling compression. The document advises optimizing content loading to avoid additional network round trips and improve page speed.\n"],null,["# Reduce the size of the above-the-fold content\n\n| **Deprecated** . This page was written for version 4 of the PageSpeed Insights API, which is deprecated and will be shut down in May 2019. [Version 5](/speed/docs/insights/v5/get-started) is the latest and provides both real-world data from the Chrome User Experience Report and lab data from Lighthouse.\n\n\nThis rule triggers when PageSpeed Insights detects that additional network round trips are required to render the above the fold content of the page.\n\n### Overview\n\n\nIf the amount of data required exceeds the initial congestion window (typically 14.6kB compressed), it will require additional round trips between your server and the user's browser. For users on networks with high latencies such as mobile networks this can cause significant delays to page loading.\n\n### Recommendations\n\nTo make pages load faster, limit the size of the data (HTML markup, images, CSS, JavaScript) that is needed to render the above-the-fold content of your page. There are several ways to do this:\n\n- [Structure your HTML to load the critical, above-the-fold content first](#structure)\n- [Reduce the amount of data used by your resources](#reduce)\n\n#### Structure your HTML to load the critical, above-the-fold content first\n\n\nLoad the main content of your page first. Structure your page so the initial response from your server sends the data necessary to render the critical part of the page immediately and defer the rest.\nThis may mean that you must split your CSS into two parts: an inline part that is responsible for styling the ATF portion of the content, and the part that can be deferred.\n\n\nConsider the following examples of how a site could be restructured to load faster:\n\n- If your HTML loads third-party widgets before it loads the main content, change the order to load the main content first.\n- If your site uses a two-column design with a navigation sidebar and an article, but your HTML loads the sidebar before the article, consider loading the article first.\n\n#### Reduce the amount of data used by your resources\n\nOnce your site has been redesigned to work well across multiple devices and load the critical content first, use the following techniques to reduce the amount of data required to render your page:\n\n- [Minify Resources](/speed/docs/insights/MinifyResources): HTML, CSS, and JavaScript can be minified by removing unnecessary whitespace and comments. Further optimizations may be possible through the use of tools which rename variable names in your resources.\n- Consider [using CSS instead of images](https://www.google.com/search?q=css+instead+of+images) where possible.\n- [Enable Compression](/speed/docs/insights/EnableCompression)\n\nFeedback\n--------\n\nWas this page helpful? \nYes Great! Thank you for the feedback. If you have a specific, answerable question about using PageSpeed Insights, ask the question in English on [Stack\n| Overflow](https://stackoverflow.com/questions/tagged/pagespeed-insights). For general questions, feedback, and discussion, start a thread in the [mailing list](https://groups.google.com/forum/#!forum/pagespeed-insights-discuss).\nNo Sorry to hear that. If you have a specific, answerable question about using PageSpeed Insights, ask the question in English on [Stack\n| Overflow](https://stackoverflow.com/questions/tagged/pagespeed-insights). For general questions, feedback, and discussion, start a thread in the [mailing list](https://groups.google.com/forum/#!forum/pagespeed-insights-discuss)."]]