性能优化二

RAIL性能测量模型(from Google)

RAIL概述

Response 响应
这里的响应是指用户获得的反馈。

Animation 动画
足够流畅的动画

Idle 空闲
给浏览器足够的空闲时间,不能让主线程始终处于繁忙的状态,从而不能及时的去处理交互

Load 加载
资源网络加载的时间

RAIL评估标准

谷歌根据对用户的调查,制定的标准。

  • Response 响应:处理事件应在 50ms 内完成(浏览器自己的事务处理也大概要 50ms ,100ms内要给用户提供响应)

  • Animation 动画:每 10ms 产生一帧 (浏览器绘制也需要一定的时间)

  • Idle 空闲:尽可能增加空闲时间(前端尽量不要做业务逻辑计算)

  • Load 加载:在 5s 内完成内容加载并可以交互

性能测试工具

  • Chrome DevTools 开发调试、性能评测
  • Lighthouse 网站整体质量评估
  • WebPageTest 多测试点、全面性能报告
原文地址:https://www.cnblogs.com/huangtq/p/15254256.html