当前位置: 首页 > 科技观察

前端性能优化与监控开篇:如何看懂网站性能

时间:2023-03-17 19:58:20 科技观察

本文转载请联系三分钟学习前端公众号。作为一个前端工程师,性能优化是最基本也是必须的内容,也是最累赘的内容。如何做好这份工作?本系列开始进入高级前端性能优化和监控。主要内容包括但不限于:如何认识网站性能性能标准如何衡量一个网页的性能:性能指标从页面渲染过程看性能瓶颈优化加载性能如何优化渲染性能实践:秒开上首屏、白屏300ms及界面流畅优化技巧性能实践如何排查加载性能问题如何排查性能渲染问题性能测试工具性能采集与监控实践性能采集:首屏、白屏Stuck等性能采集与上报SDK搭建性能平台从0到1到探究前端性能优化未来开发助你从0到1构建整个前端性能体系,今天就开始吧,如何理解网站性能,下文开始?如何理解网站性能大型网站的性能不仅仅取决于前端性能,还取决于服务器性能甚至数据库性能。因此,一个秒级流畅运行的网站,有赖于前端和前端人员的共同努力。本系列主要讨论前端(web)性能,即页面性能、页面加载性能、用户交互流畅度、滚动加载性能等,我们应该如何定义web性能的好坏?如何定义web性能的好坏Web性能的定义主要由两个方面组成:一是客户感知性能(主观性能)一是开发人员衡量的各种性能(客观性能),其中最重要的是感知性能由客户。开发者定义的各种性能指标都是为他们服务的。最终目的是让客户感知一个高效的过程我们可以通过一定的手段来提高客观性能的过程网站性能,比如按需加载、添加defer或者async、分包等,可以帮助我们提高性能网站,但是当涉及到客观表现的时候,我们很难用技术手段进行优化,比如当页面加载的文件很多,非常大的时候,我们也可以通过一定的产品手段来达到用户感知性能优化(好像没那么慢),例如:增加底图,增加加载动画,增加进度条等。总结网站性能需要前后端人员共同维护,本系列主要讨论前端(web)的性能,分为开发者衡量的性能(客观)和用户感知的性能(主观)。主观表现,可能没有那么快到达页面,让用户快速感知。参考:前端性能优化指南:https://juejin.cn/post/6844904150413606926