如何使用 Firebug 判断导致页面加载缓慢的原因?
我正在处理一个复杂的页面,其中包含多个脚本、CSS 文件、大量动态生成的 HTML、加载脚本的脚本以及各种疯狂的东西。当然,有时页面加载速度会很慢。
我发现很难实时判断到底是什么减慢了速度。 Firebug 的“net”选项卡可以帮我解决这个问题吗?当然,我已经查看了“net”选项卡,但它似乎只显示加载后的文件。还有其他工具可以帮助我吗?我想要的是能够看到页面仍在加载,并准确地看到仍在加载的内容。
FireFox 的状态栏告诉我一些信息...它显示“正在等待 www.mydomain.net”,但它没有告诉我它正在等待哪个文件。我假设有一个文件是这里的瓶颈,它阻止所有后续文件加载,但我承认,我不太了解浏览器如何获取文件的细节。
I'm working on a complex page with multiple scripts, CSS files, lots of dynamically generated HTML, scripts loading scripts, and all kinds of crazy stuff. Naturally, the page can load quite slow sometimes.
I'm finding it difficult to tell, in realtime, what exactly is slowing it down. Can Firebug's "net" tab help me with this? I've looked at the "net" tab, of course, but it seems that it only shows files after they're loaded. Is there another tool that can help me? What I want is to be able to see that the page is still loading, and see exactly what's still loading.
FireFox's status bar tells me a little bit... it says "Waiting for www.mydomain.net", but it doesn't tell me exactly which file it's waiting for. I'm assuming there is a single file that's the bottleneck here, that's blocking all subsequent files from loading, but I'll admit, I don't know that much about the nitty gritty of how browsers fetch files.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(6)
有一个名为 YSlow 的 Firefox 插件应该会有所帮助。
There is a plugin called YSlow for Firefox that should help.
在控制台选项卡上 - 单击配置文件...它将帮助您查明哪些功能运行缓慢。
我还强烈推荐 Firebug 的 YSlow 插件。它将帮助诊断许多问题,从缓存和 gzip 压缩到可能减慢速度的 HTTP 请求数量。
On the Console tab - click profile... it will help you pinpoint which functions are running slow.
I also highly recomend the YSlow addon for Firebug. It will help diagnose lots of issues from caching and gzipping to the number of HTTP requests that might be slowing things down.
还有 Google Page Speed,它的功能与 YSlow 类似。
There's also Google Page Speed, which does similar things to YSlow.
在这种情况下,您最好的选择是 Fiddler (独立程序),篡改数据,或实时标头(都是 Firefox 插件)。
每个都可以让您查看传入的 HTTP 请求。这些可以让您实时查看正在请求的内容,并且可以让您更深入地了解是什么挂起了您的网站。祝你好运!
Your best bet in that case would be something like Fiddler (stand-alone program), Tamper Data, or Live Headers (both Firefox plugins).
Each lets you see the HTTP requests as they come in. These give you real time views of what is being requested and should give you more insight into what is hanging your site up. Good luck!
如果您等到页面完成加载,Firebug 将在“网络”选项卡中向您显示花费了很长时间的文件。
我同意 Firebug 显示所有当前加载的文件会很棒。
If you wait until the page does finish loading, Firebug will show you the file that took so long in the Net tab.
I agree that it would be great for Firebug to show all of the currently loading files.
如此复杂的事情必然还有改进的空间。
我不是 Firebug 专家,但是您可以暂停执行并查看它在做什么以及为什么吗?如果您这样做几次,您应该能够发现不必要的时间支出。
Something that complicated is bound to have room for improvement.
I'm not a Firebug expert, but can you pause the execution and look to see what it's doing and why? If you do that a few times, you should be able to spot time expenditures that aren't really necessary.