Responsible JavaScript

Responsible JavaScript

Jeremy Wagner

Progressive enhancement—as it applies to JavaScript, anyway—is this idea that we first implement a website’s essential functionality without JavaScript. Once we have a baseline experience that works without JavaScript, we then apply JavaScript selectively to provide a better experience for those who can benefit from it (http://bkaprt.com/rjs39/02-16). Progressive enhancement is a hard sell because it requires consensus that an experience should function in more than one ideal way. Yet its chief benefit is that redundant layers of functionality make a website more accessible and inclusive no matter where it’s accessed from. Set a baseline You can apply progressive enhancement to most critical interaction points. Form-driven interactions are prime examples. For instance, let’s take a social media-type website where people can subscribe to new content from other people. This is an excellent example of where we can use progressive enhancement to facilitate a common interaction pattern that we’re all familiar with. This functionality is provided by—unsurprisingly—a <button> element. We could write some JavaScript to make a fetch call to a backend API when that button is clicked, then update its state on the client if the request succeeded. This isn’t an antipattern per se, but it shouldn’t be the sole way for this functionality to work. It should be an enhancement on
698-713