A polyfill is a piece of JavaScript that implements a standard feature, such as Promise or fetch, in browsers that lack it. It checks whether the feature exists and defines it only when it is missing.
Why it matters
Polyfills let you write to current standards while still supporting older or less capable browsers. Every polyfill adds download size for everyone if shipped unconditionally. Today many features are universally supported, so check real usage data before including them. Services and build tools can serve only the polyfills a given browser needs, based on its user agent or your target list.
Example
if (!Array.prototype.at) {
Array.prototype.at = function (i) {
return i < 0 ? this[this.length + i] : this[i];
};
}Browsers that already have at() skip the definition.
Common mistakes
- Shipping polyfills to every visitor instead of only those that need them.
- Using one for features that cannot be emulated, such as new CSS.
- Confusing polyfills with transpilers. Polyfills add APIs; transpilers rewrite syntax.
Related
Get notified when this term updates
Plus occasional practical tips on uptime and monitoring, nothing else. Unsubscribe anytime.
This page is general information written by our editorial team and updated when documentation changes. Servers and providers differ, so test changes safely first. See our editorial policy and disclaimer.