在线客服
扫描二维码
下载博学谷APP
扫描二维码
关注博学谷微信公众号
关于Web的性能监控相信大家或多或少都有所了解，那么什么是Web性能监控？它有什么用处呢？顾名思义，就是监控Web的性能。具体来讲，就是我们打开一个网站的页面需要多久之类的。Web性能监控的好处和作用是显而易见的，优化好了Web的性能，才能给用户更好的体验感从而提升用户留存率。本文就来带领大家全面认识一下Web性能监控，感兴趣的朋友就接着看下去吧！
什么是Web性能监控？
Web性能监控有两种分类，即合成监控和真实用户监控。合成监控是采用Web浏览器模拟器来加载网页，通过模拟终端用户可能的操作来采集对应的性能指标，最后输出一个网站性能报告。例如：Lighthouse、PageSpeed、WebPageTest、Pingdom、PhantomJS 等。它的优势是无侵入性，且简单快捷。不过不是真实的用户访问情况，只是模拟的，而且没法考虑到登录的情况，对于需要登录的页面就无法监控到。
真实用户监控是一种被动监控技术，是一种应用服务，被监控的Web应用通过 sdk 等方式接入该服务，将真实的用户访问、交互等性能指标数据收集上报、通过数据清洗加工后形成性能分析报表。例如 FrontJs、oneapm、Datadog 等。其优点是真实用户访问情况，还能观察历史性能趋势，以及一些额外的功能，如报表推送、监控告警等等。缺点是具有侵入性，在一定程度上会影响Web性能。
Web性能监控有什么用处？
前面讲过了，Web的性能一定程度上影响了用户留存率。google开发者提出了一种RAIL模型来衡量应用性能，即：Response、Animation、Idle、Load，分别代表者Web应用生命周期的四个不同方面。并指出最好的性能指标是：100ms内响应用户输入，动画或者滚动需在10ms内产生下一帧，最大化空间时间、页面加载时长不超过5秒。我们可转化为三个方面来看：响应速度、页面稳定性、外部服务调用。响应速度：页面初始访问速度+交互响应速度；页面稳定性：页面出错率；外部服务调用：网络请求访问速度。
Web性能监控的概念和用处就分享到这里了。碍于篇幅的限制，关于提高Web性能的技巧就不过多介绍了。想要了解前端的更多内容，可以关注博学谷资讯相关栏目。
— 申请免费试学名额 —
在职想转行提升，担心学不会？根据个人情况规划学习路线，闯关式自适应学习模式保证学习效果
讲师一对一辅导，在线答疑解惑，指导就业！
上一篇：
前端模块化相关面试题整理
下一篇：
什么是前端什么是后端？前端后端区别
相关推荐 更多
web前端网页开发离不开的三要素
Web前端是目前高薪岗位之一，是从最开始的页面开发不断发展优化而产生的一个特定的岗位。现在web前端开发一定会用到的三门技术：HTML、CSS、JavaScript。无论是多么炫酷的页面都是这三门技术的组合而形成的。
8832
2019-06-24 18:07:06
前端工程师必须了解的大前端跨平台解决方案
在各种平台多元化发展的同时，前端工程师要面对多种前端版本的开发，工作压力不断增大，因此前端工程师必须了解一下大前端，了解一下跨平台的解决方案。本文提供了目前比较实用的跨平台解决方案。希望对目前想提高的前端开发工程师有所帮助。
9532
2019-07-22 16:31:58
为什么要使用HTML5开发手机APP？
为什么要使用HTML5开发手机APP？从未来的发展趋势看，现在的大部分开发商都因为HTML5的便捷性而广泛使用它，而且使用HTML5可以带来更好的互动。从程序员开发的角度来讲，HTML5的代码更加清晰简单。下面我们就从HTML5的七大特性，来详细分析使用HTML5开发手机APP的优势。
6386
2019-10-10 16:55:06
CSS基础教程学习大纲规划
在网页开发的过程中，使用 CSS可以极大地提升工作效率，因此学习CSS是每个前端开发者的必经之路。本文主要以博学谷《HTML+CSS入门基础教程》为例，为大家介绍一下CSS基础教程的学习大纲。希望还在对学习CSS感到无处下手的朋友一些学习大方向的指导。如果大家对课程内容感兴趣，也可以直接上博学谷官网进行免费视频教程的学习。
5724
2020-02-28 15:43:20
JavaScript基础教程新手入门必看
对前端稍微有点了解的初学者都知道，JavaScript是必不可少的工具。毫不夸张的说，大部分网页都使用了JavaScript，想要成为一个优秀的前端工程师，做出漂亮令用户满意的网页，熟练掌握JavaScript是一个必备技能。本文为新手整理了一篇JavaScript基础教程入门指南，希望可以帮助编程小白可以更加轻松的掌握JavaScript。
4935
2020-03-29 12:06:46
