改善网站加载时间和 Google Core Vitals 的十种方法

已发表: 2021-08-15

什么是核心网络生命力

今年年初，谷歌推出了一套新的标准来定义任何给定网站的稳定性、速度和响应能力。三个主要标准如下：

记住这些基本术语，让我们看看如何使用 Core Vitals 使您的网站尽可能快速和高效。

使用这种方法，您的 FID 和 LCP 分数应该会很快提高。从 CDN 提供静态资产，或将它们缓存在 AWS 的 Cloudfront 等服务上。在此之后，浏览器将更快地获得所需的结果。

此外，动态页面可以缓存在您的 CDN 中，并且已经应用了正确的 TTL 值，具体取决于您的应用程序的行为方式。

大小事项标志就您的 CLS 分数而言，这是最重要的因素之一。始终检查您是否已在图像或标记资产上设置了特定高度，这非常重要，尤其是对于折叠级组件。如果您时间紧迫，您始终可以将高度设置为自动并获得一个在紧要关头应该足够好的近似尺寸。

广告也会影响 CLS，您需要彻底检查它们的高度和尺寸，以确保它们不会因显示不正确而取代内容。如果您的 CLS 持续受到影响，这可能需要联系您的广告服务提供商或四处寻找一些不同的选项。

如果您使用的是 WordPress 平台，我们建议您考虑使用Ewww之类的插件，它可以自动在 Webp 中交付您的图像，并启用延迟加载等功能，以延迟加载页面加载时的所有图像。

这种技术可以非常快速地产生结果，应该是您首先考虑的因素之一。令人惊讶的是，通过使用延迟加载包来延迟加载您网站上的所有图像，您的 LCP 将受到积极影响，主要是通过降低页面的重量并确保其尽快加载。

根据用于查看站点的设备类型为每个资产设置分辨率也很重要。以万能的方式加载分辨率将使网站在更小或功能更弱的设备上变得更慢，并以最糟糕的方式影响您的 LCP。

谷歌一直热衷于鼓励和推广评分良好的服务器端渲染 (SSR) 页面，以激发有价值的 SEO 性能。但是，您必须考虑 SEO 和页面加载性能之间的平衡。内容过多的页面可能需要很长时间才能加载服务器端并降低您网站的总体性能。

实际内容应保留在首屏，而其他站点功能应保留以改善 SSR。这种异步加载样式会占用您大量的加载和渲染分数时间。

代码行对资产（尤其是 JS 文件）使用最重要的文件大小通常是一个坏主意。相反，您应该允许 h2 协议并利用它在单独的部分中再次异步加载资产。

此外，您可以将网站分成多个较小的文件，而不是使用一个巨大的 HTML 文件，从而减轻加载负担。

就压缩而言，Brotli 似乎是加载速度方面的最佳选择。但是，就 DevOps 而言，更高的压缩比将增加打包和构建时间。

但归根结底，网站加载时间是最关键的因素，应该优先考虑。

毫无疑问，加载速度方面最重要的元素，即使是最微小的变化，也可以通过 API 产生巨大的结果。为了优化，应经常检查 API 响应和请求。

此外，定义数据参数并仅使用必要的参数以节省大量时间和精力。为您的 API 选择网络也值得仔细考虑，因为托管在错误的子网上会大大增加时间要求。

看网上文件的人繁重的代码登陆页面（超过 75kb 的任何内容都可能很严重）是非常不可取的，因为它们会大大增加加载时间和获取时间。

始终尝试在代码方面保持干净，因为很容易遗漏一些冗余数据。

许多站点查看者不喜欢与视频内容互动，因此在这种情况下，在未播放的视频上加载缩略图是一种资源浪费。

最好选择占位符图像或空白视频空间以节省资源，从而提高网站速度。

速度线这似乎是一个显而易见的因素，但仍然值得一提。投资最好的服务器基础设施通常是一个好主意，因为它直接影响整个站点的速度，无一例外。

通过花更多的钱，您将节省大量时间。 Cloudflare是一款出色的 DNS 级工具，可让您经济高效地优化您的网站，而无需昂贵的服务器资源。

上面的提示将使您走上正确的轨道，以实现更好的 Page Speed 分数和核心生命体征。但是，您可能会发现自己处于一个臃肿的平台或主题上，这通常意味着创建一个新的、更清洁和更轻量级的网站的最佳行动方案。

假设您对所有这些术语感到摸不着头脑，或者对重新设计整个网站以提高速度的想法感到畏惧。在这种情况下，您可能需要考虑来自网页设计专家的网站审查，他们可能会建议优化现有网站的最佳行动方案，或建议升级到具有更优化核心生命体征的代码库的新网站。