Riepilogo
Net-A-Porter fa risparmiare tempo di sviluppo con la Polymer Library di Google
NET-A-PORTER ha implementato una progettazione basata su componenti nelle proprietà online utilizzando la libreria Polymer di Google. Il risultato è stato un notevole risparmio in termini di tempo di sviluppo, codice standardizzato sui siti e un miglioramento delle prestazioni SEO grazie all'uso dei dati strutturati.
Risultati
- Risparmio di tempo di sviluppo.
- Codice standardizzato sulle proprietà online di NET-A-PORTER.
- Miglioramento delle prestazioni della SEO grazie all'uso dei dati strutturati.
Scarica il case study in formato PDF
Informazioni su NET-A-PORTER
Lanciata nel giugno del 2000, NET-A-PORTER è leader globale nella moda di lusso online, con collezioni di oltre 350 tra i designer più ricercati al mondo.
Dietro la vetrina online dell'azienda, il team tecnico dell'azienda lavora duramente per pubblicare e gestire net-a-porter.com e la sua rete di siti web e app, che include due riviste di moda e un social network.
Quando pensano alle proprietà web, gli ingegneri di NET-A-PORTER vedono ogni pagina di un sito non come una pagina, ma come un insieme di componenti.
Una pagina di prodotto, ad esempio, potrebbe includere un componente per il prezzo che indica i risparmi durante una vendita, un componente carosello con link a prodotti correlati, un componente interattivo che mostra abiti completi che presentano prodotti, un componente menu a discesa per aggiungere un prodotto a una lista desideri e altro ancora.
Un approccio basato su componenti
All'inizio del 2016, il team tecnico di NET-A-PORTER ha deciso di valutare in che modo l'azienda potesse prendere i componenti e applicarli al modo in cui scrivono il codice per le loro proprietà web. A causa delle numerose pagine e proprietà secondarie che rientrano in NET-A-PORTER e dei diversi team che le gestiscono, gli ingegneri sapevano che non aveva senso iniziare da zero con una nuova tecnologia che avrebbe richiesto l'eliminazione dello stack esistente. Una soluzione ideale consentirebbe di sovrapporre nuovi componenti e aggiungerli alle pagine man mano che vengono creati altri componenti. I componenti dovrebbero essere in grado di comunicare in modo indipendente con diversi servizi di backend e anche di mostrare dati strutturati relativi al prodotto ai web crawler.
Test e successo con Polymer
Dopo aver valutato diverse soluzioni, NET-A-PORTER ha scelto di testare la libreria Polymer di Google. Un esperimento iniziale con Polymer è stato completato così rapidamente e con successo che gli ingegneri di NET-A-PORTER hanno deciso di andare avanti e introdurre Polymer nel piano generale dello sviluppo dei siti web dell'organizzazione quasi immediatamente.
Robin Glen e Matthew Green, ingegneri del team, hanno raccontato:
Polymer è stato facile da integrare nel nostro sistema e da subito operativo. Il fatto di avere un sito web così grande con tanti aspetti diversi significa che ci sono facilmente incongruenze. Polymer ci consente di creare applicazioni web complete e complesse scalabili e gestibili.
Anche la standardizzazione del codice è stata semplice, perché Polymer si basa sugli standard dei browser con i componenti web. Glen continua:
Lo sviluppo utilizzando standard web ci consente di mantenere il nostro codice vicino alla piattaforma. In questo modo è più facile imparare a utilizzare e creare nuovi componenti, garantendo sempre un miglioramento delle prestazioni man mano che i browser migliorano e consentendoci di pianificare una pianificazione a lungo termine. Poiché si basa sullo standard W3C, confidiamo nella creazione sulla piattaforma. Presto scomparirà anche la necessità di polyfill.
E ci sono stati anche vantaggi per la SEO. Glen dice che:
I componenti mostrano in modo efficace ai motori di ricerca dati strutturati dettagliati sui prodotti. Ora il test di questi dati strutturati fa parte direttamente dello schema di integrazione continua del nostro team.
Effettuando l'investimento iniziale nella progettazione e nella creazione dei componenti, il team di NET-A-PORTER sta registrando un notevole aumento dell'efficienza a lungo termine: le nuove pagine e funzionalità sono più semplici e rapide da creare e avviare ed è più facile integrare i feedback degli stakeholder e apportare modifiche alla progettazione nel processo di progettazione.
Il futuro di Polymer
Il team è entusiasta di come Polymer ha consentito il suo sviluppo web. Glen dice:
Non appena abbiamo capito come poter riutilizzare i componenti componendoli in modi diversi, ci siamo entusiasmanti. Abbiamo iniziato a chiederci se c'erano altri modi in cui potremmo sfruttare i componenti all'interno dell'azienda.
Glen ritiene che ci sia molto altro da esplorare con Polymer. Dice:
Questo è solo l'inizio del nostro viaggio con Polymer. Attualmente stiamo migliorando la distribuzione e la gestibilità dei componenti esistenti e stiamo lavorando per estendere l'uso di Polymer ad altre pagine NET-A-PORTER. Ci stiamo adoperando per documentare il nostro approccio con una guida di stile per i componenti NET-A-PORTER disponibile pubblicamente. Polymer è stato molto utile anche per gli strumenti interni. Di recente abbiamo creato un insieme di componenti grafici e re-platformizzato l'intero servizio di monitoraggio per l'uso di Polymer.