February 28, 2018

Is JQuery Worth It In 2018 - My Journey With JavaScript

By: Ben Farnham

Recently, I have been relearning JavaScript (this time to master Node.js) and in the process, I have been going through the overall JavaScript language to just review everything I have learned. In this process, I have come to question my web practices especially when it comes to the library JQuery which led me to the question, is JQuery worth adding to my list of required dependencies for my websites / web applications?

A bit of the back story

So, to make a long story short, I have been a front end developer since... 2014 (so not too long in all reality). I learned from the online platform Team Treehouse and from there, started my freelance career which lasted all of three years and ended due to me becoming quickly burnt out on clients requesting the same tools over and over again for their businesses. So, I took a year long break from creating anything web really and gave myself time to breath again. Really look at development in a new light which made me decide to learn again. Not for business, but for myself. Not with an incredible end goal in mind, but to simply learn a technology that I know would serve me and my crazy ideas in the future, so I again, am learning at Team Treehouse but this time for back end development.

Now, having had an account before, I decided to start fresh and create a new account so I can actually refresh on some concepts I could have missed. And, as I mentioned earlier, that has brought me to question JQuery.

So, with all of that in mind, let's dig in. Is JQuery really worth it? Well, if you are looking for a 'speed test' with and without a JQuery library, then I am sorry to disappoint. I simply want to compare the JQuery motto of 'write less, do more' with where JavaScript is currently in 2018.

Comparing Selectors

Here is where JQuery won me over the first time. I will admit, there is something enticing about using one selector for everything which, if you don't know is simply typing out:


// JQuery
$(".CSSselector");

So, while I know this is super appealing, it really isn't anything special. It is simply a function and like the querySelectorAll method in JavaScript, it returns an array of all of the items found with the selector. Now, like I just said, the JavaScript equivalent to this is:


// Plain JavaScript
document.querySelectorAll(".CSSselector");

This again, returns an array. But... Where the real magic of JQuery lies is with how easy it is to add chain methods to your selector.

They made it easier to select an object and manipulate it with many chain methods vs writing out an entire function. So is this such a bad thing? Well, that depends (and please remember that this is purely opinionated and honestly I am writing this more so for myself).

Manipulating selected elements

Ok, so we have our elements selected. Let's pretend we want to change all of the 'color' style properties to be red. Let's compare again:


// JQuery
$(".CSSselector").css('color', 'red');

and the JavaScript...


// Plain JavaScript
const element = document.querySelectorAll(".CSSselector");
for (let i = 0; i < element.length; i++) {
	element[i].style.color = 'red';
}

So let's be honest here... The JQuery looks so much easier to write / read. You use one method, pass in the styles you want to apply to the selected element and done. Then comes the JavaScript. This big jerk makes you have to actually loop through the element array and from there, declare each element's 'color' style property. Is it terrible? No. But that is where I really started to explore the idea of if JQuery is really worth it.

To keep you from getting bored...

Please allow me to just dig right in after these two examples. In my personal, professional opinion, JQuery has it's place but the more I use this library, the more I realize that I use it for limited methods that I could easily re-write in good 'ol JavaScript. And this made me think... if I am using limited methods / functions built in the JQuery library, then I am sure many others are doing the same.

So, let's assume most of us using JQuery are using it simply for the ease of DOM manipulation. Those methods alone make up a small portion of what JQuery actually does so this begs the question, is it really worth it to load an entire library to make manipulating the DOM a bit easier? Especially with our modern web going mobile and our need to load files quickly and easily is becoming more necessity than ever before.

As I have said, JQuery has it's place and I am sure many individuals DO know when to use it but, what I want to stress is if you use JQuery with every project, then I would consider actually looking at if the project should require JQuery. It is very easy to become reliant upon JQuery goodness but that does create some very bad habits.

I guess what I want to say is just really assess if you need to use JQuery. I have come to realize that it isn't worth it for a lot of my projects and I find more often than not that it just adds one more layer of complexity to not only the websites I create but websites others create as well. But, this is just one nerds opinion...

With this post, I didn't want to dig too deep because this subject... is MASSIVE. But I wanted to share my new outlook on JavaScript as I continue to push myself in this language. You may agree / disagree / or I may even bore you with this but, these are words I wish I would have heard when I started JavaScript so maybe someone out there needed this as well.

Benjamin - Teacher At Pure Presence Creative
Post Author

Benjamin (Creative Dork)

I am true nerd to the core, believer in quality design, Horde player, and an all around creative dork. I create films, photos, websites, and music and honestly believe that the saying 'Jack of all trades, master of none' is an excuse. I do what I want really.