Oh, how I wish that every team building for the web would use this sensible approach!
Following on from that excellent blog post about removing jQuery from gov.uk, here are the performance improvements in charts and numbers.
It may sound like 32 kb of JavaScript is nothing on today’s modern web with quick devices and fast broadband connections. But for a certain cohort of users, it makes a big difference to how they experience GOV.UK.
This is a great thorough description of the process of migrating gov.uk away from jQuery. It sounds like this guide was instrumental in the process—I love that they’re sharing it openly!
Removing jQuery means that 32Kb of JavaScript has been removed from the majority of pages on GOV.UK. GOV.UK is already quite fast to load and for many users this will make no noticeable difference. However, the change for users on a low bandwidth connection or lower specification device will be much more noticeable, resulting in significantly improved page download speed and performance.
There’s really good browser support for display-mode media queries and this article does a really good job of running through some of the use cases for your progressive web app.
- Basic functionality should work on any device that can access the web.
- Extras and flourishes are treated as progressive enhancements for modern devices.
- The UI can look different and even clunky on older devices and browsers, as long as it doesn’t break rule #1.
This is a great history of the idea of progressive enhancement:
It is an idea that has been lasting and enduring for two decades, and will continue.
Here’s Clearleft’s approach to browser support. You can use it too (it’s CC-licensed).
A performance boost in Chrome.
If a browser feature can be used as a progressive enhancement, you don’t have to wait for all browsers to support it.
The `details` element is like the TL;DR of markup.
I never would’ve known about the `display-mode` media feature if I hadn’t been writing about it.