Breaking down the McMaster Carr website and the techniques they use to make it so dang fast.00:00 - Intro00:38 - Server Rendered HTML00:54 - Prefetching HTML...
Nah, a lot of old tech. I used to work on shit like this… loading all your images (including the fucking rounded corners for IE) into a sprite… setting up caching, using prefetching and inlined CSS/JS for critical path stuff.
There was a whole industry around web performance in the days that a customer might be trying to download your site over their 256 kbps connection.
It’s neat tech and I miss fiddling with it. I honestly found it a lot more fulfilling than the SPA era of web design.
By SPA I mean “single page application” it’s currently the dominant approach and powered in a large part by technologies like react and node. I’m not certain when it started precisely… with technology it’s more a case of “rising to prominence” rather than “first happened” I think it probably really started going around 2014 with HTML5?
SPAs are still pretty hot but they’ve waned in popularity due to overuse and general complexity. Essentially your website becomes a single page that just swaps out what’s shown to the user as they “navigate” between different parts of the site. When well done this can make a site incredibly responsive, but it’s often quite poorly done and responsiveness can end up blocked by server requests anyways.
The author links their tweet saying “your website should not exceed in file size the major works of Russian literature.” At the time, that page on Twitter was 900 KB. Today it is 11 MB.
Aw, c’mon! Who doesn’t enjoy piping ten megabytes of JavaScript through Webpack to achieve those crucial on-scroll effects on an otherwise static page?
Nah, a lot of old tech. I used to work on shit like this… loading all your images (including the fucking rounded corners for IE) into a sprite… setting up caching, using prefetching and inlined CSS/JS for critical path stuff.
There was a whole industry around web performance in the days that a customer might be trying to download your site over their 256 kbps connection.
It’s neat tech and I miss fiddling with it. I honestly found it a lot more fulfilling than the SPA era of web design.
Noob question: what is the SPA era of web design; when did it roughly start?
By SPA I mean “single page application” it’s currently the dominant approach and powered in a large part by technologies like react and node. I’m not certain when it started precisely… with technology it’s more a case of “rising to prominence” rather than “first happened” I think it probably really started going around 2014 with HTML5?
SPAs are still pretty hot but they’ve waned in popularity due to overuse and general complexity. Essentially your website becomes a single page that just swaps out what’s shown to the user as they “navigate” between different parts of the site. When well done this can make a site incredibly responsive, but it’s often quite poorly done and responsiveness can end up blocked by server requests anyways.
See: The Website Obesity Crisis.
The author links their tweet saying “your website should not exceed in file size the major works of Russian literature.” At the time, that page on Twitter was 900 KB. Today it is 11 MB.
Aw, c’mon! Who doesn’t enjoy piping ten megabytes of JavaScript through Webpack to achieve those crucial on-scroll effects on an otherwise static page?
Hey let’s not lie to ourselves… most of those megabytes of JS are there to disable the copy functionality for anyone browsing our site.
Why? … reasons. Someone in marketing said a thing once.
Come to the HTMX side…
Such a nice library.