En este artículo vamos a reflexionar sobre qué son exactamente los componentes web, aunque por el nombre que se les ha dado pueda parecer que existen desde tiempo inmemorial (no confundir con los clásicos widgets) en realidad son una especificación relativamente reciente.
El World Wide Web Consortium (W3C) definió el primer borrador sobre la implementación de componentes web durante el 2013 y los principales fabricantes de navegadores web han ido incorporando de manera gradual las funcionalidades al motor nativo de sus respectivos navegadores.
Un ejemplo, Google ha construido sobre web components un No-framework (Polymer 1.0) con la idea de construir componentes optimizados para web y dispositivos móviles, algo análogo al clásico bootstrap pero diseñado desde cero con la idea “Mobile first”, ellos lo califican como un Mobile SDK para la web lo cual puede dar alguna pista de sus intenciones, cabría pensar que la barrera dispositivo móvil / web se está diluyendo cada vez más.
El rendimiento parece ser espectacular durante algunos meses he ido monitorizando las últimas actualizaciones de sus productos y se constata que la compañía está cambiando sus productos insignia y adaptándolos al uso de Polymer.
Microsoft parece que finalmente apuesta también por incorporarlos en su último navegador Edge (aunque de manera más pausada).
Qué son, para que sirven y por qué son importantes
Los componentes web surgen como solución a la necesidad de poder crear componentes reusables, todos hemos hecho esto antes así que ¿cuál es la diferencia? Bien, forman parte (o formarán parte) del motor nativo del explorador.
Esto implica que si el navegador lo soporta no necesita de librerías externas pero lo más importante, el rendimiento es superior porque los componentes no se renderizan sino que se parsean desde el propio navegador.
La gran mayoría de nosotros ya hemos usado componentes web probablemente sin saberlo, en concreto, el reproductor de video HTML5, ¿nunca os habéis preguntado cómo genera los controles de reproducción si no están en los marcadores HTML?
Pues lo hace usando esta tecnología, en concreto la “Shadow DOM”, que no es más que un subárbol de DOM no accesible directamente por el usuario, pero si por el navegador.
De esta manera cuando nosotros incluimos el siguiente marcador HTML:
<video src=» https://www.youtube.com/watch?v=C3-WY9hYZIA» controls></video>
El navegador lo que realmente renderiza aunque no lo veamos es lo siguiente:
Obviamente este es el ejemplo más sencillo, pero cabe señalar que los componentes aparte de ser reutilizables son customizables también y pueden llegar a encapsular componentes complejos como este:
Futuro y presente (with a Little help from my friends the polyfills)
Puede parecer que el hecho que no todos los navegadores actuales sean compatibles con esta tecnología imposibilita su uso real en proyectos, pero esto en realidad no es así.
Actualmente los navegadores todavía no los incorporan, pero existe una solución para esto: existen los polyfills, que no dejan de ser plugins que se incluyen como recurso en la página y que permiten incorporar la tecnología a cualquier navegador que no lo incorpore de manera nativa.
Aunque tecnología está actualmente calificada como experimental, el hecho que el W3C esté impulsando activamente su estandarización, junto con la adopción por parte de los principales fabricantes de dicho estándar hace que su futuro sea bastante prometedor, parece que eventualmente en el futuro todos los navegadores incluirán web components.
Hay quien incluso los califica de game changer dentro del sector y esto es así porque tiene la potencialidad de cambiar la manera que tenemos de desarrollar aplicaciones en la web (y en dispositivos móviles).
Referencias
https://www.w3.org/TR/components-intro/
http://www.html5rocks.com/en/tutorials/webcomponents/shadowdom/
http://jonrimmer.github.io/are-we-componentized-yet/
https://www.polymer-project.org/1.0/
Descubre aquí cómo desarrollar proyectos bajo tecnología Microsoft de manera exitosa.
Jaime Arroyo es especialista SharePoint. Se ha unido a la Unidad de Soluciones Microsoft de SOGETI recientemente como Analista programador. Anteriormente ha trabajado como consultor especializado en dicha tecnología para diversos clientes de ámbito nacional e internacional.
Artículos y tendencias sobre soluciones tecnológicas 
0 comments on “Web Components y el presente-futuro de la Web”