Remove jQuery dependency

[gravityrail]

What follows is a list of files that we have detected jQuery-like syntax in, listed in approximate priority order.

Prioritisation was based on the following(rough) criteria:

• is the asset enqueued on the front-end of a site, where performance is most critical?
• how often is the asset rendered, based on rough popularity and how it's implemented?

In eliminating these uses of jQuery, you may find this web site useful: http://youmightnotneedjquery.com/

Files

The following list of files was generated using eslint. Don't forget, once you modify a file, to remove jquery as a dependency wherever that file was enqueued.

Front-end

Carousel

• modules/carousel/jetpack-carousel.js

Tiled Gallery

• modules/tiled-gallery/tiled-gallery/tiled-gallery.js

Related Posts

• modules/related-posts/related-posts.js

Sharing Buttons

• modules/sharedaddy/admin-sharing.js
• modules/sharedaddy/sharing.js

Gutenberg

• modules/calypsoify/mods-gutenberg.js
• modules/calypsoify/mods.js

Contact Forms

• modules/contact-form/js/editor-view.js (these both in progress by @davidlonjon )
• modules/contact-form/js/grunion-admin.js

Contact Info Widget

• modules/widgets/contact-info/contact-info-admin.js

EU Cookie Widget

• modules/widgets/eu-cookie-law/eu-cookie-law-admin.js

Likes

