Will Serving Real HTML Content Make A Website Faster? Let’s Experiment!

When you’ve worked on the web for as long as I have, you see trends come and go. I’ve witnessed at least three different eras where folks began to put all their eggs in the JavaScript basket, only to realize the massive hits they were taking to performance.

In this piece for WebPageTest, Scott Jehl uses a new “experiments” feature to demonstrate how serving HTML would make a ton of popular websites much, much faster. Some of these companies learned this lesson previously (and even wrote about it) only to have thrown their own advice out the window, which is disappointing.

Serving HTML will always result in faster page loads. There is no way around that. Sending your JavaScript framework to the client and having it render the HTML adds a ton of extra steps:

1. Download skeleton markup
2. Download high priority JavaScript file(s) and CSS
3. Load JavaScript program into memory
4. Execute JavaScript
5. Generate actual markup (and replace skeleton)
6. Request assets referenced in markup (e.g., images, videos)
7. Render page
8. Load deferred assets

Compare that to the HTML-first route:

1. Download markup
2. Download high priority JavaScript file(s) and CSS
3. Request assets referenced in markup (e.g., images, videos)
4. Render page
5. Load deferred assets

Sure, on subsequent navigations having JavaScript request only the bits and pieces you need is a performance win, but that first render is a beast. And you can totally load that JavaScript later, after the page is rendered.