Sommet des développeurs Chrome 2014 – Polymer – État de l'Union

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.

Polymer aide les développeurs à créer des applications plus rapidement

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 rend les composants Web plus doux

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 ?

Amélioration requise de la fiche de rapport Polymer

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.

Refactorisation de Polymer en couches

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.

La liaison de données a été simplifiée

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.

Shim Shadowdom est beaucoup plus rapide

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.

Déplacement des polyfills vers webcomponents.org

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.

Polymer est désormais 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).

Polymer est désormais 87% plus petit

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.

Feuille de route de Polymer, bêta au premier trimestre, 1.0 au deuxième trimestre

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 !