ToB企服应用市场:ToB评测及商务社交产业平台

标题: 对于web性能优化我有话说！ [打印本页]

作者: 飞不高 时间: 2022-9-5 03:53
标题: 对于web性能优化我有话说！
web性能是什么呢？

简单来说就是咱们的项目打开的快不快，举以下几个例子

表单提交
列表切换
动画的流程性
打开速度

MDN上对web性能的定义则是Web性能是网站或应用程序的客观度量和可感知的用户体验。所以咱们可以从以下几个方面出发

加载速度
交互和平滑性
感知表现

性能优化流程

确定优化指标：做性能优化必须确定标准，如果没有确定标准，我们就无法知道做到什么程度才是合适的，有可能你自我认为性能已经做的很好了，但是从用户角度来看的实际体验却很糟糕,这就是没有达到目的。
如果做的过度其实就是人力和收益不成正比，例如加载时间，已经是达到一个极致了，你还要继续优化，例如缩减1ms，但是实际上收益不大，那么此时我们就应该转换战线
利用专业的测试工具去客观的、量化的评估网站的性能：这些工具可以帮我们准确的去评估，获得更多对我们有用的数据。而如果单单通过肉眼去观察的话，那么实际上获取的数据就是很少的
例如网站加载慢，你所认为的慢其实就是等待时间长，那如果是等待时间长，那我们是不是可以考虑加点动画，让等待时间看起来并不是那么的长，但是除了这个，你没有获得更多的一些对你有用的数据呢
而且对于不同人来说，有些人觉得慢，有些人觉得还行，那这时候你就要展示你获得的数据去证实你的观点，用数据说话往往是最有力的
基于网站页面的生命周期，去分析造成性能差的客观原因，而不是说主观的自我感觉，还是一句话拿数据说话
基于上一步定位到的原因，去找到收益最高的技术方案进行改造（这一步的话主要看自身项目的业务场景和需求了）
持续改进：很多东西不是一蹴而就的，不是说一天你就能把这个给优化的很好，毕竟我们程序猿也是人嘛，考虑的方面也会有些许欠缺，这是一个渐进式的一个过程，特别是对于一些巨石项目

性能优化指标

RAIL 性能模型：

RAIL 是 Response, Animation, Idle, 和 Load 的首字母缩写, 是一种由 Google Chrome 团队与 2015 年提出的性能模型，用于提升浏览器内的用户体验和性能. RAIL 模型的理念是 "以用户为中心；”最终目标不是让您的网站在任何特定设备上都能运行很快，而是使用户满意基于用户体验的性能指标：

基于用户体验的性能指标是 Google Chrome 团队与 2019年提出的（https://web.dev/i18n/zh/user-centric-performance-metrics/）。简单来说其实就是精确指标。例如：我们说网站加载慢，那么用应该用哪些指标去衡量它慢
测量工具

下面推荐几款非常好用测量工具，用起来！

webPageTest：免费并且专业 https://www.webpagetest.org/ 功能强大，可以设置不同浏览器、不同地区等等。十分推荐
chrome devtools：浏览器任务进程管理、performance看板、memory看板等等
lightHouse：可以评估网站分数，还会得出指标评分以及建议

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！

欢迎光临 ToB企服应用市场:ToB评测及商务社交产业平台 (https://dis.qidao123.com/)