推荐的 Web 性能计时：多长时间才算太长？

对于加载页面时的缓慢速度没有明确的规定，但有具体的指导原则来指示内容将加载（1?秒）、空闲（50?毫秒）、动画（16.7?毫秒）和响应用户输入（50?到?50?毫秒）。?200?毫秒）。

负载目标

“不到一秒”通常被吹捧为最佳负载，但这是什么意思？秒应被视为向用户指示已发出新内容的请求并将加载的最大时间量的规则，例如浏览器显示页面标题和显示页面的背景颜色。

从请求中检索到的第一个资产通常是?HTML?文档，然后该文档会调用其他资产。正如关键渲染路径的描述中所述，收到后，浏览器立即开始处理?HTML，在接收到内容时渲染内容，而不是等待其他资源加载。

是的，一秒加载是一个目标，但很少有网站能够实现这一目标。期望不同。公司网络上的“hello?world”预计会在几毫秒内加载完毕，但用户在西伯利亚北部的边缘网络上使用五年前的设备下载猫视频时，可能会发现?20?秒的下载速度很快。如果您等待三到四秒而不通知用户正在发生负载并显示一些进度，则典型的站点将失去潜在的访问者，并且这些访问者如果回来，将需要很长时间才能回来。

在优化性能时，请务必设定雄心勃勃的首次加载目标，例如通过移动?3G?网络?5?秒，在办公室?T1?线路上?1.5?秒，并为后续页面加载设定更雄心勃勃的页面加载目标，利用服务工作人员和缓存。初始加载页面与加载其他资源、响应用户交互以及确保流畅的动画有不同的建议时间：

空转目标

浏览器是单线程的（尽管?Web?Worker?支持后台线程）。这意味着用户交互、绘画和脚本执行都在同一个线程上。如果线程正忙于执行复杂的?JavaScript，主线程将无法对用户输入做出反应，例如按下按钮。因此，脚本执行的范围应该受到限制，分成可以在?50?毫秒或更短的时间内执行的代码块。这使得该线程可用于用户交互。

动画目标

为了使滚动和其他动画看起来流畅并感觉响应灵敏，内容重绘应以每秒?60?帧?(60fps)?的速度进行，即每?16.7?毫秒一次。16.7?毫秒包括脚本编写、回流和重绘。意识到一个文档大约需要?6?毫秒来渲染一帧，剩下大约?10?毫秒用于其余部分。任何低于?60fps?的内容，尤其是不均匀或变化的帧速率，都会显得卡顿。

响应能力目标

当用户与内容交互时，重要的是提供反馈并确认用户的响应或交互，并且在?100?毫秒内（最好是在?50?毫秒内）完成。50ms?秒感觉很即时。用户交互的确认通常应该是即时的，例如悬停或按下按钮，但这并不意味着完成的响应应该是瞬时的。虽然慢于?100?毫秒的反应可能会在用户交互和响应之间造成脱节，但响应的?100?到?200?毫秒过渡可以帮助用户注意到他们的交互启动的响应，例如菜单打开。如果响应时间超过?100?毫秒才能完成，请提供某种形式的反馈以通知用户交互已发生。认用户的响应或交互，并且在?100?毫秒内（最好是在?50?毫秒内）完成。50ms?秒感觉很即时。用户交互的确认通常应该是即时的，例如悬停或按下按钮，但这并不意味着完成的响应应该是瞬时的。虽然慢于?100?毫秒的反应可能会在用户交互和响应之间造成脱节，但响应的?100?到?200?毫秒过渡可以帮助用户注意到他们的交互启动的响应，例如菜单打开。如果响应时间超过?100?毫秒才能完成，请提供某种形式的反馈以通知用户交互已发生。