Should jQuery be killed with a hammer?

Should jQuery be killed with a hammer?

Member when you were starting to work with javascript and everybody told you to just use jQuery?

Member?

I member when I was first introduced to javascript. As I recall, the first lesson went something similar to this:

Professor: "Listen here kids! I am going to show you how to select an element on a webpage using javascript and change its text:"

Kids: "Oh yeah! Cool and stuff!"

Professor: "First let's create a blank HTML page called index.html, populate it with standard html, head and body tags. Inside the body tag place a paragraph with text 'Hello' and assign it an id message."

<html>  
    <head>
        <title>Javascript 101</title>
    </head>
    <body>
        <p id="message">Hello</p>
    </body>
</html>  

Kids: "Boring..."

At this time we all knew HTML and CSS. No suprises here.

Professor: "To run javascript on our page we need to place it inside the script tag. Bellow the paragraph add a new script tag like so:"

<p id="message">Hello</p>  
<script>  
    //
</script>  

Professor: "Now we will grab that paragraph with javascript and change its text to 'Hello World!'. Inside the script tag write the following and refresh the page."

document.getElementById('message').innerHTML = document.getElementById('message').innerHTML + ' World!';  

We did what he told us. And we were amazed, and in shock. Some of us could not believe what was happening.

Kids: "Woooow! What else can we do with this?"

Professor said proudly: "Lots of things and stuff. But before we go any further, we will install jQuery and use that from now on."

Kids: "What is gQuery?"

Professor: "jQuery is a library that stands on top of javascript. It works in all browsers the same way. With it you can do all sort of things much easier and faster than with regular javascript."

Professor: "Go to jQuery website, download the file and place it next to our index.html file. Rename it to jquery.js so that our folder structure now looks like this:"

  • index.html
  • jquery.js

Professor: "Inside our index.html we need to include jQuery. Place this code in the head tag:"

<script src="jquery.js"></script>  

Professor: "Now replace the code inside our previous script tag to the code bellow and refresh the browser."

$('#message').text($('#message').text() + ' World!');

The rest is history.

Javascript is dead, long live jQuery!

For a long time after that I only used jQuery whenever I needed something done in javascript.

What changed?

The idea to write this post came to me about a month ago. I wrote it down on my whiteboard and it sat there until now.

I was working on a project of mine. Can't remember which one now, but this was the issue that I have encountered. I use browserify whenever I can to write javascript code. Normally what I do in my .js files is, I include jQuery like so:

var $ = require('jquery');  

and then I start coding. This worked many times before. This time I was working on a template which already had jQuery loaded and to make matters worse I required a plugin using browserify which loaded a different version of jQuery. Somehow everything broke down. I could not initialize the plugin from browserify, but if I placed the code inside the html file it worked. It had also something to do with document.ready(function() {}) from browserify. Can't remember now correctly what was the issue. But I remember how I solved it. I used vanilla javascript. Yes I did and it worked and it was easy.

This got me thinking.

Why do I even use jQuery if javascript is so easy and it works? Yes, the syntax is a bit longer but I can manage with that as long as it works. On the plus side, I would not have to include jQuery everywhere. Interesting...

Since then, I have started avoiding jQuery and using vanilla javascript whenever I can. So far, no problems.I have even learned about javascript a lot more in the past few days than I did in the previous few years.

The whole javascript eco system has changed a lot with npm, browserify, webpack. I have even started meddling with node.js and electron. Things are looking great for javascript.

Why do we still need it?

I haven't got the foggiest. Maybe because there is a lot of cool plugins out there for it. Maybe because it is easy to learn. Maybe because it works in all browsers (Since the start of jQuery, browser support for javascript has improved a lot). I must admit that doing some things in jQuery is a lot easier than with vanilla javascript, but is that enough. In some cases maybe it is, in other maybe not.

Since I stopped using jQuery I have discovered a lot of great javascript packages that do not rely on jQuery.

Is it evil?

No. I think that it is still doing a lot of good for javascript.

Should we burn it on a stake?

Not yet! I predict that the future of javascript is going to be very good. In the long term, it will become so good that there will no longer be the need for jQuery. That is the moment where everyone should jump ships.

Thank you for reading. I hope that you have had fun reading this as I had fun writing this post.

Mario Bašić

About Mario Bašić

I love dancing, programming, and driving motorcycles. Not necessarily in that order. I work as a freelancer and have created a website called Laravelista where I teach others how to use Laravel.