Add a jQuery helper to the the MODX core?

I'm curious about what people think of making it more convenient to load jQuery in MODX.

So many people are using jQuery, and specifying (as they should) a specific version, that there could easily be 3 or 4 versions loaded at the same time, and it's a pain having to update the jQuery source in multiple extras with no easy way to keep your own in sync., and no way at all to sync. with other extras.

Looking at donshakespeare's wonderful TinyMCE_wrapper got me to thinking about how to handle this (this is mostly off the top of my head). What I'm thinking:

1. New System Setting: jquery_source -- holds the path to a recent jQuery CDN version, e.g. http://code.jquery.com/jquery-1.11.3.min.js, or a path to a local file. The benchmarks I've seen suggest that the jquery.com EdgeCast CDN has the fastest average load times. BTW, AFAIK, there is no longer a reliable way to load the latest version of jQuery -- both Google and jquery.com have stopped supporting this.

2. New $modx or $xpdo class variable: $jqueryLoaded

3. A convenience method in the $modx class: load_jquery()




Pros
- Convenience
- Reduced loading of multiple copies
- jQuery much more likely to be in the browser cache
- Synchronization across extras from different authors
- Faster page-load speeds for everyone
- Developers can still load a specific version of jQuery if they need to

Cons
- No easy way for developers to know which version of jQuery is loaded
- Potential for breaking extras when the System Setting is changed
- Slightly more baggage for MODX

In my experience, jQuery is pretty stable in the recent versions and the API works well across versions. IIRC, the API is the same for 1.7+ and jQuery 2+, the difference being that the 2.x versions no longer support older browsers. I doubt if changing the System Setting would cause much trouble.

This could also be done as an Extra that installed the System Setting and a snippet so that we could do this in our MODX Extras (though putting it in the $modx class is much cleaner, imo):



The snippet could set and check a jqueryLoaded $_SESSION variable, or create a new $modx class variable.

I'm wondering, though if it belongs in the core. I'm usually against crapping up the core, but I think this might make sense.

Thoughts?

Hmm. Several questions come to mind. Are we willing to concede that JQuery is that ubiquitous? There are a few other js libs gaining ground fast, and technology is moving on towards Web Components, with libs like Polymer to support them. Can we be so certain that JQuery will still be supreme a year from now, or five years from now, that we want to embed it in the core? Will this cause developers to feel constrained to use JQuery even if something else may actually be more appropriate for their use? And does something like that belong in the core in the first place?

jQuery, still undisputed.

Numbers
https://twitter.com/MaxCDN/status/612704366412308481
http://w3techs.com/technologies/overview/javascript_library/all

AngularJS
http://www.bennadel.com/blog/2752-using-jquery-instead-of-jqlite-in-angularjs.htm

React github repository.
https://github.com/facebook/react/tree/master/examples/jquery-bootstrap
https://github.com/facebook/react/tree/master/examples/jquery-mobile

jQuery vs React
http://hackflow.com/blog/2015/03/08/boiling-react-down-to-few-lines-in-jquery/

// internet is drunk http://mrhaw.com/webdev_internet_is_drunk [ed. note: mrhaw last edited this post 11 years, 3 months ago.]

Not universal, but fairly ubiquitous. This from Wikipedia:

As of 2015, jQuery remains the most widely used JavaScript library on the Web. According to JavaScript library analytics service, Libscore, jQuery is in use on over 63% of the top million most popular sites by traffic volume.[25] Notable sites using it include Twitter, LinkedIn, Pinterest, and eBay.

I think, this is something, what doesn't belong to the core.



should be enough in a snippet.
regClientStartupScript does allready a check, if the script was loaded.

Personally I'm not in favour of this because it's tied to a specific library (jQuery) while the problem of loading multiple versions of certain assets is not unique to that specific library.

Instead, I would personally like to see an extra argument added to the $modx->reg* functions that defines a name, and then MODX makes sure only one file for that name is loaded.

For example that could look like this:

and only one of those would get added to the page. That method could then be used for loading any library.

Quote from: Bruno17 at Jul 12, 2015, 06:30 AM

regClientStartupScript does allready a check, if the script was loaded.

It does, but only if it's the exact same file name. So two different addons both loading jquery from a different file will result in two versions of jquery being loaded.

In my projects, I only build roughly 10% with jQuery. If there was a service that would contact a 3rd party server, I'd make sure I would deactivate it. Like I have to do with gravatar every time I install MODX.

From my perspective: definately no. Dont make jQuery a core extra.

Quote from: markh at Jul 12, 2015, 06:33 AM

Personally I'm not in favour of this because it's tied to a specific library (jQuery) while the problem of loading multiple versions of certain assets is not unique to that specific library.

Agreed.

Quote from: markh at Jul 12, 2015, 06:33 AM

Instead, I would personally like to see an extra argument added to the $modx->reg* functions that defines a name, and then MODX makes sure only one file for that name is loaded.

For example that could look like this:

$modx->regClientScript('a/local/jquery.js', false, 'jquery');
$modx->regClientScript('another/jquery.js', false, 'jquery');

and only one of those would get added to the page. That method could then be used for loading any library.

That might be close to what we need but I don't think exact. Wordpress seems to handle this situation well (I know, I know). https://codex.wordpress.org/Function_Reference/wp_enqueue_script

Notice with Wordpress you don't just pass a name. You also pass the version and can even pass in sub dependencies. Maybe sub dependencies are overkill but I think the version is important when determining which of the multiple jQuery's to load (you'd probably want the newest when they are both 1.x) not whichever was added first or last.

In the interim I'd suggest abandoning regClientScript all together in favor of regClientHTMLBlock.

Then you could load jQuery h5bp style if and only if needed like this:
[ed. note: dinocorn last edited this post 11 years, 3 months ago.]

How about just adding a jquery_source System Setting? That way all extras on a site would have at least the option of using the same version without MODX having to parse the source to do a version check, and developers can choose their own method of loading jQuery.

I've read that window.jQuery throws an undefined error in some versions of IE, but I've never tested it. If that's true, (typeof jQuery != 'undefined') might be a better choice.