Polyfills

A polyfill is a term coined by Remy Sharp for a snippet of code that adds support for a feature to browsers that don’t offer it natively.

They let you provide deeper backwards compatibility and browser support without having to use a clunky preprocessor or command line tool.

How to use a polyfill

Drop polyfills from the list below into your codebase, ideally before any code that uses the JavaScript methods or browser APIs you’re polyfilling.

Alternatively, you can automatically polyfill your site with a service like polyfill.io.

The Polyfills

Some were written by me. Others were squirreled away from around the web. Links to the source and attribution are included with each one.

• Array.every()
• Array.fill()
• Array.filter()
• Array.find()
• Array.findIndex()
• Array.flat()
• Array.forEach()
• Array.from()
• Array.includes()
• Array.isArray()
• Array.map()
• Array.reduce()
• Array.some()
• CSS.escape()
• Element.addEventListener()
• Element.after()
• Element.append()
• Element.before()
• Element.classList
• Element.closest()
• Element.matches()
• Element.matches() (Back to IE8)
• Element.prepend()
• Element.remove()
• Element.requestFullscreen()
• NodeList.forEach()
• Object.assign()
• Object.entries()
• Object.fromEntries()
• Object.keys()
• Promise()
• String.endsWith()
• String.includes()
• String.padEnd()
• String.padStart()
• String.repeat()
• String.replaceAll()
• String.startsWith()
• String.trim()
• String.trimEnd()
• String.trimStart()
• URL
• document.exitFullscreen()
• document.fullscreenElement
• fetch()
• matchMedia()
• matchMedia().onchange
• window.customEvent()
• window.requestAnimationFrame()