性能优化二
RAIL性能测量模型(from Google)
RAIL概述
Response 响应
这里的响应是指用户获得的反馈。
Animation 动画
足够流畅的动画
Idle 空闲
给浏览器足够的空闲时间,不能让主线程始终处于繁忙的状态,从而不能及时的去处理交互
Load 加载
资源网络加载的时间
RAIL评估标准
谷歌根据对用户的调查,制定的标准。
-
Response 响应:处理事件应在 50ms 内完成(浏览器自己的事务处理也大概要 50ms ,100ms内要给用户提供响应)
-
Animation 动画:每 10ms 产生一帧 (浏览器绘制也需要一定的时间)
-
Idle 空闲:尽可能增加空闲时间(前端尽量不要做业务逻辑计算)
-
Load 加载:在 5s 内完成内容加载并可以交互
性能测试工具
- Chrome DevTools 开发调试、性能评测
- Lighthouse 网站整体质量评估
- WebPageTest 多测试点、全面性能报告