Conditional Upload of jQuery: Paul Grenier and Christophe Humbert
My two favorite jQuery gurus Paul Grenier and Christophe Humbert had a quick email exchange regarding how to include conditional jQuery uploading in their scripts. I thought it would be enlightening for Power Users who have been following jQuery for Everyone and Path to SharePoint to see the discussion.
Here’s the exchange:
Christophe Humbert:
As workshop users want to include several Web Parts on the same page, I am looking for a way to include conditional jQuery loading. The most common methods are DOM insert and the document.write you are using. However, from what I read, it seems that both methods are asynchronous, which means that there is no guarantee that jQuery is loaded before the custom script starts executing.
How is this working for you? Have you noticed any weird behavior?
Paul Grenier:
That’s not entirely accurate because it depends on the browser. See this article: http://www.stevesouders.com/blog/2009/04/27/loading-scripts-without-blocking/ and look at the section about “preserves execution order”. Since we’re dealing with IE, you want either the defer method or the one I’m using to preserve order.
Christophe Humbert:
Thanks, the article you sent and the articles it points to look very interesting. From what I (quickly) read, it is not clear what the order will be between document.write and an inline script. I’ll need to take a closer look.
I am trying to make my scripts work cross-browser (for internet sites for example), not just IE. I agree about the defer option and I think I’ll try this first. It used to be IE only but it seems to be now accepted by most browsers: http://code.google.com/p/doctype/wiki/ScriptDeferAttribute
How does this true up with Jan Tielen’s Assembly-Free jQuery in SharePoint Sites Using the SmartTools jQueryLoader? Is his method better/worse/too complicated?
M.
Marc, I just found your comment.
From what I understand, Jan’s method pushes code into the Master Page. Using a CEWP is a lighter approach as it doesn’t unghost pages and can be easily removed. I’d use Jan’s method if the site heavily relies on jQuery.
xLazyLoader will be included in jQuery 1.4:
http://code.google.com/p/ajaxsoft/wiki/xLazyLoader
This will facilitate conditional uploads.
I came across this slide deck:
http://stevesouders.com/docs/jquery-20090913.ppt
It provides several methods for script injection, along with results on script load order and execution order.
Please explain the point of loading a jQuery plugin to load jQuery (??). Even if it’s core jQuery, you still need to load jQuery on the page–but you don’t need to load it 10 times for 10 webparts.
Besides, this uses a bunch of setTimeouts to handle dependency with a default of 20 seconds (?!).
Just use the one-liner instead of 240 lines to do the same thing. Document.write is perfectly acceptable given the limitations of < IE 8.
The plugin is useful for other loads (like plugins), not jQuery itself :-)
Now you could also use it as a reference to write your own loading script for jQuery. I’ve seen a couple blogs like this, that publish standalone pieces of code inspired by jQuery or Dojo.
Such applications go further than just checking if a script is already loaded. They can also take into account dependencies and delay loading. I am not judge of the quality of this plugin, but I imagine it must be pretty good if the jQuery team has decided to make it part of its core script.
I agree about “document.write”, but purists will avoid it and prefer regular DOM methods (the same way they would avoid innerHTML).
The slide deck I mentioned in my last comment will certainly be more useful in practice.