公司在组织开展前端性能测试(主要测试前端渲染的性能),有大神可以推荐一款免费开源的,并且可以实现自动化的工具吗? 这里的前端渲染,可能更多的想发现 js、html、css,是否导致了前端渲染的压力。
lighthouse
webpagetest
前端性能有好几个细分领域,常见的有资源加载速度(lighthouse)、不同地理位置的网络加载速度(各种测速类网站)、开始加载后白屏时间(除了录屏外不大了解还有什么工具)、运行时 FPS 等性能数据(chrome 浏览器的 Performance 选项卡里就有)。
从楼主描述的意思看,应该是最后一个?
1.lighthouse 生成的报告给到开发,对他们的帮助较小; 2.白屏时间,算是一个测试方向,目前好像没有好的工具…… 3.在 chrome 的 performace,如何遍历多个页面呢?
这个用过,开发的回复是不能直观的告诉他问题出在哪
这个和 lighthouse 类似吧
额,为啥要遍历多个页面呢?你能先说明下,你到底要测试的是前端的什么性能不?
这几个方向的目的是有一定差异的
资源加载速度(lighthouse):基本目标是尽可能有效整合资源/懒加载非立即需要的资源,在网速不变的情况下,减少加载网页所需的总网络请求数(浏览器内部并行网络请求是有限制的,资源太多会导致要等前面加载完才有机会开始加载,减慢加载速度)。常用举措有资源整合和资源拆分(弄懒加载用)
不同地理位置的网络加载速度(各种测速类网站):基本目标就是加快网速,常用举措是增加 CDN 节点。
开始加载后白屏时间:这个实际是用户体验优化了。在前两者已经没有可优化的点的时候,尽量降低白屏时间。常用举措有骨架屏、懒加载等。
运行时 FPS 等性能数据:这个更多是一个界面流畅度问题的 profile 工具,即通过采集和性能及运行内容有关的数据,辅助定位性能问题。常见使用场景是界面卡顿时定位卡顿原因用。
PageSpeed Insights (by Google) 我现在就在用,很简单,很直观
https://github.com/Xceptance/XLT
好的,感谢,已经解决了我的疑惑