DEV Community

What's the minimum amount of JavaScript can a web application get away with?

John Alcher on September 25, 2018

So I was reading about "bloated" applications and how we, especially web developers, pull in dependencies like it's nothing since a modern computer...
Collapse
 
adam_cyclones profile image
Adam Crockett 🌀

I think there all good candidates, and I think a few more things actually. Refactoring without unit / integration tests or any sort of test really, our protagonist deserved it.

Perseved speed (RAIL) principle is far more important than fast code. I do agree that dependencies in npm are insane but npm has improved alot.

If your PO wants a seamless emersive product, how are you gonna do this with serverside and CSS animations alone.

Collapse
 
alchermd profile image
John Alcher

Refactoring without unit / integration tests or any sort of test really, our protagonist deserved it.

We're going to assume that he added tests once he migrated to <modern-mvc-framework />, so we'll give him a pass this time.

Perseved speed (RAIL) principle is far more important than fast code.

That's actually the first time I heard of RAIL. Looks interesting!

If your PO wants a seamless emersive product, how are you gonna do this with serverside and CSS animations alone.

Fair point. Though it's interesting to think what's the least JS we can put in a product that can still constitute to good UX. The product being a social media platform makes the line narrowly thin, I think (should've chosen a better example lmao).

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀 • Edited

No don't worry, I was on the bus and getting frustrated, saw your post and vented, my bad. Your absolutely right to question this. It is absolutely possible to go a long way with just CSS. However the CSS would all need to be loaded on the same page. A dynamic scripting language offers some very important asynchronous features giving the Perception of speed. Load things when you need them. Distract users with animations ect.

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀

developers.google.com/web/fundamen... there we go a reference

Thread Thread
 
adam_cyclones profile image
Adam Crockett 🌀

And here is the funniest lecture on the subject it will stick with you. youtu.be/65-RbBwZQdU

Collapse
 
ozzyogkush profile image
Derek Rosenzweig

CSS can handle most animations/transitions on its own, but the "minimum" JS is such an open question because it depends entirely on what your application is being built for. HTML5 form validation still isn't truly cross-browser compatible (or even consistent), especially when older browsers need to be supported. You can get away with replacing AJAX/fetch calls (or websocket connections) with regular form submissions, you just get a fresh page on every action. You can even embed Flash/Flex applications (though I highly recommend against this in 2018...) to handle highly complex UI, but that's basically cheating since you're just replacing JS with AS.

At its core, JS (in the browser) is just a way to handle events and interact with the DOM. Basic webpages don't need much, but nobody builds basic webpages anymore. A "webapp" denotes a certain expectation of a high amount of user interaction, including expectation of good UX across the entire application.

A specific example of a good candidate from the OP would be uploading a profile picture: letting the user choose a file, crop/resize it, preview, then submit.

Collapse
 
sam_ferree profile image
Sam Ferree

I'm assuming that saying absolutely zero JS and using WASM is cheating?

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀

I don't think John excluded WASM, please use C and when the browser is optimised in about 10 years you'll smash JavaScript heh. It's not a magic bullet yet.

Collapse
 
sam_ferree profile image
Sam Ferree

Blazor is almost here though.

Thread Thread
 
adam_cyclones profile image
Adam Crockett 🌀 • Edited

It's all here, Java, Rust Lua c# typescript via WASM and more there's a lot of languages compilation efforts. Blazer is the c# one? Sadly JS is still out performing all of them due to browser optimizations. However judging by my previous comments, it doesn't matter.

Collapse
 
qm3ster profile image
Mihail Malo

Since network is the bottleneck, there is essentially no feature on this list that couldn't be made more performant with JavaScript than by trying to create a similar UX using no-JS solutions.