优化到底在优化什么,用户关注什么,什么是标准
chrome 推出 RAIL 性能模型
Response (50 ms)
用户操作后的响应能力
用户操作后 100 ms 内做出反应,用户才不会有延迟感(100 ms 来自一项人机交互的研究结果),因为主线程还需要执行其他任务,模型要求其在 50 ms 内完成为佳
Animation(10 ms)
动画过程,保证动画的流畅性
保证 60pfs 的帧率(1s 内的画面数)才能感觉流程,1000 / 60 = 16.6667 ms,16 ms 内完成。由于浏览器渲染还需要时间,故模型规定每一帧的处理时间在 10 ms 内。
Idle(至少50 ms,最大化空闲时间)
主线程的空闲状态,最大化空闲时间
因为 100 ms 需要相应用户的操作(response),如果主线程很繁忙,则不能在 100 ms 内响应主线程的任务。模型规定主线程的任务延时最大不能超过 50 ms
Load(3g 中等设备 5s 内可交互)
更具网络状况,延时状况等来判定
3g 中等设备 5s 内可交互
图片
image.png image.png过程
加载 动画 与 页面交互 空闲等过程
网友评论