Why you should code in vanilla too

#javascript #node #performance #code

In the past few years I’ve become the guy who likes vanilla everywhere, ice cream, shakes, cakes or code.

Just like almost (everyone) I started out building websites with jquery because it was comparatively easy to grasp/understand and involved less code to write. Then there was the angular boom and I started building projects on AngularJS.

Even though I used to write vanilla javascript here and then but as my projects grew bigger the bugs became difficult to understand.

Yes frameworks will help you build things faster. Yes frameworks are here to make things easier. But as your project grows there comes a time when you know there is something wrong but do not why. Frameworks are built to solve specific types of problems and hence we have different frameworks to solve different types of problems. And as your project grows you’ll have different use cases and different problems, and I guarantee you all the time you saved by using a framework will be lost to solving a bug that you have no idea about.

Now I’ll tell you why you should write more and difficult (not) code.

Lightweight Applications
Adding any dependency automatically increases your app size, more http requests and more load time.
File size (minified) for the most used JavaScript libraries/frameworks:
Vue: 58kb
Jquery : 93kb
React: 98kb
Angular 1.x: 143kb
Ember: 435kb
Angular 2: 566kb
No Dependency
You own your project completely. You know your project in and out. If there is a bug/feature request that you need then you don’t have to wait and hope for the next version of your library/framework or worse add an an extra dependency to get things done.
Learn New Things
When you do not have any abstract layer you tend to explore and learn new things. You’ll look for solutions that the language provides and you’ll get to know the hidden gems of JavaScript. Your understanding of the language becomes better and obviously you understand your project better.
Contributing to open source
All (Mostly) libraries you use are written in vanilla JS. Since now you have a better understanding of JavaScript you can quickly understand the big codebase of any library and contribute to them.
Better security
Yes you read this right. By using libraries you might be making your website more vulnerable or might be risking your user data. There is a chance some external dependency is taking your user data and sending it to their servers. For more details read this post.
Dive into server side
With better understanding of the language you can easily work node.js (built on v8) and can finally write your own backend.

This was originally published on Medium

Top comments (10)

Paul Mooney • Mar 16 '18

This is a bit analogous to saying "You should walk everywhere. No matter how far. Don't trust transportation, it's too much trouble"

I disagree that spending time on a framework specific bug outweighs the time the framework saved you. It may feel like that some days but more likely you would run into larger issues in your own codebase that take even more time to debug. Perhaps some fundamental flaw in how you structured it because you're building it from scratch without the benefit of a widespread community of contributors and testers...

Dhruv • Mar 19 '18

Yes the whole thing comes down to knowing your codebase very well and having it well structured.

Sam Ferree • Mar 16 '18

That minified filesize is a bit misleading.

Sure that's everything in the framework, but most of frameworks will do treeshaking out of the box.

A simple Ember or Angular2 app wouldn't actually send the entire framework to production (and Ember sees very nice compression gains since it introduced Glimmer2)

Dhruv • Mar 19 '18

There are always better ways around. Here I am assuming the most common one.

Gabriel • Mar 18 '18

I have to diasagree, the very reason we manage to make progress in software development / engineering / science / anything is because we build on top of the work of others.

I can guarantee you that you wouldn't be posting on this website right now if ditching frameworks was the way to go.

Now, someone here said once that frameworks are oftenly like the problem of the banana. You want a banana and you end up having a banana held by a gorilla and the whole damn jungle. In those cases, it could be worth it to just code it yourself (damn, or copy paste that method from the source code of the library).

But you cannot just code Angular, or React, those things are the result of years of effort and terrible headaches for developers, how would you be willing to go through that for your To-Do web application?

Dhruv • Mar 19 '18

I'm not saying ditching frameworks is the way to go. I'm saying frameworks are built to solve specific kinds of problems and your project might not match the same problem. And if you have the knowledge of the language you can always write a solution yourself.
This post does not say "do not use frameworks" it says "what are the benefits of not using one"

Nicola Zanon • Mar 16 '18

All valid points! I’m working on a fairly large vanilla JS application and coming from a React codebase man I can tell you that I was spoiled by it :)

It’s good though. You have to really dig into what you are doing and architect stuff correctly. Good learning for sure!!