网页慢的原因不一定只是前端,所以需要结合Network一起看
如何评价一个页面打开得快不快,可以用两个指标描述,一个是ready的时间,另一个是load的时间。
如下示例表示,read时间是2.72s,load时间是4.74s。
DOMContentLoaded: 2.72s |Load 4.74s
chrome devtools
- devtools练习网站
- 全新Chrome Devtool Performance使用指南
- 如何使用 Timeline 工具
- Chrome DevTools中文手册
- Effective前端7:加快页面打开速度
- Chrome开发者工具详解(2):Network面板
- segmentfault-Chrome DevTools — Timeline
- 我不知道的 Chrome Network 面板技巧
性能优化
GTmetrix工具
- gtmetrix:网站性能评测工具,在线
- 优化网站加载时间(GTmetrix)
其他工具
- caniuse:CSS兼容性检测