Reduce the size of above-the-fold content

This rule is triggered when PageSpeed Insights detects that the system needs to make more network round trips to render the first screen content of a web page.

Overview

If the amount of data required exceeds the limit of the initial congestion window, the system needs to make more round trips between the server and the user's browser. If the user is using a network with a long delay time (for example, a mobile network), this problem will seriously delay the loading of web pages.

Recommendations

To speed up Web page loading, limit the size of data (HTML tags, pictures, CSS, and JavaScript) required to render the content of the first screen of a Web page. To do this, you can try the following methods:

• 结构化HTML，以便首先加载关键的首屏内容
• Reduce the amount of data used by resources

Structured HTML so that the key first screen content is loaded first

请首先加载网页的主要内容。结构化网页，以便服务器发出的初始响应能发送必要数据，从而迅速呈现网页的关键部分并暂缓呈现其余部分。这可能意味着，您必须将CSS拆分为两个部分：负责调整内容ATF部分的格式的内嵌部分，以及可暂缓呈现的部分。

参考以下示例，了解有关如何结构化网站以提高加载速度：

• 如果您的HTML先加载第三方小部件，再加载主要内容，请将该加载顺序更改为先加载主要内容。
• If your site has a two-column layout (navigation sidebar plus article) and HTML loads the sidebar before the article, consider loading the article first.

Reduce the amount of data used by resources

如果经过重新设计的网站可以在多个设备上正常运行，并能首先加载关键内容，请使用以下技术来减少呈现网页所需的数据量：

• 缩减资源的大小：通过移除不必要的空格和评论来缩减HTML、CSS和JavaScript的大小。通过使用可重命名资源中变量名称的工具，实现进一步的优化。
• 尽可能考虑Use CSS instead of pictures.
• 启用压缩功能

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License, and code samples are licensed under the Apache 2.0 License. For details, see ourSite Policies.