The Past

Once upon a time, when the Web was young, frontend development was a lawless profession. Designers and developers alike had to navigate a Wild West of browser hacks, proprietary "standards" and a glacial browser update process. "This won't work in IE," we would say forlornly. "If only web standards were more widely supported."

The Present

Fast-forward to 2013 and we've come a long way. Browsers now update themselves, and browser vendors work with the W3C to push the web forward. But our work is not done. Different browsers implement different standards in different ways. How are we to know what we can and cannot use?

Meet the noble polyfill.

Written in JavaScript, polyfills emulate missing functionality in browsers. The cutting-edge just-beyond-our-grasp features of yesteryear are nary to be found; web developers have banded together to fill the blanks left by browser vendors.

The Future

As we emerge from the gloomy depths of the web's past, the path ahead of us looks bright. New features such as grid layouts, WebGL and native video can be seen on the horizon—and thanks to the magic of polyfills, all of the web's citizens can enjoy them.

Let's work together to end lowest common denominator web development, one feature at a time.

HTML

Srcset

draft

srcset.js

by Ian Culshaw

A lightweight polyfill for browsers that don't yet support srcset (non-webkit nightly).

Official Website

Sections

candidate

HTML5 Shiv

by Alexander Farkas, Jonathan Neal, Paul Irish, John-David Dalton & others

The HTML5 Shiv enables use of HTML5 sectioning elements in legacy Internet Explorer and provides basic HTML5 styling for Internet Explorer 6-9, Safari 4.x (and iPhone 3.x), and Firefox 3.x.

Official Website

Picture Element

draft

Picturefill

by Scott Jehl

A responsive images approach that you can use today that mimics the proposed picture element using spans, for safety sake.

Official Website

CSS

Regions

draft

CSSRegions.js

by Mihai Corlan & Razvan Caliman

CSSRegions.js is an experimental polyfill that uses JavaScript to bring CSS Regions functionality to browsers that don't support the feature.

Official Website

Multi-Column Layout

candidate

CSS3MultiColumn

by Betley Whitehorne

An update to CSS3MultiColumn by Cédric Savarese to support HTML5 elements.

Official Website

Media Queries

recommendation

Respond.js

by Scott Jehl

A fast & lightweight polyfill for min/max-width CSS3 Media Queries (for IE 6-8, and more).

Official Website

Grid Layout

draft

Grid Layout Polyfill

by Han Lin Yap

Adds grid layout support to IE9+ by changing the CSS without editing any DOM elements.

Official Website

Backgrounds and Borders Level 3

candidate

CSSPIE

by Jason Johnston

PIE makes Internet Explorer 6-9 capable of rendering several of the most useful CSS3 decoration features.

Official Website

JS

WebGL

draft

JebGL

by Martin Qvist

JebGL is a piece of Javascript which lets you run your WebGL apps in browsers lacking WebGL support without having to modify your existing code! Behind the scenes JebGL uses a fallback Java applet to emulate the WebGL canvas if needed, and the Java applet runs hardware accelerated on all platforms using JOGL.

Official Website

CWebGL

by Cimaron Shanahan

Implements a WebGL stack (WebGL, OpenGL) using pure Javascript and Canvas element. This allows client applications to support browsers that implement Canvas, but do not implement WebGL (Internet Explorer 9+), or client machines that do not have sufficient graphic drivers.

Official Website

Page Visibility

recommendation

Visibly.js

by Addy Osmani

visibly lets you easily establish whether a page currently being viewed in the browser is visible to the user or has been hidden by them switching to another tab.

Official Website

Visibility.js

by Andrey Sitnik

Visibility.js is a wrapper for the Page Visibility API. It eases usage of the API by hiding vendor-specific property prefixes and adding some high-level functions.

Official Website

Page Visibility Shim for jQuery

by Mathias Bynens

This plugin gives you a very simple API that allows you to execute callbacks when the page’s visibility state changes.

Official Website

File API

draft

mOxie

by Moxiecode

mOxie is combined name for XHR2 and File API pollyfills extracted from Plupload in order to make it more flexible and give it opportunity for further growth.

Official Website

saveAs.js

by Andrew Dodson

Shims the saveAs method, using saveBlob in IE10, an object URL resource in Chrome or a new tab in FireFox.

Official Website

idb.filesystem.js

by Eric Bidelman

idb.filesystem.js is a well tested JavaScript polyfill implementation of the HTML5 Filesystem API. It is intended for browsers that do not support the API natively.

Official Website

FileSaver.js

by Eli Grey

FileSaver.js implements the HTML5 W3C saveAs() FileSaver interface in browsers that do not natively support it.

Official Website

FileAPI

by Konstantin Lebedev & Demidov Vladimir

A set of javascript tools for working with files. Multiupload, drag'n'drop and chunked file upload. Images: crop, resize and auto orientation by EXIF.

Official Website

FileReader

by Jahdrien

This library is a JavaScript + Flash library that allows you to read files client side using standart File API. It moves a transparent flash button over any DOM element and gives it a HTML 5 file input behavior.

Official Website

Dropfile

by Andrew Dodson

Dropfile is a shim which uses Silverlight to recreate the part of the HTML5 FileAPI which lets us drag files into the IE browser and read 'em.

Official Website

Canvas

draft

Silverlight Canvas

by David Anson & Jon Davis

Silverlight Canvas uccessfully uses Silverlight as a rendering engine to implement HTML 5 <canvas> support in IE6—IE8. It also enables onload=".." attribute support for native canvas renderers for 'this' context object activation.

Official Website

KineticJS

by Eric Rowell, Jason Follas, Andrew Ippoliti

KineticJS is an HTML5 Canvas JavaScript framework that enables high performance animations, transitions, node nesting, layering, filtering, caching, event handling for desktop and mobile applications, and much more.

Official Website

fxCanvas

by Evgeny Burzak

fxCanvas is an implementation of the HTML5 Canvas element for Internet Explorer (two-dimensional graphics only).

Official Website

FlashCanvas

by Shinya Muramatsu

FlashCanvas is a JavaScript library which adds the HTML5 Canvas support to Internet Explorer. It renders shapes and images via Flash drawing API.

Official Website

ExplorerCanvas

by Erik Arvidsson

Modern browsers like Firefox, Safari, Chrome and Opera support the HTML5 canvas tag to allow 2D command-based drawing. ExplorerCanvas brings the same functionality to Internet Explorer.

Official Website