Title: Better code downloading with AJAX Author: Alex Kirk Published: October 10, 2005 --- # Better code downloading with AJAX October 10, 2005 I’ve been playing with Code downloading (or Javascript on Demand) a little more. [Michael Mahemoff](http://www.softwareas.com/ajax-can-improve-performance-too) pointed me at his great [Ajaxpatterns](http://www.ajaxpatterns.org/) in which he suggests a [different solution](http://ajaxpatterns.org/On-Demand_Javascript): ` if (self. uploadMessages) { // Already exists return; } var head = document.getElementsByTagName(" head")[0]; var script = document.createElement('script'); script.type = 'text/javascript'; script.src = "upload.js"; head.appendChild(script); Via DOM manipulation a new script tag is added to our document, loading the new script via the ‘src’ attribute. I have put [a working example here](https://alex.kirk.at/area7/2005/10/10/). As you can see this does not even need to do an XmlHttpRequest (XHR later on) so it will also work on browsers not supporting that. So why use this approach and not mine? Initially I thought that it was not as good as doing it via XHR because you receive a direct feedback (i.e. a function call) when the script has been loaded. This is per se not possible with this technique. But as in good ol’ times a simple function call at the end of the script file will do the same job (compare source codes from [the last example](https://alex.kirk.at/area7/2005/10/05/) and [this one](https://alex.kirk.at/area7/2005/10/10/) (plus [load.js](https://alex.kirk.at/area7/2005/10/10/load.js))). Using this method to load code later on also provides another “feature” (thanks for that hint to [Erik Arvidsson](http://erik.eae.net/)): Unlike XHRs Firefox also provides a cache for scripts loaded that way. There seems to be a disagreement about whether this is a bug or a feature (people complaining that IE caches such requests while it could be quite useful in this scenario). When using dynamically generated javascript code you will also have to keep your HTTP headers in mind (scripts don’t send them by default). The headers `Cache-Control` and `Last-Modified` will do usually (see [section 6.1.2 of my thesis](https://alex.kirk.at/papers/caching-strategies/diploma_thesisch6.html#x17-730006.1.2)) The method above is also the method used by [Dojo](http://www.dojotoolkit.org/), a developer ([David Schontzler](http://stilleye.com/)) commented, too. He says that Dojo also only loads the stuff the programmer needs, so little overhead can be expected from this project. Also [Alex Russell](http://alex.dojotoolkit.org/) from Dojo left a comment about [bloated javascript libraries](https://alex.kirk.at/2005/10/03/bloated-ajax-applications-due-to-libraries/). He has some good points about script size to say ([read for yourself](https://alex.kirk.at/2005/10/03/bloated-ajax-applications-due-to-libraries/#comments)), I just want quote the best point of his posting: So yes, large libraries are a problem, but developers need some of the capabilities they provide. The best libraries, though, should make you only pay for what you use. Hopefully Dojo and JSAN will make this the defacto way of doing things. So hang on for Dojo, they seem to be on a good way (coverage of Dojo to follow). Finally I want to thank you all for your great and insightful comments! ajax, dojo, code downloading, javascript on demand, caching, http headers [Ajax](https://alex.kirk.at/category/code/ajax/), [Code](https://alex.kirk.at/category/code/), [PHP](https://alex.kirk.at/category/code/php/) Read this next [No Google Office To Be Expected](https://alex.kirk.at/2005/10/09/no-google-office-to-be-expected/) ## 3 responses to “Better code downloading with AJAX” 1. ![Michael Mahemoff Avatar](https://secure.gravatar.com/avatar/19bf57e57589a1d5207f96a85d592a8f40e502b88d8b13b057eca89e82264a58? s=48&d=mm&r=g) 2. [Michael Mahemoff](http://ajaxpatterns.org) 3. [October 11, 2005](https://alex.kirk.at/2005/10/10/better-code-downloading-with-ajax/comment-page-1/#comment-22) 4. Great stuff! I need to add some discussion of caching in On-Demand Javascript. 5. I was interested in Eric’s comment wrt XHR caching and Firefox and found this link – [https://bugzilla.mozilla.org/show_bug.cgi?id=268844](https://bugzilla.mozilla.org/show_bug.cgi?id=268844)– which confirms there was a bug, 6. And the commentary there links to an interesting comment in the WHATWG webapp spec: “In particular, UAs must not automatically set the Cache-Control or Pragma headers to defeat caching.” [http://whatwg.org/specs/web-apps/current-work/#setrequestheader](http://whatwg.org/specs/web-apps/current-work/#setrequestheader) 7. [Log in to Reply](https://alex.kirk.at/wp-login.php?redirect_to=https%3A%2F%2Falex.kirk.at%2F2005%2F10%2F10%2Fbetter-code-downloading-with-ajax%2F) 8. ![Alexander Kirk Avatar](https://alex.kirk.at/wp-content/uploads/sites/2/2025/ 06/cropped-2025.Alex-512x512-1-48x48.jpg) 9. [Alexander Kirk](http://alex.kirk.at/) 10. [October 11, 2005](https://alex.kirk.at/2005/10/10/better-code-downloading-with-ajax/comment-page-1/#comment-23) 11. I haven’t yet had time to approve Erik’s comment myself (by trying it out) but it did some research on the web which seemed to approve it. 12. Furthermore I had a look at the [Source code part](http://lxr.mozilla.org/seamonkey/source/extensions/xmlextras/base/src/nsXMLHttpRequest.cpp#1581) where a comment says: ` 1581 // Bypass the network cache in cases where it makes no sense: 1582 // 1) Multipart responses are very large and would likely be doomed by the 1583 // cache once they grow too large, so they are not worth caching. 1584 // 2) POST responses are always unique, and we provide no API that would 1585 // allow our consumers to specify a "cache key" to access old POST 1586 // responses, so they are not worth caching. 13. So, when using a GET request for loading data via XHR it should indeed be cached. I will verfiy this. 14. [Log in to Reply](https://alex.kirk.at/wp-login.php?redirect_to=https%3A%2F%2Falex.kirk.at%2F2005%2F10%2F10%2Fbetter-code-downloading-with-ajax%2F) 15. ![Erik Arvidsson Avatar](https://secure.gravatar.com/avatar/c9e45c66e3481626cec0d7e65e7ff0adeb8ec36abec2c51340b15e137c6693e4? s=48&d=mm&r=g) 16. [Erik Arvidsson](http://erik.eae.net/) 17. [October 12, 2005](https://alex.kirk.at/2005/10/10/better-code-downloading-with-ajax/comment-page-1/#comment-30) 18. I have looked at the code for Mozilla but like you I haven’t really found where the bug is. I assume the bug is that they do not add the if-modified-since header and therefore the files will always be redownloaded from the server. 19. It is pretty easy to see what goes on in Mozilla using Live HTTP Headers. Then you’ll see that it totally ignores last-modified. 20. [Log in to Reply](https://alex.kirk.at/wp-login.php?redirect_to=https%3A%2F%2Falex.kirk.at%2F2005%2F10%2F10%2Fbetter-code-downloading-with-ajax%2F) ### Leave a Reply 󠀁[Cancel reply](https://alex.kirk.at/2005/10/10/better-code-downloading-with-ajax/comment-page-1/?output_format=md#respond)󠁿 Only people in [my network](https://alex.kirk.at/friends/) can comment. This site uses Akismet to reduce spam. [Learn how your comment data is processed.](https://akismet.com/privacy/)