Introduction

La suite de mes notes Front lors de mon dernier Devoxx France 2015.

Dans le même registre, lire l’introduction précédente ainsi que la première partie consacrée à l’ECMAScript 6.

Web Components: Production ready

La tendance actuelle c’est des SPA orientée composants et non pas templates/vues.

Chaque framework propose déjà sa propre solution, les standards Web Components visent à uniformiser les implémentations pour avoir des composants réutilisables, inter-opérables, composables, sémantiques qui encapsulent une complexité technique/fonctionnelle particulière?

Les Web Components c’est

• Custom elements (comment les créer et les ajouter au DOM à travers des méthodes Javascript qui assurent un cycle de vie compatible)
• Templates (bout de code analysé par le navigateur mais non rendu)
• Shadow DOM (ajoute des frontières aux Web Components pour éviter des conflits CSS/JS)
• Import (Importer un Web Component dans une page ou dans un autre Web Component)

L’API web components est toujours en cours d’élaboration mais le standard est déjà prés pour la PROD grace aux polyfills et surtout l’implémentation Polymer de Google, version 1.0 stable annoncée au Google I/O 2015.

Si les frameworks (Angular, Ember, React…) implémentent également ce standard, on pourra alors dans la même page cohabiter plusieurs composants réalisés avec différents frameworks.

Pour plus de détails, le talk Web Components avec Polymer de Horacio Gonzalez et la meilleure adresse.