Resumen
Net-A-Porter ahorra tiempo de desarrollo con la biblioteca Polymer de Google
NET-A-PORTER implementó un diseño basado en componentes en sus propiedades en línea mediante la biblioteca Polymer de Google. El resultado fue un gran ahorro en tiempo de desarrollo, código estandarizado en todos sus sitios y un mejor rendimiento de SEO mediante el uso de datos estructurados.
Resultados
- Se ahorró tiempo de desarrollo.
- Código estandarizado en las propiedades en línea de NET-A-PORTER
- Se mejoró el rendimiento de la SEO mediante el uso de datos estructurados.
Descargar PDF del caso de éxito
Acerca de NET-A-PORTER
NET-A-PORTER, lanzado en junio de 2000, es un líder mundial en moda de lujo en línea, con colecciones de más de 350 de los diseñadores más codiciados del mundo.
Detrás de la vidriera en línea de la empresa, el equipo de ingeniería trabaja arduamente para ofrecer y mantener net-a-porter.com y su red de sitios web y apps, que incluye dos revistas de moda y una red social.
Cuando piensan en las propiedades web, los ingenieros de NET-A-PORTER ven cada página de un sitio no como una página, sino como una colección de componentes.
Una página de producto, por ejemplo, podría incluir un componente de precios que indique el ahorro durante una oferta, un componente de carrusel con vínculos a productos relacionados, un componente interactivo que muestra atuendos completos que presentan productos, un componente de menú desplegable para agregar un producto a una lista de deseos y mucho más.
Un enfoque basado en componentes
A principios de 2016, el equipo de ingeniería de NET-A-PORTER decidió evaluar cómo la empresa podía tomar componentes y aplicarlos a la forma en que escribe el código de sus propiedades web. Debido a las numerosas páginas y subpropiedades que pertenecen a NET-A-PORTER, y a los diferentes equipos que administran esas páginas, los ingenieros sabían que no tenía sentido empezar desde cero con una tecnología nueva que requeriría deshacerse de su pila existente. Una solución ideal les permitiría agregar componentes nuevos y agregarlos a las páginas a medida que se creaban componentes adicionales. Los componentes deberían poder comunicarse con diferentes servicios de backend de forma independiente y, además, tendrían que mostrar datos estructurados sobre el producto a los rastreadores web.
Pruebas y éxito con Polymer
Después de evaluar varias soluciones, NET-A-PORTER eligió probar la biblioteca de Polymer de Google. El experimento inicial con Polymer se completó tan rápido y con éxito que los ingenieros de NET-A-PORTER decidieron continuar y agregar Polymer a la planificación general del desarrollo del sitio web de la organización casi de inmediato.
Robin Glen y Matthew Green, ingenieros del equipo, compartieron lo siguiente:
Polymer fue fácil de integrar en nuestro sistema y poner todo en marcha en poco tiempo. El hecho de que tengamos un sitio web tan grande con tantos aspectos diferentes significa que es fácil para nosotros tener incoherencias. Polymer nos permite crear aplicaciones web completas y complejas que son escalables y fáciles de mantener.
La estandarización de código también fue fácil, ya que Polymer se basa en los estándares del navegador de componentes web. Glen continúa:
La construcción con estándares web mantiene nuestro código cerca de la plataforma. De esta manera, es más fácil aprender a usar y compilar componentes nuevos, lo que garantiza que el rendimiento mejore de forma continua a medida que los navegadores mejoren, y nos permite planificar a largo plazo. Ya que se basa en el estándar W3C, nos confiamos en el desarrollo de la plataforma. Pronto, incluso la necesidad de polyfills desaparecerá.
Y también hubo beneficios de SEO. Glen dice lo siguiente:
Los componentes muestran de manera efectiva datos estructurados detallados sobre los productos en los motores de búsqueda. Probar estos datos estructurados ahora es directamente parte del esquema de integración continua de nuestro equipo.
El equipo de NET-A-PORTER hace la inversión inicial en el diseño y la compilación de componentes para obtener mejoras significativas en la eficiencia a largo plazo: las funciones y páginas nuevas son más sencillas y rápidas de crear y lanzar, y es más fácil integrar los comentarios de las partes interesadas y los ajustes de diseño en el proceso de ingeniería.
El futuro de Polymer
El equipo está muy contento con la forma en que Polymer habilitó su desarrollo web. Glen dice:
Apenas vimos cómo podíamos reutilizar componentes reuniendo estos componentes, nos entusiasmó. Nos preguntamos si existían otras formas de explotar los componentes dentro del negocio.
Glen cree que hay mucho más para explorar con Polymer. Te dice:
Este es solo el comienzo de nuestro recorrido con Polymer. Actualmente, estamos mejorando la entrega y el mantenimiento de los componentes existentes, mientras trabajamos para expandir el uso de Polymer a más páginas de NET-A-PORTER. Estamos trabajando para documentar nuestro enfoque con una guía de estilo del componente NET-A-PORTER disponible de forma pública. Polymer también ha sido muy útil para las herramientas internas. Recientemente, compilamos un conjunto de componentes de gráficos y actualizamos todo el servicio de supervisión para que use Polymer.