这是表演网站吗?
#javascript #网络开发人员 #性能 #体系结构

最近,我的朋友问我一个关于他的项目:Is this a performant website?的非常重要的问题。因此,我开始想知道,这实际上意味着一个网站是表演者。是否有某种通用度量标准可以让我轻松区分某些网站的性能非常好,而其他网站的性能确实很糟糕?

这些问题启发了我写这篇文章,这将与其他问题有所不同,因为它更多地是关于关于某些主题而不是教程的免费想法,因此我特别看着您的评论和想法:)

性能审核工具

如果您曾经看过网络性能审核工具,则可能知道其中有很多。其中一些比其他人更先进,并提供了不容易比较的独特功能。下面的列表包含一些最受欢迎的列表:

  1. https://developer.chrome.com/docs/lighthouse/overview/
  2. https://pagespeed.web.dev/
  3. https://www.webpagetest.org/
  4. https://www.speedcurve.com/
  5. 更多...

因此,重要的是,不仅使用一种工具并完全相信它有时会显示错误的数据。更好的解决方案是持续几个人,以便您可以平均分数并以此数字为基础。

我最喜欢的工具

我每天都在使用页面速度见解,因为它可以提供灯塔和关键评分。因此,它有点是一个1中的工具,可为您提供有关在孤立环境(所谓的实验室数据)和真实用户体验(现场数据)上进行的审核的信息。

PSI Diagram

因此,您可以比较您的网站在包装盒中的完善方式以及真实用户如何体验它。从该比较,您可能会有相互的结果。例如,如果网站的CLS(累积布局偏移)度分为0,在Crux中为0.3,则意味着对于用户而言,有一些布局偏移对他们的经验不利。

通过使用PSI,您将获得数分核心网络生命力和灯塔,以向您展示您的网站表现方式。

这是表演网站吗?

通过查看上面的部分,您可能会认为我们已经收到了我在标题中提到的问题的答案。我们有一个应用程序,可以告诉我们我们的网站在孤立的环境(实验室)和真实用户(字段)中的表现。所以我们很好吗?

不是真正的:(与软件开发中的许多事情一样,答案通常是:

it depends

为什么?因为这些指标在各种网站上都广为人知。因此,您将在简单的投资组合页面或博客中使用与复杂的电子商务网站一起使用相同的指标,因此,您可以获得奇怪的结果。例如。

If a server side rendered e-commerce website gets a
Lighthouse score of 70, is it less performant than 
a static blog that gets the score of 85?

如果我们只看数字,那么在线商店不太完善。但是在这一点上,我们没有考虑到一个事实,电子商务网站比博客或投资组合页面更为先进,需要更多的互动性和不断变化的数据。

这里更好的选择是将此类指标的分数与相同的应用程序类型进行比较,例如比较两个电子商务网站,而不是电子商务和博客。

概括

始终拥有适当的性能审核的上下文,因为没有它,您可能会圈出圈子,因为您只是无法获得博客所能获得的电子商务分数良好。从技术上讲这是不可能的(除非您的电子商务网站有一个产品;)

在评论中让我知道您对此有何看法