关于首屏内容的百分比是什么意思?

What do percents regarding above-the-fold content mean?

UPD 我仔细阅读了相关页面,他们没有回答我的特定问题。百分比是什么意思?嗯,有一个attempt在解释:

google page insights will tell you clearly how many % of css referring the content above the fold is being loaded too late and page could have been rendered earlier.

但这并不比 PageSpeed 所说的更清楚。如果完全正确的话。

我有一个页面,我的所有 css 内嵌在头部(可能还不多,12K),只有 一个 虚拟外部样式表在末尾正文标签:

<!doctype html>
<html><head>
    ...<style>...</style>...
</head><body>
    ...
    <link rel="stylesheet" href="1.css">
    <script src="..."></script>
    <script src="..."></script>
    <script src="..."></script>
</body></html>

1.css:

.not-used-selector {color: red;}

PageSpeed 告诉我:

Approximately 55% of the above-the-fold content on your page could be rendered without waiting for the following resources to load. Try to defer or asynchronously load blocking resources, or inline the critical portions of those resources directly in the HTML.

Optimize CSS Delivery of the following:

https://.../1.css

55% 是什么意思?当我从页面中删除外部样式表时,投诉显然消失了,但这个数字到底是什么意思?

首屏内容是您无需向下滚动(最顶部)即可看到的页面部分。多少取决于设备、浏览器大小等等。

"Approximately 55% of the above-the-fold content on your page could be rendered without waiting for the following resources to load" 就是这个意思。换句话说,"the following resources" 有 css 规则应用于该页面部分的 45%(首屏内容)。其余 (55%) 不需要外部样式表。将这些规则移动到页面本身并推迟加载外部样式表可能是有意义的。这样就可以在不等待样式表加载的情况下呈现首屏内容。只是这个数字 (45%) 可能非常不准确。