Skip to content Skip to sidebar Skip to footer

JavaScript Being Loaded Asynchronously In Firefox 3 (according To Firebug)?

I'm trying to profile the performance of a web site that I'm fairly confident is being slowed down by the loading of JavaScript files on the page. The same JavaScript files are inc

Solution 1:

Javascript resource requests are indeed blocking, but there are ways around this (to wit: DOM injected script tags in the head, and AJAX requests) which without seeing the page myself is likely to be what's happening here.

Including multiple copies of the same JS resource is extremely bad but not necessarily fatal, and is typical of larger sites which might have been accreted from the work of separate teams, or just plain old bad coding, planning, or maintenance.

As far as yahoo's recommendation to place scripts at the bottom of the body, this improves percieved response times, and can improve actual loading times to a degree (because all the previous resources are allowed to async first), but it will never be as effective as non-blocking requests (though they come with a high barrier of technical capability).

Pretty decent discussion of non-blocking JS here.


Solution 2:

I'm not entirly sure that Firebug offers a true reflection of what is going on within the browser. It's timing for resource loading seems to be good but I am not sure that it is acting as a true reflection of exactly what is going on. I've had better luck using HTTP sniffers/proxy applications to monitor the actual HTTP requests coming from the browser. I use Fiddler, but I know there are other tools out there as well.

In short, this many be an issue with the tool and not with how resources are actually being loaded ... at least worth ruling out.


Solution 3:

I suppose you're using Firefox 3.0.10 and Firebug 1.3.3 since those are the latest releases.

The Firebug 1.4 beta has done many improvements on the net tab, but it requires Firefox 3.5. If you want to test it in Firefox 3.0, use one of the previous 1.4 alpha versions. But even with the improvements I still struggle to understand the result. I wish the Firebug developers would document more precisely what each part of a download means. It doesn't make sense to me why queuing is after connecting.

My conclusion was not to trust the results in Firebug, and ended up using the WebPageTest. Which was surprisingly good to come from AOL ;-)

Also, what kind of resources are being loaded at the same time as the javascript? Try tracing down the resources that are loaded at the same time, and see if it's referenced in a css/iframe/html-ajax. I'm guessing the reason why nothing else is loaded, is because the browser stops parsing the current HTML when it sees a script tag (without defer). Since it can't continue parsing the HTML, it has nothing more to request.

If you could provide a link to the page you're talking about. It would help everyone to give a more precise answer.


Solution 4:

I believe that the content is downloadeded, but not rendered until the JavaScript is finished loading.

This is, from the server's POV, not much of a deal, but to the user it can make a huge difference in speed.


Solution 5:

If you think about it a tag has to finish processing before you can continue to render content. What if the tag used document.write or some other wonderfully dumb thing? Until anything within the script tag has finished running the page can't be sure what it's going to display.


Post a Comment for "JavaScript Being Loaded Asynchronously In Firefox 3 (according To Firebug)?"