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.