如何进行页面性能测试？

Question

如何进行页面性能测试？

javascripthtmlperformancetesting

8

我知道所有阅读这个问题的人都会马上想到“Firebug！”。也许有些人会想到“YSlow！”和“Google Page Speed！”

虽然我非常喜欢这些工具，但我更关心页面在IE 6/7/8中的快速渲染。上述所有工具都需要使用Firefox浏览器。这很好，你肯定可以测试将页面传递给浏览器的底层速度，但是当涉及到实际呈现页面时怎么办呢？

我还没有看到关于如何在浏览器级别测试优化的真正好答案。您如何编写HTML/JS的性能测试以跨不同浏览器运行？

- Travis

7个回答

4

您可以使用IE高性能测试工具。

- cgp

这不是更多关于JavaScript引擎性能而非HTML渲染引擎性能吗？ - jrharshath

4

您可以在IE（和Opera和Safari）中获取Firebug：

http://getfirebug.com/lite.html

。

- Matthew Groves

非常好！这是我第一次听说这些版本。 - Travis

2

在文档的开头和结尾放置一个脚本块，并设置window.onload。在每个“序列点”上通过Number(new Date)获取当前时间戳，以此可以以与浏览器无关的方式得到页面渲染所需的大致时间。

- Christoph

1

我并不自称知道绝对的答案。但其中一种方法是：

使用像wget这样的工具来测量页面获取所需的时间
使用像firebug这样的工具来测量整体速度
差异给出了浏览器所需的时间

虽然这可能不是完全令人满意的答案，但我会观察到这是最简单的。

顺便问一下，您认为使用“浏览器级别测试”可以突出哪些性能方面，而使用“firebug级别测试”则无法突出呢？

祝好，

jrh

- jrharshath

我想我感觉缺少的部分是Trident与Gecko的渲染方式。 - Travis

0

我非常喜欢AOL的PageTest工具，它将Firebug、YSlow和PageTest中发现的许多实用程序结合在一起，并用一个漂亮的Web界面包装起来，还有一些不错的功能。首先，它可以在IE7或IE8（抱歉，没有6）上运行，从美国或国际位置运行，以便更好地了解性能。它提供类似于Firebug网络面板中的瀑布图表，这对于确定时间花费在哪里很有用。它还提供了与YSlow类似的修复建议。最后，它允许您在同一站点上运行多个试验，以便您可以获得更准确的结果，同时最小化外部因素。

在大多数情况下，我会同意OrbMan的观点，即优化所有浏览器都很重要。由于这些优化是跨浏览器的，因此在性能方面你会得到最大的回报。只有在这之后才考虑特定于浏览器的改进。

有很多关于提高网页性能的Google技术讲座可在网上观看。这篇博客文章包含了与该话题最相关的讲座列表。

- jkupferman

0

WebWait 在任何浏览器中都可以使用。

这是你的网页性能工具包中又一个值得拥有的工具。

- Nosredna

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- D'Arcy Rittich · Accepted Answer

我不确定仅针对一个供应商进行优化是否有用：

关于HTML，大多数浏览器都是为标准布局技术（表格、无表格等）进行优化的
IE6和IE8之间的渲染引擎非常不同，因此这已经像是两个不同的浏览器了
大多数优化技术在各种浏览器中都是标准的（将JavaScript放在底部以避免阻塞页面加载、将JavaScript移动到外部文件、使用多个主机名来加载图片以利用并行加载、不要使用表格进行整体布局、确保缓存头正确等）
一旦您的网站针对Firefox进行了优化，我认为除了在应用程序级别上做更多工作（优化查询等），在IE上微调可能没有太多收益；除非您的网站主要是静态内容，在这种情况下，您可以研究缓存、HTTP压缩等。
如果您关心的实际上是优化IE的Javascript代码，则有许多良好的跨浏览器Javascript库正在进行最佳执行时间的竞赛，因此选择跨浏览器解决方案是正确的方式。
浏览器环境不断发展，您的客户可能会在将来转移到另一个平台；现在优化几个不同的浏览器将最终得到更兼容的代码，这样在将来进行平台更改时更有可能表现良好。
我认为编写跨浏览器优化的代码将导致一个更易于维护的代码库，其中包含较少的神奇IE hack，其存在理由很快就会消失在时间的迷雾中。