Polymer et les composants Web sont des sujets très brûlants ces derniers temps, et comme cet écosystème évolue rapidement, il est souvent difficile pour les développeurs de se tenir au courant des dernières nouveautés.
Lors de son intervention lors du Chrome Dev Summit, Matt McNulty, responsable de l'ingénierie au sein de l'équipe Polymer, nous a expliqué ce qu'est Polymer et nous a présenté la feuille de route de Polymer 1.0.
Qu'est-ce que Polymer ?
Tout d'abord, qu'est-ce que Polymer exactement ?
Polymer est une bibliothèque qui vous aide à créer des éléments et des applications à partir de composants Web. Les composants Web constituent un ensemble de nouvelles normes de pointe qui permettent aux développeurs d'étendre le vocabulaire HTML avec leurs propres éléments personnalisés.
Les composants Web sont conçus pour constituer une nouvelle primitive du navigateur. Ils sont donc très puissants, mais de très bas niveau, et leur utilisation nécessite une certaine quantité de code.
Polymer facilite le travail des composants Web en "sucrant" la syntaxe. Elle réduit la quantité de code récurrent à écrire et ajoute un style déclaratif pour que la création de composants Web soit aussi facile que d'écrire du code HTML.
L'expérience Polymer
L'objectif de Polymer était de tester si nous pouvions émuler les normes Web Components et recueillir les commentaires des développeurs avant l'intégration de ces technologies dans tous les navigateurs. À mesure que de plus en plus de développeurs ont commencé à utiliser Polymer, il est passé de simples polyfills à une véritable bibliothèque pleine de fonctionnalités de productivité (liaison de données, observateurs de changement d'attribut, recherche automatique de nœuds, etc.). Mais tous les tests ont donné des résultats. Alors, comment avons-nous fait ?
Si de nombreux développeurs ont déclaré aimer l'expressivité et les gains de productivité liés à l'utilisation de composants Web dans Polymer, ils ont également exprimé leurs préoccupations concernant les performances et la complexité globale.
Il met en évidence une tension naturelle que Polymer a eue depuis le début: être une expérience pour faire avancer la plate-forme Web, mais aussi créer une solution digne de la production sur laquelle les développeurs peuvent compter.
Changements à venir
L'équipe de Polymer a examiné attentivement chaque fonctionnalité de la bibliothèque afin d'élaborer une version allégée et prête pour la production que les développeurs peuvent utiliser en toute confiance.
Calques
Polymer a été refactorisé en une série de couches. Les principales fonctionnalités sont rapides et simples, tandis que les fonctionnalités plus avancées seront disponibles sur option. Dans la plupart des cas d'utilisation, les fonctionnalités de base doivent répondre aux besoins des développeurs.
Liaison de données simplifiée
Le système de liaison de données de Polymer a également été considérablement optimisé pour les performances. Conformément à l'approche multicouche, la liaison bidirectionnelle est désormais activée, les liaisons unidirectionnelles étant définies par défaut. De plus, les types de propriétés publiés ont été rendus explicites, et une modification de propriété déclenche désormais un événement pour faciliter la communication entre les éléments de différentes bibliothèques.
Shadow DOM Leaner
Le polyfill Shadow DOM est une prouesse technologique incroyable. Il a été conçu pour être complet et conforme aux spécifications, ce qui est important pour tester de manière approfondie la primitive de la plate-forme. Malheureusement, il introduit un certain nombre de goulots d'étranglement qui affectent les performances de fonctionnalités que Polymer n'utilise pas.
La prochaine version de Polymer adoptera une approche différente, en utilisant une couche de type shim qui ne polyfille que ce dont Polymer a besoin.
Le polyfill existant continuera de fonctionner pour les composants Web génériques autres que Polymer.
Migrer vers webcomponents.org
En parlant de polyfills, ils ont aussi changé de place. À l'heure actuelle, de nombreux développeurs ne comprennent pas la relation entre Polymer et les composants Web. Certains pensent qu'il est nécessaire d'utiliser tout Polymer pour utiliser les composants Web, alors qu'en fait, vous n'avez besoin que des polyfills.
Pour clarifier cette distinction, les polyfills sont déplacés vers webcomponents.org et renommés webcomponents.js
.
Ce déplacement est conçu pour permettre aux autres auteurs de bibliothèques d'exploiter les polyfills sans aucune confusion. L'équipe de Polymer continuera à contribuer à la création des polyfills, mais nous espérons que ce changement les transformera en ressources partagées pour la communauté.
Résultats
Quels sont les résultats de toutes ces modifications ?
Rapidité
Sous Chrome, Polymer est désormais cinq fois plus rapide, et huit fois plus rapide dans Safari.
Taille du fichier
La taille du fichier a également été réduite de 87%, passant de 123 Ko à 15 Ko (6 Ko au format gzip).
Feuille de route
Des modifications destructives de l'API seront apportées dans la prochaine version. Elles seront représentées par le nouveau numéro de version (0.8), mais l'équipe souhaite clarifier qu'il ne s'agit pas d'une réécriture. Le transfert de votre projet actuel de Polymer 0.5 vers 0.8 devrait être relativement simple.
L'équipe Polymer a également défini une feuille de route pour offrir aux développeurs plus de précisions sur les prochaines versions.
L'aperçu 0.8 est désormais disponible en tant que branche sur GitHub (bien qu'il soit toujours très activement développé et qu'il manque de documentation). La version bêta officielle 0.9 est prévue pour le premier trimestre 2015, la version 1.0 ayant lieu au cours du deuxième trimestre.
Le test est terminé
Avec tous les changements récents apportés à Polymer, l'équipe à l'origine de ce projet pose les bases pour que les composants Web deviennent partie intégrante de la pile de chaque développeur. Si vous ne connaissez pas les composants Web, c'est le moment idéal pour en savoir plus et vous familiariser avec ces technologies révolutionnaires. Si vous utilisez déjà des composants (et Polymer), l'avenir s'annonce prometteur. Surveillez le blog Polymer pour connaître les dernières mises à jour et inscrivez-vous à la liste de diffusion Polymer pour toute question ou tout commentaire. À vous de jouer !