Why does everyone hate on JQuery?

I have finished the JavaScript introduction course on Codecademy and it was VERY rough at the end. Promises and AJAX stuff was way out of my comprehension. Afterwards I decided to give JQuery a shot for fun.

JQuery is insanely easy compared to JavaScript. It gets everything I need done in 1/10th the code. But everywhere I look is just endless memes about how JQuery is trash and you’re trash if you use it at all. What is the downside of it that I have not encountered yet?

From what I understand,

HTML, CSS, and JS weren’t as developed as they are now, DOM manipulation was a royal pain to get right, and browser interop could be a particularly punishing endeavor, and on top of all that the limited JS standard library meant a lot of wheel reinventing

jquery brought solutions to those issues quite well, and was an essential tool, saving countless development hours and debugging

since then, vanilla of all 3 parts have absorbed a lot of the features that were once unique to jquery, with some exceptions, and in comparison to browser built-ins, jquery doesn’t seem as appealing as it once was

I think the perception then changed from requiring jquery to do basic and advanced tasks and being thankful it was available, to the perception that one is worsening their own product by not using more modern native features that can achieve the same thing

A lot has changed in the culture very rapidly over even just a few years

I wouldn’t say most are disparaging jQuery as they are promoting higher-level alternatives to it. jQuery is all about directly manipulating the DOM in a very procedural way: update this data, find this element, give it this class, put these elements in it, find that element, remove these classes, and so on. Modern frameworks like React and Angular are far more declarative, saying “this data belongs to this part, here’s how it looks, now take care of it whenever it changes”. Underneath, they still do manipulate the DOM, but it’s not something you do directly anymore with these frameworks.

So for a lot of applications, jQuery isn’t bad, it’s simply obsolete. Such is the way of progress.

1 Like

I wouldn’t say most are disparaging jQuery as they are promoting higher-level alternatives to it.

Well, some people are definitely disparaging JQ. I hear people rant about it all the time.

But as you both point out, it was very important at one point, but advances in JS etc have made it less needed and there are other more modern libraries and frameworks that are more popular. It’s good to know the basics of JQ, but if it’s all you know, it may raise some eyebrows. I’m guessing that there aren’t nearly as many new projects being started with JQ, but there’s probably a lot of legacy work for it.

It’s good to learn, but don’t end there. FCC also teaches React which is a popular alternative.

There is definitely a bit of bandwagon mentality. At one point it somehow got “cool” to hate on Jquery.

I will say this, don’t just blindly reach for Jquery, it is after all extra code that needs to be loaded by the browser. If you don’t really need Jquery there is no point in using it.

So if I understand the general consensus. Learn JQuery because it’s good for overall knowledge but don’t lean on it forever. Move on to react and other more modern frameworks for the heavy lifting?

Now, most of what was good about jQuery has been absorbed into the browser API (the selectors for example, querySelector and querySelectorAll). And for Ajax in particular, although the jQuery wrapper is great, there are dedicated libraries that do exactly that (eg Axios). But putting aside these things: React/Angular/Vue etc. abstract away needing to deal with manually making DOM updates. Which is the entire point of jQuery. Thinking about this, I haven’t needed to do that kind of widespread direct DOM manipulation for years now, and I don’t think that is at all uncommon. That’s a massive part of why it isn’t something people automatically reach for now (as they would have 10 years ago).

1 Like

If you use plain JS then you don’t have the overhead of downloading jQuery on every initial load. Web Development is about loading pages as quickly as possible. Like 2 sec downloads…

Many of the functions in jQuery are never used thus making several of its functions dead code.

I prefer to make the functions myself in plain JS.

With jQuery you constantly have to update your DOM to the newest versions to avoid newly founded exploits.

It is not that it is bad , its just with JS dom now being more powerful alot of the complexity JS used to have is already addressed and hence there are less reasons to use jquery. JS has improved by including methods like like querySelect() and .addclasslist(). Since js dom has already reduced alot of complexity with new methods the difference jquery provide for less code is minimal and hence becomes unessary as with any library it increases the page loading time

