摘要: 接上一篇介绍前端性能指标的内容,本文主要总结下一般使用的性能测量工具。 1、可以借助 Gooogle 开源的 web-vitals 库来测量一些性能指标: import {onCLS, onINP, onLCP, onFCP, onFID, onTTFB} from 'web-vitals'; on 阅读全文
posted @ 2024-07-03 18:01 csuwujing 阅读(103) 评论(0) 推荐(0) 编辑
摘要: 接上一篇介绍前端性能指标的内容,本文主要总结下一般使用的指标优化方案 加载相关: FCP 优化 : 降低服务器响应时间:确保服务器能迅速响应请求,这样浏览器就能更快地开始处理并渲染页面内容。可以通过优化服务端代码、改善静态资源的提供方式(如将图片部署到 CDN)来实现。 延迟加载非关键资源:对于非关 阅读全文
posted @ 2024-07-03 18:00 csuwujing 阅读(30) 评论(0) 推荐(0) 编辑
摘要: 作为一个有经验的前端开发工程师来说,关注性能是必不可少的一项日常工作,那么应该重点关注一些什么样的性能指标呢?其实主要还是从用户体验的角度来看,一般我们会从页面加载相关、交互相关方面入手。 FCP:首次内容绘制 LCP:最大内容绘制 TTFB:首字节时间 TBT:总阻塞时间 FMP:首次有效渲染 F 阅读全文
posted @ 2024-07-03 17:56 csuwujing 阅读(101) 评论(0) 推荐(0) 编辑