你如何衡量页面加载速度？

Question

我试图量化"网站的缓慢".在过去,您只需确保HTML是轻量级的,图像优化且服务器不会过载.在建立在现代内容管理系统之上的高端站点中,存在更多变量:第三方广告,跟踪器和各种其他标注,CDN的性能(有趣的是,有时内容传送网络使事情变得更糟),javascript执行,css超载,以及各种服务器端问题,如长查询.

显而易见的答案是每个开发人员清除缓存并不断查看Firebug插件的"net"部分.还有其他什么方法可以衡量"网站拖屁"吗？

Answer 1

Yslow是一个应该帮助你的工具(浏览器扩展).

YSlow根据雅虎的高性能网站规则分析网页以及为什么它们变慢.

Answer 2

Firebug是Web开发人员必须拥有的Firefox扩展,可以测量网页上不同元素的加载时间.至少你可以排除CSS,JavaScript和其他元素需要花费太多时间来加载.

如果你确实需要缩短JavaScript和CSS的加载时间,那么Web上就有各种各样的JavaScript和CSS压缩器,只需从换行符中取出不必要的文本,如换行符和注释.当然,为了发展起见,请保留一个普通版本.

如果你使用PNG,我最近遇到了一个PNG优化器,可以缩小称为OptiPNG的 PNG大小.

Answer 3

"页面加载时间"通常不容易定义.这取决于您使用的浏览器,因为不同的浏览器可以并行执行更多请求,因为javascript在不同的浏览器中具有不同的速度,并且因为渲染时间不同.

因此,您只能使用您感兴趣的浏览器来真正测量您的真实页面加载时间.页面加载的结束也很难定义,因为在页面上的所有内容都可见之后可能存在Ajax请求.这会计算页面加载吗？

最后但并非最不重要的是,真正的页面加载时间可能并不重要,因为"感知性能"才是最重要的.对于用户来说重要的是什么时候他们有足够的信息来进行

马库斯

我不知道任何方式(至少我没有告诉你:))会自动测量你的页面感知加载时间.

使用AOL Pagetest for IE和YSlow for firefox(链接见上文)以获得加载时间的"感觉".

Answer 4

安装适当的调试代理(我完全推荐Charles)

您不仅可以看到响应时间/大小的完整细分,还可以保存数据以供以后分析/比较,以及摆弄请求/响应等.

(编辑:Charles对调试SOAP请求的支持是值得的,它的共享软件费用微不足道 - 它本周就为我节省了半天的脱发!)

Answer 5

我经常使用pagestest.org，您可以使用它在不同的浏览器（尽管只有 msie 7-9）上执行不同位置的性能测试（尽管只有 msie 7-9），具有不同的设置（迭代次数、连接速度、第一次运行与第二次访问，不包括特定的请求，如果需要，凭据，如果需要，...）。

结果是一份非常详细的页面加载时间报告，其中还提供了有关如何优化的建议。

它真的是一个很棒的（免费）工具！