Honestly , you dont have to make a big deal whether to learn jquery or not , people look at frameworks the wrong way similarly to bootstrap.The purpose of any library and jquery is to reduce coplexity in code and you decide whether if its worth for your project. Alot of document examples are still written in Jquery , and even if you want to use pure vanilla JS you still need to look at examples and translate jquery to pure JS.

I have used jquery and bootstrap for my final year project for example because writing it in pure css and js takes alot of time to write so using a framework make sense.Regardless you should spend more time in the fundamentals on your own personal projects ( html,css and js) because there are alot of times you have to tweak code and you have to look at the underlying structure of libraries like changing certain css in bootstrap for example

So learn jquery if you want to , but don’t spend alot of time in it. The core foundations are more important to learn in your own time, with strong foundations picking up jquery won’t take long at all to be able to apply it on your projects.

The good news is jQuery is easy to pickup and learn, and if you’re just doing CSS manipulation (say menu system, UX/UI interface), jQuery and CSS together allows you to make complex work with just a few lines of code.

Now, if you’re relying on using jQuery for updating Model-View, it’s a bad idea beyond simple updates. It quickly becomes hairy when you need to update multiple things at multiple places. I think you’ll better be served using a proper JS framework for this… React, Angular, or VueJS.

As for the large file size download of jQuery, that’s just a red herring. That’s more of an exaggeration from the jQuery haters.

As-is (minified)

$ ls -lhS
566K Jan  4 22:03 angular2.min.js
563K Jan  4 22:05 angular2.0.0-beta.0-all.umd.min.js
486K Jan  4 21:50 ember.1.13.8.min.js
435K Jan  4 21:48 ember.2.2.0.min.js
205K Jan  4 22:06 angular2.0.0-beta.0-Rx.min.js
144K Jan  4 21:59 react-with-addons-0.14.5.min.js
143K Jan  4 21:46 angular.1.4.5.min.js
132K Jan  4 21:56 react-0.14.5.min.js
121K Jan  4 21:35 angular.1.3.2.min.js
5.3K Jan  4 22:00 redux-3.0.5.min.js
706B Jan  4 21:57 react-dom-0.14.5.min.js
63K  Oct 13 03:02 vue-2.0.3.min.js

84K jQuery.min (https://mathiasbynens.be/demo/jquery-size)

And besides, there’s a ton of CDN sites out there, and a lot of sites relying on CDN to load jQuery so most probably, the user will already have jQuery cached on their browser.

1 Like

Thanks for that image @owel that helps put it in perspective.

Compare those of course to the relatively modern vanilla js framework :wink:

I did say initial load.

Plus 566k is more than a full second added to your page load.

That’s a big deal.

Where is the 566k coming from? The JQuery.min file is 84k in size?

I was referring to those frameworks he listed.

If you’re talking about jQuery., then you’re omitting the jquery-ui and ui-css files.

Not to mention,. jQuery is significantly slower at making objects vs building one in vanilla JS. Sure if you have a small project it doesn’t matter.

I actually just finished my small project with 100% JQuery and my google speed test is 96 on mobile so I think it’s fast enough

Check it out!

http://fontmeup.surge.sh

1 Like

Link broken.

Yes-., as I’ve said before small projects make almost no difference.

Fixed the link. Not sure what happened there. Like I said I’ve just begun my learning so small projects is all I can do right now. JQuery is fun and easy for sure, but I understand it’s not the end game. Thanks!

Yeah- don’t take my posts as the standard. Everyone is entitled to their own opinion.

jQuery has a lot of legacy code out there so it’s important to know how it works.
The main point I’m suggesting is to learn vanilla first. Many of the things jQuery offers is easily implemented in vanilla and it works significantly faster.