Web components au JugSummerCamp avec Horacio Gonzales

Comme à chacune de ses présentations Horacio introduit le sujet en nous parlant de son expérience personnelle. Il a eu besoin de créer un composant HTML qu'il fallait installer dans une application Angular, puis dans un portail (Portlet), puis dans une application PHP… 

La solution la plus simple est de faire 3 fois le développement mais vous conviendrez que c'est une grosse perte de temps. A chaque modification vous devez modifier le code X fois. Une autre solution est d'essayer de réfléchir à comment créer des composants web isolés de l'application englobante. La solution s'appelle les web components. Pour plus d'informations vous pouvez lire cet article que j'ai fait sur le sujet suite à la venue d'Horacio au Lyon Jug. Cette norme du W3C n'est malheureusement pas encore exploitable dans les navigateurs, mais plusieurs polyfills sont disponibles. Le plus connu est le projet Polymer de Google mais il existe aussi Xtag (Mozilla), Bosonic…

Le but de cette présentation était de montrer que les possibilités étaient multiples. Comme chaque composant est isolé des autres vous pouvez très facilement mixer les différentes technologies entre elles au sein d'une même application.

Durant sa démonstration, Horacio a montré des exemples où il mélait Polymer, Xtag, ReactJS (qui permet aussi de faire des composant)…

Quand on voit le code, nous pouvons voir qu'il existe plusieurs alternatives. Chacun peut choisir celle qu'il préfère. Polymer se rapproche du déclaratif à la mode Angular, Xtag plus de l'impératif à la mode Jquery….

Après nous pouvons nous poser la question de savoir s'il est bon de mixer les différentes solutions. La réponse est certainement nom mais cet interopérabilité est intéressante lorsque vous voudrez par exemple migrer vos composants vers une librairie plus récente. Cette souplesse vous permettra d'agir vraiment finement, en mode itératif sans avoir à tout reprendre d'un coup.