首页 > 营销学院 > 营销推广

页面响应时间的2-5-8原则及关键性能指标与优化思路平潭seo推广营销咋样

关于页面加载速度，业界普遍遵循一条广为人知的“2-5-8秒规则”。用户在浏览一个网页时，其加载时间若超过2秒，可能会感到不耐烦；若在5秒内完成，用户体验尚可；而若加载时间达到8秒，则很可能会引起用户的极大不满。

在2秒内得到响应时，会感觉系统响应很快；

在2-5秒之间得到响应时，会感觉系统的响应速度还可以；

在5至8秒的响应时间内，人们可能会觉得系统运行速度较为迟缓，然而这样的速度尚在可接受范围内。

一旦超过8秒钟系统无任何反馈，用户便会觉得这个系统极其糟糕，随后可能会选择离开该网站，亦或是尝试进行第二次操作。

若想吸引并留住用户，一个网站的速度和稳定性显得尤为关键。

在各种类型的前端监控工具中，用户能够获取到页面众多性能数据。本文将详细阐述几个至关重要的性能指标，并针对这些指标提供相应的优化策略。

开始渲染时间

该时刻标志着浏览器着手进行页面渲染，在此之前，整个页面一直保持空白状态，因此这一阶段亦被称作白屏阶段。

该时间点可以通过以下公式进行计算：起始时间 = 首字节到达时间（TTFB）加上文档加载时间（TTDD）以及头部信息传输时间（TTHE）。TTFB指的是浏览器从发送请求到服务器开始返回第一个字节所经历的时间，TTDD则是指服务器加载HTML文档所需的时间，而TTHE则是指文档头部解析完成所需的时间。在功能更为强大的浏览器中，我们可以通过特定的属性来获取这些时间点。用户可以通过相应的方式获取，对于IE9及更高版本的浏览器，可以直接通过特定途径获取；而在不支持这些浏览器的环境中，则可以依据上述公式，在头部资源加载完毕的时刻，通过模拟获取一个近似的值。一般来说，页面开始渲染的速度越快，用户就能更迅速地看到内容。

对于该时间点的优化有：

1)优化服务器响应时间，服务器端尽早输出

2)减少html文件大小

3)减少头部资源,脚本尽量放在body中

DOM Ready

该时刻标志着DOM解析作业的完成，而资源加载尚未全部就绪；此时，用户与网页的互动功能已开放。这一现象可通过以下公式来表述：Dom Ready 等于 TTSR（启动时间）加上 TTDC（DOM完成时间）再加上 TTST（特定时间）。TTSR之前已有阐述，TTDC指的是构建DOM树所需的时间长度。TTST则代表在BODY标签内，所有静态脚本的加载与执行所占用的时间。在功能更为强大的浏览器中，这一过程通常会有相应的事件与之对应。

您可以查阅W3C的HTML5规范以获取详细信息。通过MDN文档，我们可以了解到，这一事件主要涉及DOM文档的加载与解析过程，表面上看似乎并不复杂。然而，该事件的触发与CSS和紧密相连，为此，人们提出了“关键呈现路径”这一术语来进行描述。

在不兼容事件处理的浏览器中，我们可以通过模仿操作来获得接近的数值，其中主要的模仿手段包括：

1）低版本内核浏览器可以通过轮询.来实现

2）ie中可通过不断调用的方法，直到其可用来实现

实现细节可借鉴业界主流框架的做法。当DOM完全加载完毕，用户便能够与网页展开互动，故此阶段越早达到越好。针对这一时间节点的优化措施包括：

1）减少dom结构的复杂度，节点尽可能少，嵌套不要太深

2）优化关键呈现路径

首屏时间

该时刻记录了用户浏览首屏页面的具体时间，这一时刻至关重要，却往往难以准确捕捉，通常我们只能通过模拟手段来获得一个相对接近的时间。常见的模拟方法包括：

持续抓取屏幕画面，一旦画面内容不再发生变动，即可认定达到首屏加载时间。可借鉴Speed Index算法进行评估。

首屏加载速度通常受图片加载影响显著，一旦页面完全加载，需检查图片是否位于首屏范围内，并识别出加载最慢的那张图片，以此作为首屏加载时间的参考。同时，还需关注其他相关细节，具体内容可参考《7天打造前端性能监控系统》。

针对该时间点的优化有：