How much javascript is too much

It can be built faster, with fewer developers, saving everybody money. And yet, single-page apps remain popular. People like the endless whiz-bang interactions — as opposed to the two available with traditional web apps: links and forms. For some functions, JavaScript really is necessary. Despite all their flexibility, single-page apps typically use a navigation metaphor that mimics traditional HTML links. With JavaScript routers, you can tap a link to navigate to a new section, use the back button and get URLs that send you back to that exact point.

Unless you have a very good reason to veer from this expected behavior, that link metaphor should be the primary means of navigating your app. Re-creating links and routing with JavaScript is an awful lot of work, but it beats unfamiliar navigation schemes that prevent users from using the back button or sharing links. Traditional web apps are forced to use links for navigation because they have no other options.

Single-page apps are forced to use links for navigation because the other options are worse. When we talk about JavaScript, we need to talk about bloat. My conclusion up until now: we can do better. A major downside is that your UI code gets shattered across two disconnected environments: Markup and styling on the server, interaction on the client.

The component system in modern JavaScript frameworks provides many benefits for composability and encapsulation. With a SPA, all markup, styling, and interaction get pulled to the client.

SPAs require an immense amount of additional complexity, from browser history management to maintaining a full-blown API. Unless you need one of the niche SPA features, the pros rarely outweigh the cons. LiveView for Phoenix and Livewire for Laravel enable you to build interactive components on the server, without writing a single line of JavaScript. The website loads slowly. So I check the source and count over 30 javascript files being included.

What happened to usability? What happened to the emphasis on speed and not making users wait over 15 seconds to view a web page? What kind of developer thinks it is a good idea to have that many javascript files included in a web page?

The number of Javascript files I counted was 32 including analytics scripts. When I view that second website, if I disable Javascript it loads pretty quickly. Is it slow for you, too? At least it is for me. It is a pretty big task to manage all this. Once you start thinking about modular, component-based applications the logical conclusion is components need to load their own chunks of stuff so that you can effectively manage dependencies.