Monday, November 10, 2008

Don’t forget about the defer attribute for non-essential external scripts

I was recently reviewing a customers eCommerce site and I noticed that the “Please Wait” page that occurs after completing an order but before you view the order was taking a long time to load.  Using Firebug I traced the issue down to an external script that was taking it’s sweet time to download; it was for affiliate tracking on a 3rd party site.

I’m all for tracking, but not at the expense of performance.  Though I haven’t seen an affiliate/ad partner use the defer attribute on their script tags before, there is good reason for you to add it.  Consider the following example:


SlowRequest.aspx is just an ASP.NET page that after a 2 second delay, returns some JavaScript (not my finest code I might add)


Sure enough, for the first two seconds, all you see is


And finally (2 seconds later)


Luckily for this example, this information isn’t overly pertinent – but if it were my order status, it would be.  Luckily a quick defer=”defer” attribute on your script tag and the wait is gone; the external script is loaded after the DOM is ready:


1 comment:

Kale Co Jakim said...

Hi, Great.. Tutorial is just awesome..It is really helpful for a newbie like me.. I am a regular follower of your blog. Really very informative post you shared here. Kindly keep blogging. If anyone wants to become a .Net developer learn from Dot Net Training in Chennai. or learn thru Dot Net Training in Chennai. Nowadays Dot Net has tons of job opportunities on various vertical industry.
or Javascript Training in Chennai. Nowadays JavaScript has tons of job opportunities on various vertical industry.