- February 27, 2014
You Might Need jQuery
jQuery: Maybe you’ve heard of it. If not, may I welcome you to the internet and introduce you to some cool websites? jQuery is a hugely popular JavaScript library that gives you an API to manipulate DOM elements easily, handle events, AJAX your content, and create all the other cool features that make the web go ‘round. The scale of jQuery’s popularity is incredible; it’s used on over 80% of the most trafficked websites, and its CDN serves up over 500 million files a day.
With this level of saturation, it was only a matter of time before the backlash set in. You Might Not Need jQuery has become popular lately on Twitter, Hacker News, and even A List Apart. There have been many responses to this website defending the use of jQuery, some of them droll and some more in-depth.
My initial reaction to “You Might Not Need jQuery” was an easy dismissal. For projects at Happy Cog, we often need to support IE back to version 7 and sometimes even 6 (the horror!). When that’s the case and JavaScript is called for, jQuery is a no-brainer. Its API provides support for a laundry list of modern and not-so-modern web browsers—and is well-tested in order to do so.
But what about projects that don’t require such deep IE support? Can we justify the use of a JavaScript framework in the age of artisanal everything? Don’t true developers write all their code by hand with a feather quill, with locally sourced inks and without evil frameworks?
Though we developers often strive to craft as much of our own code as possible, we also know when not to reinvent the wheel—regardless of how far modern browsers have advanced. jQuery provides a lot of tools we can use in our projects time and time again without worrying about fallbacks, workarounds, browser support, or inconsistent native APIs. TJ VanToll best sums up jQuery’s usefulness by listing 10 developer tasks jQuery’s API makes easier:
- Write
- Maintain
- Refactor
- Debug
- Test
- Grep
- Teach
- Understand
- Extend
A pathway to programming
Seasoned programmers may scoff at the notion, but jQuery serves as a gateway into JavaScript. The jQuery syntax is easy for a budding front-end developer to grasp: It uses CSS selectors to select an element on the page and then do something to it. The ease and speed at which you can accomplish a task with jQuery is enough to justify inclusion in any project.
I’m not the only developer who learned animation, DOM manipulation, AJAX, and event handling through jQuery’s API. Chris Coyier of CSS Tricks agrees that “jQuery just makes [JavaScript] easier and lowers the bar to entry.” And jQuery is also fun to learn, a point made by Oscar Godson: “The first time you run $(’.foo’).fadeOut() you feel like a god damn wizard.”
A common tool eases collaboration
The backlash against jQuery implies that we’re allowing our JavaScript skills to languish as long as we remain dependent on a framework. But, jQuery’s popularity means we can rely on other developers to understand and already have familiarity with our code. At Happy Cog, we utilize jQuery on virtually every project. Whether we’re handing off code to clients, or collaborating with developers in Austin and Philadelphia, we can count on a shared understanding and community for jQuery’s API, plugins, and code patterns.
Just like any other front-end framework, when and if you use jQuery, you should understand how it enhances your process and your final product. Performance considerations are a must. Critics of jQuery often mention the extra bytes downloaded by including jQuery in your site. There are many techniques to optimize file size in the age of bloated 1MB+ websites, but removing jQuery from your toolkit would save less than 2% of page weight. If page weight is still a concern, you can build a custom jQuery library for use in your projects to reduce the file size served to your users.
With all that in mind, I’m not against ditching jQuery in a project that suits the bill. If you’re using jQuery to do something you can easily accomplish with another tool, like vanilla JS or especially CSS, then looking into alternatives will level-up your front-end game in general. If you’re building websites using progressive enhancement, your users will still be getting the content and features they need with or without jQuery. But if you’re using a variety of jQuery methods on a website with the knowledge of what each feature adds to your final product, carry on.
If you’ve built a project with JavaScript and without the help of jQuery, I’d love to hear about it. That’s one thing I haven’t seen in this debate, and a behind-the-scenes look would be a learning experience for many developers, myself included.
In full transparency, Catherine recently spoke at jQuery Conference in San Diego, where she also received a free copy of the jQuery library.