上周我们回顾了如何理解 Google 的 PageSpeed Insights 报告,所以现在是时候利用 PageSpeed Insights 为我们提供的这些警告来提高网站的速度和性能了。
1. 尽量减少主线程工作
主线程是浏览器完成显示页面所需的大部分工作的地方。如果锁定,用户将无法执行任何任务。这会导致加载时间缓慢、页面无响应以及用户体验不佳。最小化主线程的工作可以使浏览器更快地在屏幕上绘制像素并对用户做出更多响应。
2. 提供下一代格式的图像
JPEG 2000、JPEG XR 和 WebP等下一代图像格式是将现代压缩技 巴拉圭号码数据 术应用于旧图像格式(.jpeg、.png、.bmp)的结果。在这些格式中,WebP 最接近成为新的默认格式。以下一代格式提供图像可在保持相同质量的同时显著减小文件大小。
3. 消除阻碍处理的资源
一些 CSS 和 JavaScript 文件(例如样式表、脚本标签)和图像可能会被标记为阻止渲染的资源。当浏览器抓取页面的 HTML 时,这些资源可以对其进行拦截。浏览器必须停止正在执行的操作,下载它们、解析它们并执行它们。消除阻塞渲染的资源,以便可以执行显示(渲染)页面等关键操作。
4. 尽量减少资源
减少 HTML、CSS 和 JavaScript 文件的大小是加快网站速度的关键部分。您可以通过最小化资源并压缩它们来使代码文件更轻。两者都是低努力、高回报的优化,一次性完成它们是明智之举。
5. 暂停屏幕外的图像
屏幕外图像的延迟加载(也称为图像延迟加载)是指使用一组技术仅加载访问者当前正在查看的图像。仅当用户导航至屏幕外图像时,它们才会可见。推迟它们可以确保最关键的资源首先被加载。
6. 使用高效的缓存策略提供静态资产
在所有提高网站性能的方法中,缓存是最根本的。如果您想加快网站性能,减少服务器负载,并为访问者提供卓越的体验,那么您肯定需要有一个高效的缓存策略。
7. 确保在网页字体加载时文本保持可见
字体通常很大,需要一段时间才能加载。它们甚至可以阻止文本的呈现,而文本正是访问者浏览您的网站最需要的。这就是为什么确保文本在 Web 字体加载期间保持可见是整体性能策略的关键部分。
8. 图像元素没有明确的宽度或高度
大多数网站未能通过CLS评分的主要原因之一是它们没有为图像元素保留足够的空间。这就是为什么拥有明确的宽度和高度属性可以使您免于 CLS 问题并防止访问者遇到意外变化。
9.减少第三方代码的影响
虽然没有第三方脚本就无法运行网站,但您可以应用许多优化技术来减少第三方代码的影响。这样您就可以继续使用有用的功能而不会降低网站速度。
结论
Google PageSpeed Insights 值得添加到您的性能测试库中,但不要忘记明智地使用它并关注重要的数据。获得 100/100 的分数不是您的主要目标。相反,将注意力转移到 PSI 报告顶部的核心网络生命力评估上。较低的性能分数表明网站存在技术问题;将其用于调试目的。如果您想获得良好的用户体验,现场数据胜过实验室数据。重新访问 PageSpeed 工具,以掌握 Google 的优先事项,并每 28 天跟踪一次您的 CWV 进度。