tabs ↹ over ␣ ␣ ␣ spaces

by Jiří {x2} Činčura

I replaced jQuery on this blog with vanilla JavaScript

26 Apr 2021 2 mins Blog, JavaScript, jQuery

Over maybe last two years or so, I’ve been reading with interest primarily @alesroubicek’s tweets, where he disregarded (with good arguments) all the all-encompassing JavaScript frameworks and libraries. And then out of nowhere last week, I decided to try to remove jQuery from this blog. Simply to have a personal experience with doing stuff in vanilla JavaScript.

I’m not (and don’t want to be) a JavaScript or front-end developer (if it’s not obvious). JavaScript usage here on this blog, is purely some convenience functionality, nothing fancy.

Also, I’m not saying I was having trouble with jQuery. In fact, I’m not skilled enough to make a good decision about that. But it always felt, that especially for my usage – roughly 100 lines of convenience functionality – jQuery was too heavy. But I was also worried that doing the same stuff in vanilla JavaScript is going to be too much hassle.

I was wrong (and @alesroubicek was right). First the JavaScript language today, from purely language constructs point of view, is fairly fine. For example, for-of loop, lambdas/arrow functions and await/promises make the code feel like something … expected.

Using querySelectorAll or querySelector was as easy as with jQuery (with some minor adjustments), manipulating the CSS, styles and attributes felt maybe even nicer in vanilla JavaScript. And sometimes I even simplified the code by discovering new methods available exactly for what I needed – like scrollIntoView.

Refreshing from something I still had mental picture of from Internet Explorer 6 and MooTools days. Yes, I know, I’m late to the party and I should have checked the JavaScript world around me at least once in five years.

What took perhaps most of the time was finding a new lightbox for images, etc., because the one I was using was using jQuery. After scouting about 10 and trying roughly 5, I ended up using simpleLightbox. Works for what I need and is not bloated with stuff I don’t use.

The complete change with previous and new code side-by-side is here. One thing I didn’t do, but wanted to, was wrapping the code into class. I can’t comprehend why I need to use this when calling instance method from another instance method.

It pleasantly surprised me how painless the process was. And I’m happy to have a bit lighter pages on this blog.

Profile Picture Jiří Činčura is .NET, C# and Firebird expert. He focuses on data and business layers, language constructs, parallelism, databases and performance. For almost two decades he contributes to open-source, i.e. FirebirdClient. He works as a senior software engineer for Microsoft. Frequent speaker and blogger at www.tabsoverspaces.com.