Web 性能日历

Avatar of Robin Rendle
Robin Rendle

DigitalOcean 为您旅程的每个阶段提供云产品。立即开始使用 200 美元的免费额度!

今年的 Web 性能日历 重新启动了。到目前为止,前两篇文章都是关于性能的!首先,Rick Viscomi 撰写了关于 神话般的“快速”网页 的文章

您如何处理网页性能的衡量方式可以告诉您它是为速度而构建的,还是感觉速度很快。我们称它们为实验室工具和现场工具。实验室工具是检查页面所有可能摩擦点的显微镜。现场工具是望远镜,可以让您全面了解用户如何体验页面。

对我来说,这表明现场工具是性能监控的未来。但 Rick 的文章对此进行了更深入的探讨。

其次,Matt Hobbs 撰写了关于 font-display CSS 属性 及其如何影响我们网站的性能的文章

如果您纯粹谈论的是感知性能,并且连接速度不是问题,那么我会说 font-display: swap 是最好的。使用此设置时,备用字体几乎会立即呈现。允许用户开始阅读页面内容,同时网页字体在后台继续加载。加载完成后,字体会相应地进行交换。在快速稳定的连接上,这通常发生得非常快。

我在这里的建议是,如果您使用此属性,则需要非常关注布局偏移。字体加载并交换后,可能会出现文本四处移动的大幅偏移。我曾经向一个网站发布了一个使用此属性但没有注意布局偏移的更改,用户对此抱怨很多

这是一个很好的教训:即使人们不说出来,他们也确实很关心性能。他们也深深地关心 “累积布局偏移”

直接链接 →