Why I hate WebPack, Babel, and the like, and Why You Should Create Vue Apps in Plain Javascript Without Any Compilers.

In my previous article, I showed you how to create a Vue SPA app without any compilers or transpilers. When Vue CLI 3.0 came out I decided to give it a try and although it worked (even though I had no idea what was happening under the covers) I really did not like the development experience.

Then came the announcement that there is a security vulnerability in the Vue CLI NPM package. Oh great, I followed the instructions in the news release to cure the problem and now my app won’t compile. Since I don’t understand the black boxes that make up the compiler, I have no idea where to start.

Frustrated, I decided to take a look at my original plain old Javascript (POJ) application again and it made perfect sense. I copied all of my updates from the CLI version to the POJ version and everything worked perfectly!

Here is the latest GitHub repository if you would like to take a look. https://github.com/sobpilot/vuespa. The demo app is at https://perdidosoft-bh.azurewebsites.net/airports/.

I know, everyone talks about the speed it takes for an application to load and webpack compresses everything into a single file, blah, blah, blah. I haven’t run any definitive tests, but my POJ application seems to load faster, especially if it is cached. Think about it, the internet infrastructure is constantly tuning everything for speed, so plain text is compressed by routers, cached by browsers, and optimized by the latest Javascript engines. Using compilers reminds me of zipping a zipped file, it just slows down the process.

The next complaint is that everyone can read your code. Good, if you think your app is more secure because it is uglified, it still contains all of your Javascript code and is more than readable to the expert hackers out there.

As browsers and Javascript engines continue to evolve and update, most of the latest ECMA Script features are readily available. I just tell my users to use Chrome, Firefox, or Safari, which runs on just about everything, and all is well!

Here is my Index.html file. It can’t be clearer than this…