Building Polyfills

Chapter 3. Building Your First Polyfill, Part 1: Getting Started

Over the last two chapters, we’ve covered why polyfilling is still important, as well as some principles for responsible polyfill development. In this chapter, I’m going to walk through some practical steps for building cross-browser polyfills via an actual, real-world project that I created. We won’t go through every line of code or every excruciating detail, but I will introduce you to some practical examples and considerations that you’ll want to keep in mind for your own polyfill development, no matter the web platform feature being targeted. We’ll start with a discussion on project setup and structure before diving into setting up your API and deciding what you plan to build and not to build. Then we’ll explore adding basic features and refactoring your polyfill as you expand scope over time. We’ll then wrap up the chapter with a look at manual cross-browser testing, and some tips for streamlining your cross-browser testing workflow.

The HTML5 Forms Polyfill

First, let’s take a look at our candidate library for the next two chapters: an HTML5 Forms polyfill. When I first set out to write this book, I considered a lot of different options for a guinea pig polyfill to use. I wanted to target something that was reasonably complex, but straightforward enough to introduce in bits and pieces, via text. I also wanted to choose a technology whose implementation status across browsers was more than just “supported in everything ...