This is the 3rd post of the series, Part 1, Part 2, Part 4.

Ok, so now initially loaded web pages have almost no HTML code, but have tons of Javascript and CSS instead. This is good, because these assets could be served from CDN which in theory makes the whole page load much faster.

But the page load time is not the optimization objective. What really matters is the time that it takes for the page to become usable, in other words - when users can start consuming the content on the page.

So besides the time that it takes to load all of the assets, we also have to consider the time spent inside the Javascript to fetch relevant data using APIs and to render it on the client side by updating the DOM. It’s user CPU time that renders the content in this case. User CPU seems free from an application vendor perspective since the user pays for it and for the electricity to power it. But that’s not 100% true.

The first iPhone was launched about 2 years after the original AJAX piece was published. And that triggered a new epoch of mobile browsers. But mobile browser CPU time is not free. It doesn’t cost money directly. The price is the user’s disappointment with battery life. Now users don’t blame lazy developers who wrote suboptimal code, they blame mobile device vendors for using bad batteries.

Anyway, Prototype JS was released in the same month as the AJAX article and attracted a lot of attention. It allowed direct DOM manipulation, contained cross-browser abstractions, and was bundled with its own Javascript effects library. Prototype JS was probably the most important advancement in frontend development since the invention of CSS in 1996. In any case, the first version of jQuery was released 18 months later. It becomes a de-facto standard for the next 9 years because it was direct DOM manipulation done right.

A crazy mix of server-rendered HTML pages and lots of jQuery based mostly on spaghetti code to update these pages, plus a few JSON/XML APIs here and there, was characteristic of Web 2.0 development for many years. By that time, the prestige of frontend development had significantly declined. Backend engineers looked down on HTML/CSS/JS folks that spent most of their time showing and hiding divs and changing the colors of different elements.

Barack Obama inaugurated as the 44th President of the United States of America just 4 months before the first release of Node.js. Node.js was accepted quite sceptically as a nice try to bring Javascript to server side, and there was no significant adoption of Node.js in web development. Probably a release of Express a year later became a trigger of a wide adoption of Node.js. Today Node.js is a quite popular choice for backend development, especially taking into account that modern frontend frameworks allow the same Javascript code to perform rendering on both sides: server and client.

The state of frontend development was now where backend development had been in the late 1990s - a zoo of approaches and technologies. Different groups tried to come up with a frontend framework that would straighten out the mess. Jeremy Ashkenas came up with the most successful one at the time, Backbone.JS. Released in 2010, this client-side MVC framework restored some order to jQuery-based frontend apps. A few years later, Marionette came along to attempt to enhance the functionality of BackboneJS and to become a Rails-style opinionated frontend framework.

Then more and more engineers began to develop frontend-based apps. And the fun was about to begin.