页面加载速度慢，到底是多少秒，瓶颈在哪里？
前端性能工具Chrome performance 结合F12，基本可以搞定。
一、Chrome performance
1、shift+ctrl+N进入谷歌的私密浏览模式；
2、F12调出DevTools；
3、点击Tab “Performance”；
4、点击灰色圆点，已开始界面录制；
5、操作测试界面；
6、操作完成后点击stop按钮，开始生成测试报告；
7、分析报告
蓝色(Loading)：网络通信和HTML解析时间
黄色(Scripting)：JavaScript执行时间
紫色(Rendering)：渲染时间
绿色(Painting)：重绘
灰色(system)：系统花费的时间
白色(Idle)：空闲时间
总时间-空闲时间，就是此界面显示需要的时间。
二、F12
如果不需要分析界面的瓶颈，也可以直接使用Tab “network” ，刷新要测试的界面，会显示下图时间：（但不会有详细的瓶颈数据）
DOMContentLoaded：DOM树构建完成。即HTML页面由上向下解析HTML结构到末尾封闭标签</html> 。
Load：页面加载完毕。 DOM树构建完成后，继续加载html/css 中的图片资源等外部资源，加载完成后视为页面加载完毕。
Finish：时间是页面上所有 http 请求发送到响应完成的时间，HTTP1.0/1.1 协议限定，单个域名的请求并发量是 6 个，即Finish是所有请求（不只是XHR请求，还包括DOC，img，js，css等资源的请求）在并发量为6的限制下完成的时间。
其实 Chrome performance 比这强大的多，有待大家自己去挖掘。