Problem/Motivation
jQuery used to be so awesome and It has been with us since Drupal 5.0!
IE10 was released in 2012 and supported most (all?) of the vanilla javascript that is needed to replace jQuery code.
Using vanilla javascript would allow us to remove jQuery from Drupal core as a dependency.
Proposed resolution
The web is full of great resources for making the switch:
- https://www.evermade.fi/replacing-jquery-native-javascript-projects/
- http://youmightnotneedjquery.com/
- https://www.previousnext.com.au/blog/removing-jquery-from-your-drupal-theme
- https://css-tricks.com/now-ever-might-not-need-jquery/
Remaining tasks
Relevant issues and their status as of Dec 17, 2020
Including the date here as the summaries may go out of date -- but I think it's useful to have here as we have enough tabs open already.
| #3191023: Add eslint rules to check for jQuery usage | Adding eslint checks for jQuery use will make it easier to assess how much jQuery remains, and to prevent new uses from being added. |
| #3145958: Re-evaluate use of Backbone.js in core | This might be relevant to removal of jQuery, it might not. Here's why: Vue is one of the proposed replacements for Backbone. Were Vue available as a library in Core, it may significantly change the way that overall jQuery removal is approached. Some jQuery uses could be more elegantly replaced by Vue vs. a vanillaJS refactoring.Note that that the proposed use of Vue in that issue is as a libary to benefit existing core JS, something that is dependent of the React based built-from-scratch Admin UI decision made in 2017. |
| #3179551: Provide no-library equivalents of common/useful jQuery functions | Determining how to best have access to frequently-used jQuery functionality that do not have simple vanilla replacements |
| #3167377: Rewrite jQuery .show() and .hide() | This includes a potential approach for dealing with some of the requirements of #3179551: Provide no-library equivalents of common/useful jQuery functions |
| #3176438: IE11 JS does not support the :scope pseudo-class | If core has to continue supporting IE11, this will likely be an obstacle to going vanilla. No solutions/polyfills proposed yet. |
| #3176441: JavaScript event handling without a full Jquery dependency. | There's no simple replacement for how Drupal core uses jQuery event handling. Help us figure out how to best go about this! |
| #1651344: Use color input type in the color.module | Needed to remove dependency on jquery.farbtastic. Proposed solution requires Release Manager approval, but could benefit from community feedback in the meantime. |
| #3157328: Use vanilla JS instead of jQuery in path module | Work hasn’t started on this yet, someone can hop on this. A proof-of-concept issue to see if “replace jQuery in *.module” issues will be a good approach. |
| #3177355: Remove Tabledrag's jQuery dependency | There’s a working patch for this, but it also happens to raise many implementation questions about how to go about replacing jQuery overall. Feedback is VERY welcome. Even people without tabledrag-specific interests may want to check this out as it is representative of many of the obstacles we'll run into in the no-jQuery efforts. |
| #3051766: Deprecate and replace jQuery Joyride (for tours) | Very close to complete, could use some review! |
| #2402103: Add once.js to core | The work is largely complete, and is mainly waiting on governance decisions at the moment |
Replacements
The total size of helper libraries must be lower than minified jquery which is 88kb today + 0.9kb for jquery once.
| library | replacement | size | issue |
|---|---|---|---|
| once | Vanilla JS | 1.3kb | #2402103: Add once.js to core |
| events | TBD | ?? | #3176441: JavaScript event handling without a full Jquery dependency. |
| ajax | TBD | ?? | [#] |
| Total | ?? | (jquery + once: 88.9kb) | |