JavaScript Polyfills On The Fly Depending On The Browser With polyfill.io
September 12, 2020 by Andreas Wik
polyfill.io is a neat service that lets you load polyfills for certain JavaScript features only if the visitor’s browser actually needs it.
One thing I’ve used it for myself has been when an external library may be using an ES6 feature that’s not necessarily supported in older browsers.
polyfill.io checks what browser makes the request, and depending on that it returns the necessary polyfills.
I can then simply include the following on my page, before the library:
<script type="text/javascript" src="https://polyfill.io/v3/polyfill.min.js"></script>polyfill.io will now return any polyfills that the browser may need.
You can also decide to only request polyfills for certain features that you know are used in your code. Let’s say we specifically need a polyfill for Object.assign if the browser doesn’t support it. We would then add on a features parameter (which should be a comma separated list if more than one):
<script type="text/javascript" src="https://polyfill.io/v3/polyfill.min.js?features=Object.assign"></script>
Check out polyfill.io for more details.
Share this article
