种测量页面速度的工具

1. PageSpeed Insights(PSI)

PageSpeed Insights曾经是、现在是并且很可能将继续是(考虑到它是 Google 的)所有网站所有者、网站管理员和开发人员的首选网络性能工具。它提供对实验室数据和现场数据的洞察,因此您可以同时衡量真实用户体验并调试您可能遇到的任何性能问题。

说到调试,PSI 的机会和诊断是一个很好的起点,因为它们为您提供了需要修复的警告列表。 

很难理解您的 PSI 报告吗?

查看我们的指南,了解 PSI,并充 工程师数据库 分利用 Google 的工具。 

2. GTmetrix

 

 工程师数据库

GTmetrix 是另一种流行的页面速度测试工具,它受到许多人的青睐,因为它具有以下附加功能:

  • 结构– 在此选项卡中,您可以找到影响您网站性能的具体问题的列表。
  • 瀑布图– 它显示您的网页上的所有单独的请求。
  • 视频– 它会自动录制可嵌入的视频,显示每次性能测试的页面加载情况。(付费功能)
  • 历史记录– 它包括您过 的“风格”来应对这些客户群 去的所有性能测试。

需要了解:

GTmetrix 主要使用实验室数据进行性能分析。

3.灯塔

如果您想修复一些实 CA 细胞数 验室问题,但又不想不断运行 PSI 或 GTmetrix 测试,您可以在 Chrome 浏览器中使用 Lighthouse在本地进行修复。Lighthouse 是 Google 开发的一款开源自动化工具。

要启动 Lighthouse:

  1. 打开 Chrome 并导航到您想要审核的网页。
  2. 按 F12 打开 DevTools,或右键单击页面并选择“检查”。
  3. 点击“灯塔”选项卡。
  4. 选择您想要审核的类别(性能、可访问性等)。
  5. 单击“生成报告”来运行审核。

您可能会惊讶地发现 Lighthouse 和 PSI 的报告非常相似。这是因为 PageSpeed Insights 从 Lighthouse 收集了实验室数据。 

如何提高页面速度(9 种行之有效的方法)

1. 实现缓存

如果网站没有可靠的缓存策略,就如同没有安装 SSL 证书或忽视移动版本一样。这是不可想象的。 

缓存是提高网站速度和整体性能的最有效但最直接的方法之一。简而言之:

缓存的工作原理是将网站文件的副本存储在临时存储位置,当用户访问您的网站时可以快速访问该位置。这减少了服务器每次处理请求和提供内容的需要,从而加快了页面加载时间。

您可以实现两种主要类型的缓存: 

  1. 服务器端缓存
  2. 浏览器缓存

服务器端缓存涉及将内容存储在位于您的源站和访问者之间的 Web 代理(服务器)上。这种类型的缓存可减少服务器的负载并加快向用户交付内容的速度。您可以使用缓存插件轻松启用服务器端缓存,也可以让您的托管服务提供商为您设置。

另一方面, 浏览器缓存指示用户的浏览器在指定的时间内将某些文件(如图像、CSS 和 JavaScript)存储在本地。这样,当用户再次访问您的网站时,浏览器可以从本地缓存中加载这些文件,而不必再次从服务器下载它们。

要启用浏览器缓存,您还可以使用NitroPack等插件或手动调整.htaccess文件来为不同类型的文件设置缓存到期日期。

阅读我们的网络缓存指南,了解如何手动设置缓存规则。

只需 3 次点击即可在您的网站上启用高级缓存。获取 NitroPack →

2. 优化图片

图像通常占网页加载时间的很大一部分,因此解决这一问题可以带来显着的改进。事实上,根据Web Almanac 的数据,图像是页面重量的最大贡献者,桌面页面为 1,026 KB,移动页面为 811 KB:

话虽如此,优化网站的图像可以大大提高性能。 

但是图像优化到底包括什么呢?

嗯,您需要考虑几种基本技术:

1. 使用下一代图像格式

WebP 和 AVIF 等新一代图像格式比 JPEG 和 PNG 等传统格式具有更高的压缩率,且不会牺牲质量。这意味着您可以继续提供高质量的图像,而不会影响性能。

您可以使用免费的在线工具将图片转换为 WebP 或 AVIF,然后手动重新上传。对于 WordPress 用户,Imagify 和 NitroPack 等插件会自动转换并以这些格式提供您的图片。

发表评论

您的邮箱地址不会被公开。 必填项已用 * 标注

滚动至顶部