Programmatic Progressiveness

The Chrome team have put together a thing called Lighthouse, a programmatic checker for whether a website is a progressive web app. It’s a nice structure; it goes through a big list of checks on whether you’ve got a manifest, whether performance is good, if the site’s HTTPS, if you’ve got icons defined, so on and so forth, and it’s possible to add more (many more!) checks to the list. You can think of it as the list of criteria that a browser should use to tell whether it should put up the “add to home screen” button.

However, as has been previously mentioned by me and others, there is a bit of a worry that we’re missing out on the Progressive part of Progressive Web Apps; that in the rush to check that you support exciting new features such as manifests and service workers, we’re not also checking that your web site provides content to everyone, that it progressively uses those new features where they’re available rather than requiring them to be present, that you’re available to everyone and not just to the hippest.

A brief diversion, here: I have occasionally probably strayed over the line from “why aren’t we doing better at this” (which I do think) into “why don’t the Chrome team care about this”, and that’s not fair. Sorry, Chrome people. Accusation not justified.

Anyway, what I’d like to see is Lighthouse actually checking that your app is progressive as well as featureful. This is harder than it looks; progressive enhancement, like accessibility, is difficult to check programmatically. It’s easy for a human to confirm that this site can still perform its basic actions if its scripts are blocked; it’s a lot more difficult for a computer to do so. I don’t think we’ll ever be able to say “yes, you have definitely done everything right”, here, much like we can’t with accessibility. But we can flag that you’ve done things wrong.

So, I’ve now got some code in Lighthouse which is a place we can build programmatic checks for progressiveness. At the moment it literally only checks whether there is any content at all if your scripts don’t load, and complains if you do not. That will catch sites which just serve <body></body> and create their whole entire UI in JavaScript; such sites are (thankfully) rare now, after a spate of them existing a few years ago. But we can do better than this. Yes, it’s difficult to adequately create such tests, but if we can land a man on the moon we can come up with checks here, too. So, I’d like to start a discussion around how we can programmatically check for signs that a website isn’t doing progressive enhancement. What should we look for to show you’re doing it right; what should we look for to show you’re doing it wrong? If you have ideas, a good place to discuss them may be by filing issues against Lighthouse; there, we can hash out details of whether a check makes sense, whether it’s a good idea, how it can be made better. And then someone can build that check; if you’re a developer, you can add an “audit” to Lighthouse which has access to the page text and HTML and checks for warning signs or good signs and adds them to the report that Lighthouse creates. This is our chance to help stamp out sites that don’t do things right, and help define that a progressive web app should actually be progressive. I’d love you to help.

I'm currently available for hire, to help you plan, architect, and build new systems, and for technical writing and articles. You can take a look at some projects I've worked on and some of my writing. If you'd like to talk about your upcoming project, do get in touch.

More in the discussion (powered by webmentions)

  • Daniel Newns responded at @sil i think you broke the bottom of your blog!
  • Stuart Langridge responded at @dnewns I don't know what you're talking about, that never happened
  • Stuart Langridge responded at @dnewns I really need a thing which checks that at publish time ;)
  • Slippers Ex Machina responded at RT @sil: Let's add checks to Lighthouse to ensure progressive web apps are progressive, and help define what a PWA should be.…
  • Birmingham.IO responded at Stuart Langridge: Programmatic Progressiveness by @sil #PlanetBirmingham
  • Birmingham.IO responded at Stuart Langridge: Programmatic Progressiveness by @sil #PlanetBirmingham
  • Adactio Links responded at as days pass by — Programmatic Progressiveness…
  • Matt Gaunt responded at tag:twitter.... (