Chrome Dev Summit 2014 - Polymer - Estado de la unión

Polymer y los componentes web son temas muy populares últimamente y, dado que este ecosistema evoluciona rápidamente, a menudo puede ser difícil para los desarrolladores mantenerse al tanto de los últimos cambios.

En su charla en Chrome Dev Summit, Matt McNulty, gerente de Ingeniería del equipo de Polymer, explicó qué es Polymer y, además, describió el plan de acción de Polymer 1.0.

¿Qué es Polymer?

Primero, ¿qué es exactamente Polymer?

Polymer es una biblioteca que te ayuda a compilar elementos y apps a partir de componentes web. Los componentes web son un conjunto de nuevos estándares de vanguardia que permiten a los desarrolladores ampliar el vocabulario HTML con sus propios elementos personalizados.

Polymer ayuda a los desarrolladores a compilar aplicaciones más rápido

Debido a que los componentes web están diseñados para ser una nueva primitiva para el navegador, significa que son muy potentes, pero también de muy bajo nivel y que trabajar con ellos requiere bastante código.

Polymer hace que los componentes web sean más dulces

Polymer facilita el trabajo de componentes web mediante la "sugarización" de la sintaxis. Reduce la cantidad de código estándar que debes escribir y agrega un estilo declarativo, por lo que crear componentes web es tan fácil como escribir HTML.

El experimento de los polímeros

Polymer comenzó como un experimento para ver si podíamos polyfill sobre los estándares de componentes web y obtener comentarios de los desarrolladores antes de que estas tecnologías se enviaran en todos los navegadores. A medida que más desarrolladores comenzaron a usar Polymer, pasó de ser solo polyfills a una biblioteca real llena de funciones de productividad (vinculación de datos, supervisores de cambios de atributos, búsqueda automática de nodos, etc.). Sin embargo, todos los experimentos arrojaron resultados. Entonces, ¿cómo los hicimos?

La tarjeta de informe de Polymer requiere mejoras

Si bien muchos desarrolladores dijeron que les gustaban las mejoras en la expresividad y la productividad de trabajar con componentes web en Polymer, también expresaron inquietudes sobre el rendimiento y la complejidad general.

Esto destaca una tensión natural que Polymer siempre ha tenido: ser un experimento para impulsar la plataforma web, pero también crear algo digno de producción en el que los desarrolladores puedan confiar.

Próximos cambios

El equipo de Polymer analizó detenidamente cada función de la biblioteca con el objetivo de diseñar una versión más eficiente y lista para producción que los desarrolladores puedan usar con confianza.

Capas

Polymer se refactorizó en una serie de capas. Las funciones principales son rápidas y eficientes, mientras que se habilitarán las más avanzadas. En la mayoría de los casos de uso, las funciones principales deberían satisfacer las necesidades de los desarrolladores.

Polymer se refactorizó en capas

Vinculación de datos simplificada

El sistema de vinculación de datos de Polymer también se optimizó de forma significativa para el rendimiento. Si sigues el enfoque por capas, ahora la vinculación bidireccional está habilitada y la configuración predeterminada es la unidireccional. Además, los tipos de propiedad publicados son explícitos y un cambio de propiedad ahora activa un evento para ayudar a que los elementos de diferentes bibliotecas se comuniquen con mayor facilidad.

Se simplificó la vinculación de datos

Shadow DOM más pequeño

El polyfill de Shadow DOM es una increíble hazaña de ingeniería. Se diseñó para ser integral y cumplir con las especificaciones, lo cual es importante para probar por completo la primitiva de la plataforma, pero, desafortunadamente, presenta varios cuellos de botella de rendimiento para funciones que Polymer no usa.

La próxima versión de Polymer adoptará un enfoque diferente, en la que se empleará una capa con estilo de corrección de compatibilidad que solo polyfill necesita lo que necesita.

La Shadowdom de Shim es mucho más rápido

El polyfill existente permanecerá activo para los componentes web genéricos que no sean de Polymer.

Trasladando a webcomponents.org

Hablando de polyfills, también se están convirtiendo en un nuevo hogar. En la actualidad, muchos desarrolladores están confundidos respecto de la relación entre Polymer y los componentes web. Algunos creen que se debe usar todo Polymer para usar componentes web, cuando, en realidad, solo se necesitan los polyfills.

Para que esta distinción sea más clara, se moverán los polyfills a webcomponents.org y ahora se cambiará su nombre por webcomponents.js.

Traslado de Polyfills a webcomponents.org

Este movimiento está diseñado para ayudar a otros autores de bibliotecas a aprovechar los polyfills sin confusión. El equipo de Polymer seguirá contribuyendo a los polyfills, pero esperamos que este cambio los convierta en un recurso más compartido para la comunidad.

Resultados

Entonces, ¿cuáles son los resultados de todos estos cambios?

Velocidad

En Chrome, Polymer ahora es 5 veces más rápida, y en Safari, 8 veces su velocidad.

Polymer ahora es 8 veces más rápido en Safari

Tamaño del archivo

El tamaño del archivo también se redujo en un 87%, de 123 KB a 15 KB (6 KB en formato gzip).

Polymer ahora es un 87% más pequeño

Hoja de ruta

Habrá algunos cambios rotundos en la API en la próxima versión, que se indican con el nuevo número de versión (0.8), pero el equipo quiere aclarar que no se trata de una reescritura. Migrar tu proyecto actual de Polymer 0.5 a 0.8 debería ser bastante trivial.

El equipo de Polymer también describió una hoja de ruta para brindar a los desarrolladores más claridad sobre los próximos lanzamientos.

Hoja de ruta de Polymer, beta en el primer trimestre, y de versión 1.0 en el segundo trimestre

La versión preliminar de 0.8 ya está disponible como una rama en GitHub (aunque todavía se está desarrollando de manera muy activa y carece de documentación). La versión beta oficial 0.9 está prevista para el primer trimestre de 2015, mientras que la versión 1.0 se realizará en el segundo trimestre.

El experimento finalizó

Con todos los cambios recientes en Polymer, el equipo que está detrás está sentando las bases para que los componentes web se conviertan en una parte integral de la pila de cada desarrollador. Si es la primera vez que utiliza Web Components, ahora es un buen momento para hacerlo y familiarizarse con estas tecnologías transformadoras. Si ya estás trabajando con componentes (y Polymer), el futuro se verá brillante. Mantente atento al blog de Polymer para conocer las últimas actualizaciones y regístrate en la lista de distribución de Polymer para hacer preguntas o comentarios. ¡Disfruta de los nuevos trucos!