5

在从服务器返回初始正文后，我有兴趣测量和记录我们的页面加载性能。换句话说，一旦浏览器拥有了 HTML，当它完成加载页面上的所有图像、css 和 javascript 并完成渲染和执行第一个 jquery 就绪块时。

对此进行性能测试的最佳方法是什么？我读过的大部分内容都倾向于关注服务器响应和数据下载。但是，用户等待的大部分时间都是在此之后。有什么可以以自动化的方式帮助解决这个问题吗？

4

3 回答 3

3

Chrome 在开发者工具中有一个内置的分析器。CTRL+SHIFT+I在 PC 或Cmd+option+JMac 上。

使用 jQuery，DOM 就绪将在窗口加载之前发生。所以像这样的东西应该告诉你 DOM 负载和资产负载之间的差异：

// When the DOM is loaded
$(function(){
    console.log('Start ' + new Date().getTime());
});

// When all the images are loaded
$(window).load(function(){
    console.log('End ' + new Date().getTime());
});
于 2013-02-25T21:24:03.530 回答
3

您可以尝试关注真实的用户监控服务，这些服务可以清楚地了解您的用户如何实时体验您的网站或 Web 应用程序。

于 2015-09-29T06:13:48.307 回答
1

Web 性能优化 (WPO) 行业用于监控前端性能的首选工具是 WebPagetest。它为您提供了对网页全部负载的非常详细的分析，包括一个瀑布图，该图向您展示了 Web 浏览器如何加载每个资产以及您可能遇到的问题。您还可以获得关键浏览器事件、幻灯片和视频的屏幕截图。它确实是一个了不起的开源工具，它的首席开发人员受雇于谷歌。

http://www.webpagetest.org

WebPagetest 虽然不是一个自动化的解决方案。SpeedCurve 是一项在 WebPagetest 之上运行的商业服务，用于自动化测试过程并监控您的前端性能。它还将您的网站与竞争对手进行基准比较，并提醒您网站构建存在的问题。免责声明：我是 SpeedCurve 的创建者。

http://speedcurve.com

于 2013-08-17T09:59:10.407 回答