前端性能优化-性能优化指标,HTML,函数,对象css优化,回流重绘,复合线程与图层,渲染,代码,资源,构建优化RAIL测量模型,测量Apis,lighthouse

为什么要进行web性能优化?

流量-搜索-转换率-用户体验
移动端挑战多
设备硬件,网速,屏幕尺寸,交互方式,持续增长的移动用户和移动电商业务

性能指标和优化目标

TTFB请求发出倒回来多少的事件

FCP第一个有内容的绘制出现的时间,3.6s
Speed Index
交互响应要足够快
Speed Index首次加载时间,页面加载时间
响应时间

在这里插入图片描述
在这里插入图片描述

RAIL测量模型

做什么样子,怎么去做?
Response响应,animation动画,idle空闲,Load加载
让用户有更好的体验
处理时间应该在50ms以内完成的

在这里插入图片描述
动画:每10ms产生一帧
空闲:尽可能增加空闲时间
加载:应该再5s内完成内容的加载和交互
加载解析渲染

猜你喜欢

转载自blog.csdn.net/weixin_43428283/article/details/128323441