When a browser sees a <script> element that loads an external script, it blocks the fetching of resources referenced in the markup after the script until the external script is fetched. So, the delay of a single script will delay the loading of everything else after it.
With speculative parsing, when the script fetching is slowed or delayed, the browser will continue parsing markup (off the main thread for example) to look for resources to fetch. If any are found, the browser fetches them while it's waiting for the fetching of the script to complete. This means that by the time the script is fetched, all the resources after it might already be fetched and the page could load and display faster.
However, there are things an author should avoid
so that speculative parsing doesn't lose its advantages.
Firefox, Safari, Chrome and IE support speculative parsing in one form or another. Opera does not, not even in the HTML5 parsing builds
. This means that Opera might load some pages slower than other browsers.
Now, Opera does support something called Delayed Script Execution
, which delays the executing of scripts and lets other resources load first. This can sometimes make pages load faster than what speculative parsing does in other browsers.
However, Delayed Script Execution can break some scripts on some pages, just because of how it works, but also because it has some bugs, which means that you can't have it enabled globally so that it's enabled for all sites. But, turning it off for some sites isn't really supported in Opera's site preferences. You have to create a site preference for the domain and close down Opera. Then, in override.ini, you have to add Extensions|DelayedScriptExecution=0 under the section for that site. This pretty much makes this feature a no-go except for advanced users.
To create a demo, you could do something like this:
echo 'var x = 44;';
What you should see in a case like this is that once the script is fetched, in Opera, it'll start downloading the image where it paints it line-by-line as it's downloaded, where as in other browsers, you'll see that once the script is fetched, the image will instantly display in full (because it has already been downloaded). Remember to test with a clean cache and a large enough pic file.
You can also see a TC in this Mozilla bug
, with the webkit bugs mentioned here
Now, supposedly, implementing this isn't very easy and each browser that does this might do it differently. But, other browsers at least do something in this area to improve page loading performance.