DEV Community

Nadine M. Thêry
Nadine M. Thêry

Posted on

¿Is using Jquery a bad practice nowadays?

I have seen this library in the recent courses I've taken. Playing around with vanilla JS I really found it useful!
However, I've seen lots and lots of posts dismissing the use of Jquery, probably in favour of the use of a fancy new framework as React or VUE.
But I found these opinions very drastic and non-newbie friendly. Starting with a framework is medium-advanced stuff that maybe not everybody is ready for.

What do you think?

Top comments (20)

Collapse
 
vitalcog profile image
Chad Windham

The reason jquery has fallen out of favor isn't just the rise of compile to front-end virtual dom libraries/frameworks (which is a big part of it), but more so that ever since the ES6 update years back now, javascript improved a lot. The thing is, all the problems that jquery solved years ago, just aren't a problem anymore. I've been helping to teach at a bootcamp part time now for a little while, and my primary gripe with the current curriculum is that it introduces jquery shortly after we start teaching javascript. The problem with that, is now they are actually learning two things. Shortly after that we start with node for backend stuff so now they are back to vanilla js. After that we hit up react, so jquery is useless there too (you could technically use jquery with react but it's no bueno, would cause more problems than it solves IMO).

To me, that micro ecosystem of the class room illustrates the current problem with jquery. It is a better use of your time to learn vanilla js better than to use the jquery library. Why? Because the better you get at vanilla js the easier it is to jump from framework to framework, use 3rd party libraries, etc. Any amount of time spent using jquery could instead be used learning vanilla js, which is more useful (it even helps you fix/write code using jquery when you run into it!). By removing the abstraction of jquery you'll actually grow faster as a developer.

Ultimately, there is nothing wrong with jquery, but I'll tell you the same thing I tell anybody starting out. If you can't do the same things just as fast with vanilla js as you can with jquery, you've done yourself a disservice.

Btw, I started learning web development in my 30's as well, keep at it 👍

Collapse
 
samjakob profile image
Sam (NBTX)

To be honest with document.querySelector and HTMLElement.classList, I'm finding that I only need axios anymore if I'm just building a quick project. That said, as soon as fetch matures a bit I'm going to use fetch and drop axios.

Collapse
 
codefinity profile image
Manav Misra

💯 on the gripe with the bootcamp curriculum! I am in the same spot with the bootcamp I am currently teaching with. In fact, they even spend some time on jQuery UI - yes, that thing that hasn't had an update since Sep. 2016. 🤮
It's for this reason that currently I don't plan to return after my contract is up.

Collapse
 
ahferroin7 profile image
Austin S. Hemmelgarn

I think it's a good tool when used correctly. I also think that cash is a better tool unless you really need the support for ancient browsers that jQuery provides or are using jQuery plugins or Bootstrap (cash is smaller, faster, provides native TypeScript integration, and doesn't try to do things better done by other libraries).

The reason it gets widely maligned is that it's such an easy dependency to get rid of in many cases. The most widely used jQuery methods in most web apps are very easy to code in vanilla JavaScript these days without having to worry too much about cross-browser issues, so the only advantage for a lot of apps is that it makes code smaller (largely because $() is way shorter than document.querySelector()). Once you've got that dealt with, the only other big reasons to have it are jQuery plugins (which you usually don't actually need, especially if you're doing a web app that does need a full framework like React or VUE) and Bootstrap (which is getting rid of the jQuery dependency with Bootstrap 5).

