Going jQuery-free

It’s 2014 and I’m feeling inspired to change my ways. In 2014, I want to go jQuery-free!

Before I get started, I want to clear the air and put in a big fat disclaimer about my opinions on jQuery. Here we go:

jQuery is an excellent library. It is the right answer for the vast majority of websites and developers and is still the best way to do cross-browser JavaScript. What I am against is the notion of that jQuery is the answer to all JavaScript problems.

Lovely, now that’s done, this is why I want to do it. Firstly, as lots of people know, jQuery is quite a weighty library considering what it does. Coming in at 32KB for version 2.x and around 40KB for the IE-compatible (gzipped and minified), it’s a significant chunk of page weight before you’ve even started using it. There are alternatives that support the majority of its functions in the same API, such as Zepto, but even that comes in at around 15KB for the most recent version, and can grow larger. The worst thing for me, is that I don’t use half of the library, all I really do is select elements, use event handlers and delegation, show/hide things and change CSS classes. So, I want a library of utility functions that only does these things.

Word to the wise, this is not a new notion, and follows on very nicely from the work that Remy Sharp has done in this area in his min.js library.

I’m going to write a series of posts as I attempt to separate myself from jQuery, and make my websites leaner and faster. The first of which will be on “what you think you need, and what you actually need” and give you ways to work out if this approach is for you, or if you should be sticking with jQuery. Next, I’ll cover the basics of what a minimalist jQuery library; and finally I’ll cover strategies for dealing with unsupported browsers.

Let me know if there’s anything in particular you want me to cover, and I’ll do my best to go over it for you.

If you enjoyed this post, leaving a comment or subscribe to the RSS feed to have future articles delivered to your feed reader.

Steve Workman

Steve is an engineering manager at Maersk, and organises BerkshireJS. He has also worked at Yell and PA Consulting and is a former organiser of London Web Standards

More Posts - Website - Twitter

Tags: , , , , ,

One comment

  1. Matt Andrews said:

    I’ve been almost completely jQuery free for 2 years now (granted the products I work on tend to not need to worry about complicated legacy like Internet Explorer 9 and below).

    Remy’s library looks very nice but I really think the future is modular. Little interchangeable libraries each doing one thing very well.

    We wrote ftdomdelegate (https://github.com/ftlabs/ftdomdelegate) which is very small and focuses on being a nice abstraction for DOM Event delegation. I am a huge fan of TJ Holowaychuk’s superagent for ajax (https://github.com/visionmedia/superagent). For manipulating classes the browser’s native classList (or appropriate polyfill) is more than good enough for us.

    I hope the future will be less and less about a “library of utility functions that only does [a small number of things]” and more about choosing a number of even smaller libraries that each address a very specific problem (one for event delegation if needed, one for ajax if needed and so on) because as long as we keep trying to create libraries that bundle these very different things together we won’t actually address the problem you describe of only using “half of the library”.

Leave a response