Être capable d’écrire du code moderne et de l’expédier vers des navigateurs plus anciens #
Un polyfill est un morceau de code (généralement du code Javascript) utilisé pour fournir une fonctionnalité moderne à des navigateurs plus anciens qui ne la supportent pas nativement.
des fonctionnalités modernes à des navigateurs plus anciens qui ne les supportent pas nativement.
Par exemple, le polyfill pour Object.assign
doit fournir la même
fonctionnalité que la fonction réelle, mais il faut 29 lignes de code :
Polyfill Object.assign
N’incluez les polyfills que pour les navigateurs que vous souhaitez prendre en charge. #
Pour que nos bundles JavaScript restent petits, nous ne voulons fournir des polyfills que pour les
navigateurs que nous voulons supporter, c’est-à-dire IE11 et plus. Si vous n’avez pas besoin de supporter IE,
il y a de fortes chances que votre paquet soit beaucoup plus petit.
Vérifiez si la méthode existe, avant de l’implémenter #
Vérifiez toujours si la méthode que vous voulez polyfillier existe, avant de l’écraser.
avant de la remplacer. Par exemple trim()
est une méthode qui n’est pas prise en charge par les très anciennes versions d’IE
très anciennes :
if (typeof String.prototype.trim !== 'function') {
String.prototype.trim = function() {
return this.replace(/^\s+|\s+$/g,'')
}
}
> " zebra ".trim()
Après avoir écrit la logique conditionnelle, vous pouvez avoir un script qui s’exécute avant
votre code dans votre HTML document et exécute ces if checks
pour voir si
les méthodes sont prises en charge. Si elles sont prises en charge, ne faites rien.
si elles ne le sont pas, implémentez-les.