webpagetest帮助html站点页面全面体检，让你发现细节问题，针对性优化

1. 工具地址

https://www.webpagetest.org/

这是一个能够测试你的网站响应性能、用户体验，全文为多角度评估你网站细节，甚至代码细节的工具。

不是广告，只是在别的地方看到了这个网站，拿过来跟大家分享一下简单的使用心得。

2. 访问页面

网站是英语的，不用科学上网。翻译成汉语，主页面如下展示：

3. 测试节点切换

这里要切换测试地点，一定要选一个大陆的节点，否则测试出来的耗时数据是很慢的，没有太大的参考价值。

以及下面这张图里面，可以配置浏览器、模拟的带宽。

最后，点击上图右侧黄色的“开始测试”。

4. 开始测试

这是在上一步设置了一些配置后的“测试进行中...”的页面。可以看到一些测试配置已经生效，并且正在测试。这个过程需要稍等一会。

5. 测试结果页面

测试结果页面的内容非常丰富和细节。

测试结果会把最终浏览器的渲染效果也带出来，这个界面应该是与你用浏览器访问你的页面看到的效果是一致的。

点击下图中间的一些“机会”按钮进去，可以看到很多中肯的修改建议（只是建议，你要是照搬它的建议做修改，那网站估计跑不起来了）。

最后，在下图的最下面，可以看到每0.1秒甚至0.01秒渲染的快照，帮助你更细节的定位问题所在。

6. 附：页面翻译

因为网站是英文的，你可以使用浏览器翻译成汉语。chrome浏览器为例，邮件可以做翻译，如下图：