In Defense of Progressive Enhancement

Published on .

Yesterday’s experience layers post—cross-published to Viget’s Inspire blog—was overwhelmingly well-received by friends and colleagues (Mom said I sounded real smart!). It wasn’t without its detractors, though.

Over on Inspire, my supervisor Doug took issue with several of my key points. Doug’s a brilliant Web designer and a friend, but on the matter of progressive enhancement, he and I couldn’t be farther apart. I’m grateful he took the time to comment, giving me an opportunity to revisit my original post’s thesis.

Doug’s lengthy comment covers quite a bit of ground and I’d like to address several of his remarks. His main gripe is my use of Vine’s broken video page as a foundation for a conversation about progressive enhancement.

Doug’s right that my Vine example is cheeky:

Credit card numbers weren’t lost, data wasn’t destroyed, users weren’t endangered.

But what if the example used were a bank? Or an online store? Or a service providing health care information to the disadvantaged?

Vine merely provided a basic example of a larger issue. Websites should not rely on JavaScript for delivering primary content, even if that content is a goofy six-second video.

I bet Vine’s engineers would consider a little JS-related downtime a reasonable tradeoff for the advantages of building JS-first.

I’ve previously quoted Jeremy Keith on this topic and I’ll do so again:

I feel very strongly that the needs of the end user should trump the needs of the developer in almost all instances.

Without knowing the particulars of Vine’s development team, I feel safe hypothesizing that they chose to rely on JavaScript for displaying primary page content as a convenience to themselves at the expense of their users. I’d be interested in learning more about their decision-making process.

[Vine’s] failure was preventable — even a single integration test should catch a catastrophic bug like this.

True! Thorough test coverage can catch mistakes like the one we saw on Vine’s video page. A website serving primary content in HTML and treating JavaScript as an enhancement, though, requires less testing and is less prone to this sort of catastrophic failure.

In 2015, I don’t think JavaScript is an enhancement — it’s the baseline.

I couldn’t disagree more. In 2015, the landscape has never been more hostile. The proliferation of devices, the unreliability of mobile data networks, and the hostile nature of browsers demand that we build robust and reliable websites. Treating JavaScript as a baseline for displaying a website’s core content doesn’t square with reality.

I’m not advocating that we abandon JavaScript; far from it. As Christian Heilmann remarked, modern websites “all become better when enhanced with JS.” JavaScript plays an important role in Web development, but it should always be treated as an enhancement.

(Also: check out Christian’s The “Web Application” Myth for more on this topic.)

Users have it turned on.

Jake Archibald pointed out that progressive enhancement is not about whether or not a user has JavaScript enabled. Jake’s post is a favorite of mine and worth a read.

It runs fast.

True again! However, it’s important to remember that executing JavaScript consumes a great deal of energy on mobile devices. I’d much rather build websites that don’t place significant energy burdens on users’ devices.

Regarding the Vine example, I took a look at the page’s source and was heartened dismayed to find that the content is in the markup:

<video src=""></video>

Why, then, didn’t the content display even with the JavaScript error? Glad you asked. The entire page is wrapped in this little bit of gold:

<div style="display: none">

I remain unconvinced that abandoning progressive enhancement in favor of JavaScript-first development is better for users or is the direction the Web is inevitably heading. It’s our responsibility to do right by the billions already online and the next billion preparing to come online. We can achieve this by designing robust, resilient, layered experiences using techniques like progressive enhancement.