Skip to Content
Technical Articles
Author's profile photo Mauricio Lauffer

Get rid of jQuery in UI5, please

jQuery has been the most used JavaScript framework ever created. It took web development out of the Dark Ages and brought some joy to web developers (no more fiddling with browser agents and conditional code). However, jQuery is not required in modern js apps anymore. As JS and CSS evolved, and the world moved away from Internet Explorer (hallelujah!!!), jQuery has become outdated and old-fashioned. OpenJS Foundation has updated the jQuery UI and jQuery Mobile projects to “Emeritus” which means they’ve reached their lifecycle and are retired.

jQuery%20joke

jQuery joke

 

Somehow, UI5 is the only active modern JS framework still using jQuery. Nobody likes it any longer. It bloats the UI5 framework and brings no real value anymore. Now, with the latest UI5 long-term maintenance v120 released, it seems we’re entering a new era!

If your pastime is reading CHANGELOGs, you may’ve noticed that heaps of APIs have been deprecated and a lot of jQuery code has been replaced by native vanilla JS! I have no idea when SAP will get rid of jQuery for real, but I believe it won’t take long (in SAP time it might be a decade or so 😜). It’s about time to get rid of it!

That said, I think we, as a community, could help with that. I’ve been contributing to UI5 for a long time, and I love replacing jQuery stuff with vanilla JS! I’ve created a new git branch with some ESLint rules, eslint-plugin-no-jquery, to find jQuery in UI5 codebase. This makes finding and replacing jQuery much easier.

Git clone my fork, and checkout the no-jquery branch. Then, install the dependencies and run ESLint with the no-jquery rules!

git clone https://github.com/mauriciolauffer/openui5.git
git checkout no-jquery
npm ci
npm run lint:jquery

 

If you want to focus on a specific issue only, remove all the rules you do not want from the file .eslintrc-nojquery.json and leave just the rule you want to work on.

{
	"root": true,
	"env": {
		"browser": true,
		"es2022": true,
		"jquery": false
	},
	"globals": {
		"sap": true,
		"jQuery": false
	},
	"plugins": [
		"no-jquery"
	],
	"extends": ["plugin:no-jquery/all"],
	"rules": {
		"no-jquery/no-closest": "error"
	}
}

no-jquery%20results

no-jquery results

 

Join me on this herculean task 🥲

You may learn a trick or two during the hunt, and I’m sure you’ll understand UI5 even more. Perhaps SAP feel sorry for us and speed up the process, then we can finally have a nice and clean UI5 codebase.

Follow some links that will help you on replacing jQuery by vanilla JS alternatives:

 

Assigned Tags

      6 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Frank Li
      Frank Li

      Not aware of Get rid of jQuery in UI5, are there any official announcement from SAP NOT TO use jQuery in SAP UI5 application?

      Author's profile photo Mauricio Lauffer
      Mauricio Lauffer
      Blog Post Author

      I changed the title to avoid any confusion.

      No, there's no official announcement from SAP. This is just common sense and best practices everywhere JS is used.

      Author's profile photo Daniel Rose
      Daniel Rose

      "Somehow, UI5 is the only active modern JS framework still using jQuery"

      The reason being that it is unusual for a JS framework to survive for so long, while being backwards compatible and also keeping up to date with new developments. This is a completely underrated quality of UI5. Your custom UI5 app from years ago? Still up and running on the current S/4 release!

      Author's profile photo Mauricio Lauffer
      Mauricio Lauffer
      Blog Post Author

      That's not accurate. UI5 apps from years ago won't run in latest UI5 versions. They keep running because they're still using old UI5 versions, not latest.

      SAP has already introduced breaking changes in the codebase before, the main ones being on v1.30 and v1.88. Get any app built on v1.28 and try to run it with v1.71 and tell me what happens. Get any app built 5 years ago and try running with the latest UI5 version. Same.

      Angular is older than UI5 and doesn't use jQuery for almost a decade.

      React is as old as UI5 and never depended on jQuery.

      Since v1.88, when IE support was dropped, UI5 can be jQuery free and backwards compatible without any issues.

      Author's profile photo Boghyon Hoffmann
      Boghyon Hoffmann

      SAP has already introduced breaking changes in the codebase before

      Regardless of jQuery, I'd be interested to learn more about those breaking changes. At least they should be documented somewhere, and if not, please create an issue or PR in https://github.com/SAP/openui5-docs or https://github.com/SAP-docs/sapui5. UI5 takes backward compatibility very seriously.

      Most of the time, older applications that fail running with a newer UI5 version were not really following the documented compatibility guidelines such as those mentioned in:

      ... which does not mean that the framework is bug-free of course. Applications can then upgrade to the latest patch release of the maintained UI5 version, again, without having to change their existing use of public APIs.

      Author's profile photo Silas Blieder
      Silas Blieder

      Hi Mauricio,

      thanks for the great blog post. I agree with you, it makes total sense to remove jQuery, with modern JavaScript there is no reason to use it anymore
      I've just gone through my development project and removed the use of jQuery. If you are looking for alternatives for the jQuery functions, this website can help you:
      https://youmightnotneedjquery.com/

      BR Silas