That said, I very much think that jQuery should not be used for teaching new developers. As mentioned above, modern JavaScript can do almost all of what jQuery can without having to worry about cross-browser issues, so I think it makes more sense to teach that instead (it's a lot more useful in general).

Collapse
 
felipperegazio profile image
Felippe Regazio • Edited

i think jquery was great years ago. it brought some pattern and conciseness, in some level has organized a reliable browser compatibility (even in a strange way sometimes, but at the end, it was all the same jquery huhn? :P), it has revolutioned some ways of selecting elements, it brought some cool patterns to add callbacks, etc, but...

it just dont make sense to use it anymore when you have ES6 and so many new features and sugar syntax in JS now (we dont even have to mention frameworks as vue or react to talk about jquery deprecation).

the ES6 enhancements with other recent features in JS allow you do anything you usually do with jQuery, with same (or with more) simplicity, and sometimes in a (even) more elegant way.

look at that:
youmightnotneedjquery.com/

And sometimes you load jQuery at your page to do something that could be written in 10 or 20 lines of vanilla js, with same simplicity, and without load 84,320 extra kb (jquery minified size) in your app. You dont need a cannon to shoot a fly, right?

Of course to learn Jquery is still cool and useful, but for me those are the stroggest motives i left jQuery, and there are so many others...

JQuery is cool, deserves respect and has it place on the development history. But just dont make sense to use it anymore.

Collapse
 
reegodev profile image
Matteo Rigon

I agree on the first point, you don't need any framework to learn Javascript, actually it would be better to learn React or Vue after you have a solid knowledge of Javascript and ES6, so most of the "magic" those frameworks provide is easily understood.

I don't agree on the second point though, jQuery was absolutely needed because browsers (IE mostly) didn't have a consistent API, and making something work across all devices was a nightmare( just think about manipulating classes before HTMLElement.classList was introduced). Nowadays on the other hand, every modern browser has a basic set of DOM features that don't need normalization, and using jQuery is the same as using React or Vue: you are using an abstraction on top of the standard API, but while React and Vue offer something more than just a DOM abstraction, jQuery stops there. It's true that some APIs are more friendly in jQuery, but you just end up loading an external dependency for commodity

Collapse
 
jason_espin profile image
Jason Espin • Edited

No. The use of jQuery in itself is not bad practise.
Many of the comments on here are ignoring the real world scenarios where institutions such as banks and government agencies still use out of date browsers with special paid support from Microsoft because their whole infrastructure is based around the use of older versions of Internet Explorer. In these cases you definitely cannot consider the user of jQuery bad practise because it is more consistent than the browsers own apis in msot cases. Yes, if you are developing anything for modern browsers then you should consider something like Vue or React for future proofing but if you need to put a simple site out there without the overhead of learning one of these new framework / libraries and you already know jQuery then there is no harm in starting a project using jQuery with the aim of porting over to one of the hot frameworks later on or indeed using Vanilla JS. The big issue here is programming snobs. The people who want to move on to the latest, hottest, "greatest" framework without looking at the overall implications such as the time required in order to ensure that stuff is implemented correctly with a team who has not used it before. My advice, ignore these snobs. Learn the newer frameworks in your own time. In fact, learn just one. Most of the principles carry over. In the meantime use what you are comfortable with and can be most productive with.

Collapse
 
niorad profile image
Antonio Radovcic

For non SPAs (where you might prefer React/Vue/etc) it still has very convenient features.

  • You don‘t have to null-check selections, if no elements are in a collection, using it will just fail silently. Versus doing querySelector.
  • Syntax is often more readable, once you know what $ is.
  • Ajax does more than fetch (like sending certain headers).
Collapse
 
vitalcog profile image
Chad Windham

Um... your third point about jquery ajax does more than fetch isn't correct. fetch is a surprisingly low level api and you can absolutely set any header you want...

Collapse
 
niorad profile image
Antonio Radovcic

Sure I meant by default without any settings.

Collapse
 
vitalcog profile image
Chad Windham

"If I was teaching someone how to create dynamic webpages, I would use jQuery as a learning tool. It's an easy way to wrap your head around difficult topics like DOM manipulation, animation, and AJAX."

Kinda my point else where though. You need to learn about DOM manipulation. You can just use fetch now for learning AJAX stuff (if you need something better supported than fetch you can grab axios, but I would still use fetch for learning purposes), and your animations should not rely on javascript now days. I would never point to a front end frame work until there is a solid understanding of HTML, CSS and JS in place. And that absolutely includes DOM manipulation. JQuery was a savior back in the day, when DOM traversal was implemented differently by each browser, animations relied heavily on javascript, and you had to write xhr requests (though xhr isn't THAT bad once you make yourself do it a few times). But all the things Jquery solved aren't really issues anymore...

Collapse
 
xowap profile image
Rémy 🤖

You can't compare those.

jQuery is mostly a compatibility layer on top of shitty browser APIs. Turns out things evolved since IE6 and you might not need jQuery (nor anything else).

Now if you want to make non-trivial front-end interactions then you'll find that a framework like Vue helps a lot. Because it will render a state into DOM, you don't need to worry about cleaning up things all the time. Also, Vue can be inserted progressively into your front-end and does not require any toolchain. It's lighter and more convenient than jQuery to build apps!

Collapse
 
josephthecoder profile image
Joseph Stevens

If it's a quick throw away thing, sure no problem. If this is a big application, and it's 2019, Jesus, shame on you.

Collapse
 
zenotds profile image
Zeno

No it's not. jQuery is still a great tool.
Certainly you can just use vanilla and save some 1.5kb of traffic usage.

Collapse
 
matthewbdaly profile image
Matthew Daly • Edited

I think there's historically been a window where jQuery is useful, and outside that window it's either redundant or starts causing problems.

If your application has around two or three hundred lines of Javascript, not including third party libraries, then jQuery is sufficient. As you go past that point, it starts getting harder and harder to organize your code, and you approach the point where something like React or Vue would be a better fit. It's not impossible to organize jQuery code properly, but it's a chore and is far less natural than with React, so you tend to build up technical debt. The legacy application I inherited pushed far beyond the point where you should look elsewhere, and the Javascript is a nightmare - when you add an already defined class to an element, you're apt to find it suddenly gains some unwanted functionality. I've started migrating it to React, but it's going to be a long job.

At the lower end, there's also less need for jQuery at the bottom end of that window. Due to better CSS and JS support in browsers, much of what it does simply isn't needed anymore. So that window of usefulness is getting smaller. With Bootstrap 5 planning to drop jQuery as a dependency, there will be even less need to include it.

Collapse
 
spksonicsamurai profile image
AFM-Horizon

I'm really enjoying Jquery, just took a beginner course, and it is super simple and helps to bring into focus the whole View side of things and how HTML can actually be dynamic and fun. also helped me understand and jump into java-script from a intermediate/advanced C# level and now I'm pretty pumped to learn React or Angular. Being reasonably new to programming I can't really understand all the negativity around Jquery I like it!

Collapse
 
ahferroin7 profile image
Austin S. Hemmelgarn

Part of the negativity is, ironically, that it's become a de-facto standard for teaching, but you don't actually need it most of the time (it's been mentioned multiple times elsewhere, but youmightnotneedjquery.com/ is worth looking at). Pretty much all of the specific issues it solved other than verbosity are no longer issues unless you need to target really old browsers (no, seriously, we're talking truly ancient here, document.querySelectorAll() has been around in everything except IE for a decade), so most of what it actually does is add just short of 80kB of extra data (before compression) to make the rest of your code a bit smaller, and you have to be working on a pretty big app for that trade-off to be worthwhile.

Collapse
 
jamesthomson profile image
James Thomson

I think jQuery was great back in the day for all the reasons that have already been stated.

That said, if I were to guide a complete newbie, I would tell them to avoid jQuery and only focus on JavaScript. I say this because while it may seem easier to get started with jQuery I feel it will hinder your progress and can essentially throw you into a world of JavaScript without really understanding the fundamentals of it. That goes for any lib or framework, if you put the time in to learn native JS you will be far better off in 6 months time than if you used a "jump start" tool like jQuery.

Collapse
 
umutakyol profile image
asdsadasf

Absolutely, vanilla JS is best practice for creating great stuff. Jquery is for noobs. :)

Collapse
 
kbartman profile image
Keith

I've been a software developer for 30+ years, FullStack... JQuery is for Both Newbies and Seasoned Developers... It's all about picking the right tools for the project and clients current Ecosystem. React, Angular, Vue, Node.js, Go and yes jQuery, PHP, Java might be the right tool to select from your toolbox.