Hating jQuery doesn't make you cool

Tyler Smith - Jul 27 '20 - - Dev Community

When jQuery was released in 2006, there was a seismic shift in web development. Interactive web experiences that were too difficult to build because of browser inconsistencies and JavaScript's limited API were suddenly within the reach of typical web developers.

In the years since then, JavaScript has become a lot more powerful, and modern reactive frameworks like Angular, React, Ember, Vue and Svelte have come to dominate the web application landscape. As a result of this shift, it's become a favorite passtime of some developers to talk trash about jQuery and flex about how much better they are at development for not using it.

jQuery still has a place in web development in 2020. I want to walk through some of the common arguments I hear against jQuery and address them one-by-one:

"jQuery is a bloated dependency"

jQuery is a dependency, but I'm not convinced that it's bloated. A lot of developers like to quibble over kilobytes because they're measurable: they see a small page size as a tangible metric for measuring themselves as a developer. Surely it takes a real professional to get a 40ms page load time! However, just because it's measurable doesn't mean it's important.

Iteration speed and maintainability are much more important to the long term success of a project than fast page loads. The poorly documented helper functions a developer wrote to keep jQuery out of their project will bite them as they onboard new developers later. jQuery has over a decade of answers on Stack Overflow and is incredibly well documented.

Ultra fast web pages are only critical in a few instances like e-commerce and landing pages for lead generation. Saving 30kb of JavaScript will likely have no affect on outcomes for a local non-profit's website.

Don't let the quest for performance derail you from shipping a project: premature optimization is the root of all evil in computer science.

"jQuery leads to spaghetti code"

Vanilla JavaScript has no answer to the spaghetti code problem either: it is equally un-opinionated.

The best way to avoid writing spaghetti code in jQuery is to not write spaghetti code. For advice on how to do that, check out Learning JavaScript Design Patterns by Addy Osmani (that link has the whole book for free). Your code doesn't have to be an endless wall of jQuery event handlers, you can build better primitives on top of it by creating classes or functions that call your jQuery code.

"Vanilla JavaScript can do everything that jQuery can do!"

Can it though? Vanilla JavaScript has no answer for $('.accordion-item').slideToggle(). These kinds of animations are surprisingly difficult to accomplish in a flexible manner with CSS, and complicated to code yourself in JavaScript.

If I need to reach for a library to do this anyway, why not reach for one that has all of the benefits that jQuery provides?

"Just use React"

If you're building an app, React makes a lot of sense, but if you're building a content-driven site with moderate interactivity, you're giving up a lot by switching to React.

Most React apps end up being single page applications, meaning you're giving up server-side rendering and a good amount of your potential SEO juice. You've also introduced a build step, which potentially opens you up to the waking nightmare of having to configure Webpack.

React/Vue/Svelte also don't play nice with the wealth of Vanilla JS and jQuery component libraries like Flickity, Isotope, Slick Carousel, and a hundred others. You can make them work, but it's extra effort when you can just have it for free in jQuery.

Reactive frontend libraries are also a major paradigm shift: if you were using Vanilla JS or jQuery on top of HTML to build your app, you'd likely need to rewrite the whole thing.

Most often, I hear this labor-intensive solution pitched because "jQuery is old."

Closing thoughts

The attitudes many developers show towards jQuery are exclusionary and unhelpful. They drive developers out of the field because they're told they aren't "real developers" because of the tools they use. These attitudes make hobbyists uneasy about participating in our community. And generally, these attitudes are a huge bummer.

You can build amazing experiences in Vanilla JS. You can build amazing experiences in React. And yes, you can build amazing experiences in jQuery. Be kind.

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Terabox Video Player