Polyfill.io Video Tutorial
The problem when we write browser-side JavaScript and we have no control over the environment that will be used to run it. It is difficult to predict whether a function or object will be supported. Fortunately, the dynamic nature of JavaScript makes it possible to add polyfill who will define the objects or functions in case they do not exist. This adds however some problems:
- It is necessary to look for the blocks of codes corresponding to the polyfills to be used.
- All users are required to load the code of a polyfill even if in the end it is only used by 1% of users.
Polyfill.io
Polyfill.io is a service which proposes to solve these 2 problems thanks to the use of a simple API which makes it possible to load the polyfills on request. It is enough to load the file JavaScript by passing to him as parameter the methods to polyfill.
https://polyfill.io/v3/polyfill.min.js?features=NodeList.prototype.forEach,Array.prototype.forEach,IntersectionObserver
The advantage is that it will also check the browser's User Agent header to distribute only the polyfills needed by the current browser. So it will not impose users of modern browsers a download unnecessary.
The risks
Be careful however with the use of a third party service to load your JavaScript code.
- Polyfill.io does not guarantee SLA and the service may be unavailable or discontinued overnight.
- In the same way, if the service is stopped and someone malicious resumes the domain you could end up with dishonest code running on your site.
To avoid these problems you can host your own instance of the Polyfill.io service using the source code (if you need help configuring your server for a NodeJS application you can use this tutorial).
