Published in

Beware of Vanilla JS

I like to paint miniature figures for Star Wars (pics below for anyone who may be interested). It’s about the geekiest of hobbies. The other day I was on a website buying custom bases for these figures. This site was out of the US, and the default currency was not US Dollars, but there was an option to switch the currency to US dollars so I did, and then I noticed this:

Look closely. What’s going on here? That’s not US dollars. US dollars show the currency before the number, and it uses a point not a comma to separate the integer from the decimal portion of a number. And how did this happen? Long story short, the developers decided to use a minimal amount of JavaScript and manage currency conversion and formatting themselves. And unfortunately, localization, like so many issues, has a lot of nuances that aren’t obvious if you just learn a little. You have to dig deep and almost become an expert. A lot of currencies use commas and many use points, the placement of the symbol varies. Knowing these issues is just one of many things you have to worry about in building an app.

This is the value of front end frameworks. When they give you currency formatting tools, then someone has done all the research and you can reasonably trust that they’ll get things right. In my free course on the Fundamentals of Angular we cover the currency pipe for formatting currencies, and it’s surprising how many options there are for currencies. But that pipe means you don’t have to worry about how to format currencies. Angular does it for you.

Ultimately this was a fairly minor issue, but nonetheless, it's indicative of something bigger. There’s a fair amount of discussion of minimalism as our web apps initial download sizes get bigger and bigger and people push for better lighthouse scores.

So Do we need to use a framework for everything? No. And you can certainly find some library that handles currency for you. But that’s only one issue. Even in a relatively simple issue, you’ll have dozens of issues like that. Finding a different library for each issue is basically just piecing together a front end framework by hand.

This doesn’t mean that every web application has to be built with React or another similar framework. But realize what you’re giving up if you don’t use a framework at all.

And in today’s modern world there’s a fair set of next generation minimalist frameworks you can use. Starting with Preact, which gives you 90% of React for 10% of the size, there’s also Svelte, and recently AlpineJS and CrankJS.

You still need to learn JavaScript. It’s the underpinnings of everything you will do on the web, which is a good time to point out our new course, JavaScript Fundamentals. If you’re a pro user you can access that course now.

But just vanilla JS (hehe) by itself is a dangerous road to take.

As you make these decisions, being educated about the trade-offs can be very important. But the most important thing, as always, is to just build stuff and learn.

Happy coding!

Signup for my newsletter here.

Visit Us: | Facebook: @gothinkster | Twitter: @GoThinkster




Top Quality Tutorials

Recommended from Medium

How many lines should be in a perfect JavaScript module

Video to GIF Conversion with Client-Side JavaScript —Decoding FPS for GIF

Equality Operator in Javascript

Equality in javascript

React App | Next js Server-side rendering Framework

Using variable declarations to improve readability

Tiny Components: What Can Go Wrong?

How to Generate Barcodes (CODE39) in Unicode Symbols with JavaScript

Frontend Web Performance: The Essentials [1]

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Joe Eames

Joe Eames

Mormon, Christian, Father, CEO of, Organizer of @ngconf, @frameworksummit, React Conf. Front end developer, and Software Craftsmanship Evangelist.

More from Medium

Angular with Jest Testing

Confessions of a Reluctant Ionic-React Fan

Typescript for Noobies

await for Observables