Vanilla JS or jQuery for click events?

[nixnerd]

I’m really torn on this. I hate having an external library like jQuery if I don’t need it. On the other hand, I feel that handling click events with vanilla JS is very verbose and less maintainable.

Plus, some things are handled better by jQuery from an x-browser perspective.

Which is the most prudent choice when it comes to handling clicks?

[shaneisme]

Depends on what you’re doing.

I don’t necessarily think adding a click event on something in native JS is THAT verbose personally. It’s certainly just as easy to maintain since the only variable is the element or tag you want to add an event to.

Generally speaking, I make the decision based on the needs of each project. If something’s going to have a ton of animations, etc., I’ll leverage jQuery since I’m no expert at that sort of thing.

If it’s something that just adds an event listener on click to all <a> tags to help out analytics with stuff, I’ll go native.

There are a ton of sites popping up recently that help out with the transition for the basic stuff that most people use jQuery for.

[nixnerd]

I think it gets a little hairy when you are trying to target only one instance of a class and trying to tie events to other elements. That to me gets pretty verbose. You can accomplish the same exact thing with just a few lines of jQuery.

However… my insatiable desire for simplicity and minimalism will win out.

jQuery on its face seems to be the more elegant, more simple solution. But, I know it’s all a facade. It’s an abstraction that hides a great deal of code. I cringe at the idea of importing an entire library or even a portion of a library just to handle click events. Seems freaking absurd. So, I’ll go with vanilla JS.

There are a ton of sites popping up recently that help out with the transition for the basic stuff that most people use jQuery for.

For anyone reading this thread in the future, another such site that @shaneisme speaks of is:

http://toddmotto.com/is-it-time-to-drop-jquery-essentials-to-learning-javascript-from-a-jquery-background/

[TheDutchCoder]

You can always make a custom jQuery build that only has methods you need.
This would save space and time (since you don’t have to write it yourself).

Although I agree that jQuery might be overkill in a lot of cases, never forget that:

1. jQuery standardizes cross-browser differences (and since there are many, many browsers, this is really time-consuming).

2. Since jQuery is so widely used, the chance that a user hits their cache is incredibly high (which means they don’t have to download it).

I think jQuery is not that bad in most cases. I certainly use it in most of my projects, even though I normally only use it to do some very basic things, like toggling classes.

[nixnerd]

Thanks @TheDutchCoder!

Would you happen to know of a tutorial that can teach me how to build a custom jQuery package? Is it super simple? I’ve been wondering about this for ages because I really only use a few features of jQuery but I love the x-browser factor.

Thanks again!

[Author]

Posts