What are JavaScript polyfills for?

Polyfills in JavaScript are pieces of code that provide modern functionality to older browsers that lack native support for those features. They bridge the gap between the JavaScript language features and APIs available in modern browsers and the limited capabilities of older browser versions.

They can be implemented manually or included through libraries and are often used in conjunction with feature detection.

Common use cases include:

• New JavaScript Methods: For example, Array.prototype.includes(), Object.assign(), etc.
• New APIs: Such as fetch(), Promise, IntersectionObserver, etc. Modern browsers support these now, but for a long time they had to be polyfilled.

Libraries and services for polyfills:

• core-js: A modular standard library for JavaScript which includes polyfills for a wide range of ECMAScript features.

  jsCopy

  import "core-js/actual/array/flat-map"; // With this, Array.prototype.flatMap is available to be used.
  
  [1, 2].flatMap((it) => [it, it]); // => [1, 1, 2, 2]
  

• Polyfill.io: A service that provides polyfills based on the features and user agents specified in the request.

  jsCopy

  <script src="https://polyfill.io/v3/polyfill.min.js"></script>