Code on a screen with eyeglasses in the foreground, representing a polyfill.

Code that teaches old browsers new tricks.

What a polyfill is

A polyfill is a piece of code, usually written in JavaScript, that provides a modern feature on older browsers that do not support it on their own. The name was popularized by developer Remy Sharp and borrows from a brand of filler paste used to patch holes in walls. In the same spirit, a polyfill fills the gaps in a browser's capabilities so that newer code runs correctly on older software.

Why they are needed

The web evolves quickly, and new features for JavaScript, styling, and browser interfaces appear all the time. Not everyone updates their browser, though, and some older devices cannot run the latest versions at all. Without help, a site using a new feature would simply break for those visitors. A polyfill lets developers use modern capabilities while still supporting people on older browsers, rather than waiting years for every browser to catch up.

How a polyfill works

A polyfill typically checks whether the browser already provides a feature, a process called feature detection. If the feature exists, the polyfill steps aside and lets the browser's own version run. If it is missing, the polyfill supplies its own implementation, often by defining the missing function or object so the rest of the code can use it exactly as if the browser had it built in. Modern browsers pay no penalty, since they skip it.

Polyfills versus transpiling

Polyfills are often confused with transpiling, but they solve different problems. Transpiling, with a tool such as Babel, rewrites new syntax into older syntax that old browsers can parse, for example converting modern arrow functions into ordinary functions. A polyfill instead adds missing functionality that no amount of rewriting could provide, such as a brand-new method on arrays. Projects frequently use both together to support a wide range of browsers.

Using them wisely

Loading polyfills has a cost, because every extra script adds weight that even modern browsers must download if it is included carelessly. Tools and services can deliver only the polyfills a particular browser actually needs, keeping modern browsers fast. As older browsers fade from use, many polyfills become unnecessary, so developers review their list over time and remove the ones no longer worth their weight.

The bottom line

A polyfill fills the gap when an older browser lacks a modern feature, supplying its own version so new code still works everywhere. It pairs naturally with transpiling, which handles new syntax, and the two together let developers build with current tools without abandoning people on older software. Knowing the difference helps explain how one codebase can run across a huge range of browsers.

See also: What is a service worker? Explained, What is responsive web design? Explained.

Sources

Published date reflects the original event date (2026-10-23). This article is original Skillo editorial written from the sources above; facts were verified in September 2026.

Skillo Staff

Skillo Staff

All stories by: Skillo Staff

Leave a Reply