Building Polyfills

Preface

If you play a game of word association with a room full of frontend developers, polyfill will no doubt receive mention from more than a few participants. This word—traditionally a synonym for fallback, spackle, or patch—was unfamiliar to many developers until just a few years ago, but has become a staple of conversations about modern and open web technologies. And while polyfilling has traditionally operated as a practice for delivering modern features to nonmodern browsers (oldIE, meaning IE6–8, is increasingly a synonym for older browsers), the concept has expanded over the last few years to include the addition of new and experimental platform features to all browsers, including the newest and most cutting-edge.

Before our eyes, the practice of polyfilling is evolving from an adoption technique to a full-blown design pattern that allows developers to “spackle” their browsers with whatever semantics they wish. AngularJS, a very popular and fast-growing app framework, encourages this practice by enabling developers to use directives to add custom HTML tags and components to their applications.

Design by polyfill extends beyond frameworks as well. One such example is the Web Components effort, a set of specifications in the W3C designed to make the creation of custom semantics and encapsulated components a feature in the browser itself. With Web Components, if you want a <calendar> component, you need only create one yourself, or grab one from a third party. It’s a powerful ...