r/learnjavascript • u/gyen • 5d ago
Why Vanilla JavaScript
In the article below, I am sharing a bit of my story of building SaaS product in vanilla javascript and explaining why I went with this approach.
I don't expect many people reacting to this approach positively or even with open mind, but I think there should be some pushback on the current state of web dev and how complex it became.
5
u/XiRw 5d ago
I want to go back with the way the internet looked back then with just html css and JavaScript
2
u/PatchesMaps 5d ago
It's still all just html, css, and JavaScript. That time is now and the foreseeable future... unless you count wasm.
2
2
u/lasan0432G 5d ago
We use Vanilla JavaScript for all of our products. We initially started with Next.js, then migrated to React + Vite, and eventually moved to Vanilla JavaScript + Vite. For deployment, we use Vanilla JS with a custom server script running on Bun.
The main reason for this decision is flexibility. Our entire frontend is built around a hyperscript function, which gives us complete control over rendering. AI gen is also significantly better with Vanilla JavaScript because we're working directly with the language instead of through a framework.
In practice, it's not as difficult as many people think. The only part that requires some effort is building UI components, but AI handles most of that work for us. We design our UIs in Sketch, then generate a tree structure for the components, copy it into our project, and let AI generate the UI implementation. From there, implementing the application logic is straightforward and highly flexible.
Another major advantage is predictability. We know exactly what's happening throughout the application because there isn't a framework introducing additional abstraction. We've never run into mysterious rendering behavior or framework-related performance issues. Working with plain HTML, CSS, and JavaScript has been a much better experience for us.
That said, this approach does require discipline. You need to carefully design your project and directory structure, establish clear naming conventions, and keep the codebase organized. Once those foundations are in place, Vanilla JavaScript scales surprisingly well.
3
u/theancientfool 5d ago
To be honest, idk why people use anything but vanilla js for major projects.
I can understand starting of the grt things done quickly. But eventually I believe with updates reactjs and all needs to be phased out and vanilla js needs to be used for long term projects.
4
u/LucVolders 5d ago
All the things a framework can do can be done in plain vanilla JavaScript.
Frameworks are for lazy programmers.
0
1
u/gimmeslack12 helpful 5d ago
Trying this post again eh? This topic comes up often enough, sure we get it that people don't like React. But at the same time, it isn't bad enough that people are desperate for another option.
I think Svelte will slowly gain adoption but it'll be very slow and will probably need adoption by a big player and/or a real screw up by React to accelerate the change.
3
u/MrKassi 4d ago
I am not sure if I am qualified to expression my opinion on this matter or not, but I spent some time on many languages, and it seems to me javascript is as good as any other language, in fact, it could be even the best choice given how large its community is. And I also think that the quality of the code you write depends a lot on how you deal with abstractions and dependencies, weither you're using a strong typed language or a dynamic and loose one like javascript.
2
u/tommyatr 5d ago
OP: You don't need frameworks
Also OP: Builds one
3
u/PatchesMaps 5d ago
Tbf building a framework is really fun and a great way to learn the deep parts of js.
3
u/tommyatr 5d ago
Well, yeah, I agree that
but you shouldn't recommend new learners didnt even try a framework or libraries, you can learn a lot from them too
2
1
u/amejin 5d ago
I've said it before and I'll say it again - spa frameworks are garbage for most use cases.
I bet dollars to doughnuts OPs frameworks work super optimized for their use case instead of trying to fit all their components into someone else's shoe box.
While they may not have someone come in and go "oh, I know how to go 14 layers down into an spa of the day" when hired, what they get instead is the most documented language on the internet, with patterns that are applicable to the problem sets they are working with, and very likely they don't have 38k of minified crap on every page load. They probably don't have to fight against state maintenance for animations, have highly efficient data and page loading, and so much more.
Zero of us have Facebook's need for an spa, that has a very simple interface - and react and other spa frameworks are all back pedaling and trying to get ssr back into web dev because it's simply more efficient, responsive, and offers a better user experience.
Even if OP does not have these benefits, I applaud their approach simply because it is easier to maintain, doesn't have any special build or deployment phase, or cognitive load just to edit and work in the project... Even debugging, even when minified, is significantly easier with vanilla js and css.
The level of complexity just to make a hello world with an spa is nuts compared to vanilla js, which requires nothing more than copy/paste of a file.
1
u/tommyatr 5d ago
I don't build hello worlds, i build enterprise level software
-1
u/amejin 5d ago
Shocking.
I assume your assertion is that I don't.
Unfortunately for you, your attempt to attack me has don't nothing more than reveal how childish and insecure you are, and your position is all but meaningless.
Welcome to the internet.
1
u/tommyatr 5d ago
lol nobody is talking about you, i mean, no body knows you
I say that do your own frameworks because you don't want to learn one is a naive approach
I had to clean up those kind of messes in php
1
u/Beginning-Seat5221 5d ago
Sounds more like a rant than a solid argument.
Your solutions might have some merit as alternatives, but you didn't really explain them.
You should probably be using TypeSxript either way, you can just use loose mode where it's compatible with vanilla JS if you don't want to commit too much - unless you're doing funky code transforms that would conflict with TypeScript's understanding if your code.
7
u/funbike 5d ago
What you built is hardly vanilla JS. Instead, you wrote your own non-vanilla framework. Ug.
If you are actually interested in simplicity use Htmx.