• modules/likes/post-count-jetpack.js
• modules/likes/post-count.js
• modules/likes/queuehandler.js (ready for review Likes: reimplement non-admin portions without jQuery #21726)
• _inc/postmessage.js Remove jquery dependency from postmessage.js #17592

Masterbar

• modules/masterbar/tracks-events.js

Post by Email

• modules/post-by-email/post-by-email.js

Misc Shortcodes (rarely used)

• modules/shortcodes/js/brightcove.js
• modules/shortcodes/js/gist.js
• modules/shortcodes/js/jmpress.js
• modules/shortcodes/js/main.js
• modules/shortcodes/js/quiz.js
• modules/shortcodes/js/recipes-printthis.js
• modules/shortcodes/js/recipes.js
• modules/shortcodes/js/slideshow-shortcode.js
• _inc/polldaddy-shortcode.js

Responsive Videos

• modules/theme-tools/responsive-videos/responsive-videos.js

Site Logo Control

• modules/theme-tools/site-logo/js/site-logo-control.js
• modules/theme-tools/site-logo/js/site-logo-header-text.js
• modules/theme-tools/site-logo/js/site-logo.js

Widget Visibility

• modules/widget-visibility/widget-conditions/widget-conditions.js

• modules/widgets/gallery/js/admin.js

• modules/widgets/milestone/admin.js

• modules/widgets/social-icons/social-icons-admin.js

• modules/widgets/twitter-timeline-admin.js

Comics

• modules/custom-post-types/comics/comics.js
• modules/custom-post-types/js/many-items.js
• modules/custom-post-types/js/menu-checkboxes.js
• modules/custom-post-types/js/nova-drag-drop.js

VideoPress

• modules/videopress/js/editor-view.js
• modules/videopress/js/videopress-plupload.js

Customizer

CSS Editor

• modules/custom-css/custom-css/js/css-editor.js
• modules/custom-css/custom-css/js/use-codemirror.js

Content Options

• modules/theme-tools/content-options/customizer.js

Customizer Utils

• modules/widgets/customizer-utils.js

Simple Payments

• modules/widgets/simple-payments/customizer.js

Infinite Scroll

• modules/infinite-scroll/infinity-customizer.js

WP-Admin

It might not be worth bothering removing jQuery from wp-admin, as on these pages performance is less of an issue, and they prrrrobably enqueue jQuery no matter what you do.

Comment Likes

• modules/comment-likes/comment-like-count.js

Just in Time Messages

• _inc/jetpack-jitm.js

Notices

• _inc/client/components/admin-notices/index.jsx

Jetpack Settings

• _inc/client/components/form/input-checkbox-multiple.jsx
• _inc/client/main.jsx
• _inc/jetpack-admin.js
• _inc/jetpack-modules.js
• _inc/jetpack-modules.views.js

Connection

• _inc/connect-button.js
• _inc/jetpack-connection-banner.js

Deactivate warning

• _inc/jetpack-deactivate-dialog.js

"Identity Crisis"

• _inc/idc-notice.js

Gallery settings

• _inc/gallery-settings.js

Plugin Search (unused)

• modules/plugin-search/plugin-search.js

MISC

I don't yet know the scope of these:

• _inc/jetpack-wizard-banner.js
• _inc/jquery.jetpack-resize.js (deleted; ready for review Likes: reimplement non-admin portions without jQuery #21726)
• _inc/lib/debugger/jetpack-debugger-site-health.js
• _inc/lib/tracks/tracks-ajax.js
• packages/debug-helper/modules/inc/js/xmlrpc-errors.js
• tools/jetpack-live-branches/jetpack-live-branches.user.js

[dero]

It might not be worth bothering removing jQuery from wp-admin, as on these pages performance is less of an issue, and they prrrrobably enqueue jQuery no matter what you do.

+1

[jeherve]

Noting that any effort in this direction will most likely help avoiding any conflicts that may come up when Core updates the version of jQuery bundled with WordPress:

• WordPress 5.5 compatibility #15388
• https://make.wordpress.org/core/2020/06/29/updating-jquery-version-shipped-with-wordpress/

[davidlonjon]

I'll have a go at

Contact Forms

• modules/contact-form/js/editor-view.js
• modules/contact-form/js/grunion-admin.js

[dero]

I'm starting to work on:

Tiled Gallery

• modules/tiled-gallery/tiled-gallery/tiled-gallery.js

[gravityrail]

@dero @davidlonjon - if you're working on something please update the description to put your name on it, and if possible a link to your PR, so we don't overlap.

[gravityrail]

I'll have a go at

Contact Forms

• modules/contact-form/js/editor-view.js
• modules/contact-form/js/grunion-admin.js

@davidlonjon Just make sure you aren't removing jQuery as a dep from anything shown in wp-admin. I am not really interested in wp-admin right now - only front-end code.

[davidlonjon]

I'll have a go at
Contact Forms

• modules/contact-form/js/editor-view.js
• modules/contact-form/js/grunion-admin.js

@davidlonjon Just make sure you aren't removing jQuery as a dep from anything shown in wp-admin. I am not really interested in wp-admin right now - only front-end code.

Ok thanks for the feedback. For info I have not done much work on this as I refocused my attention on our other project.

[sgomes]

Moved modules/comment-likes/comment-like-count.js to the wp-admin section, as it doesn't appear to be used outside of there. Dropping ongoing work there and picking up something else.

[gravityrail]

Noting here that we should use the wp-dom-ready package instead of jQuery.ready

https://developer.wordpress.org/block-editor/packages/packages-dom-ready/

[Aurorum]

I had a go at modules/shortcodes/js/gist.js in #16700. :)

[sgomes]

@gravityrail: Adding a note here that once the plan we've been discussing in #16592 (comment) has been finalised, we should probably document it and add a link to it on this issue.

[jeherve]

Noting that the modules/widgets/eu-cookie-law/eu-cookie-law-admin.js file currently generates a warning with Core's Enable jQuery Migrate Helper plugin:

Same in modules/calypsoify/mods.js: jQuery.fn.load() is deprecated

It may be worth prioritizing these files (and others that trigger such warnings) accordingly.

[jeherve]

@sgomes I know you had worked on removing jQuery dependencies at some point. Is that something that's still on you radar today?

[sgomes]

@jeherve I haven't looked at this in a while, but I seem to recall jQuery usage was fairly small at this point, outside of wp-admin (which is out of scope, as I see it).

Perhaps a new audit of jQuery usage in Jetpack is needed at this point, but I won't be able to pick that up in the foreseeable future 😕

[simison]

FYI for Forms:

• Forms: get rid of jQuery for date picker #41081