נט-א-פורטר

פרטי Net-a-porter

סיכום

אפליקציית Net-A-Porter חוסכת זמן פיתוח בעזרת ספריית הפולימרים של Google

NET-A-PORTER הטמיעו עיצוב המבוסס על רכיבים בנכסים הדיגיטליים שלהם באמצעות ספריית הפולימרים של Google. כתוצאה מכך, החברה חסכה באופן משמעותי בזמן הפיתוח על קוד עצמאי בכל האתרים שלה, ומשפרת את ביצועי ה-SEO באמצעות שימוש בנתונים מובְנים.

תוצאות

  • חיסכון בזמן הפיתוח.
  • קוד סטנדרטי בנכסים באינטרנט של NET-A-PORTER.
  • ביצועים משופרים של אופטימיזציה למנועי חיפוש באמצעות שימוש בנתונים מובְנים.

הורדת מקרה לדוגמה בפורמט PDF

מידע על NET-A-PORTER

NET-A-PORTER, שהושקה ביוני 2000, היא מובילה עולמית באופנת יוקרה באינטרנט, עם קולקציות של יותר מ-350 מהמעצבים המבוקשים ביותר בעולם.

מאחורי חזית החנות המקוונת של החברה, צוות ההנדסה של החברה עובד קשה כדי לספק ולתחזק את net-a-porter.com ואת רשת האתרים והאפליקציות שלה, כולל שני כתבי עת בנושא אופנה ורשת חברתית.

כשהם חושבים על נכסי האינטרנט שלהם, המהנדסים של NET-A-PORTER רואים כל דף באתר לא כדף, אלא כאוסף של רכיבים.

לדוגמה, דף מוצר יכול לכלול רכיב תמחור שמציין חיסכון בזמן מבצע, רכיב בקרוסלה עם קישורים למוצרים קשורים, רכיב אינטראקטיבי שמציג תלבושות מלאות שמציגות מוצרים, רכיב בתפריט הנפתח להוספת מוצר לרשימת משאלות, ועוד.

גישה המבוססת על רכיבים

בתחילת 2016, צוות ההנדסה של NET-A-PORTER החליט להעריך את האופן שבו החברה יכולה לקחת רכיבים ולהחיל אותם על אופן כתיבת הקוד בנכסי האינטרנט שלה. בגלל הדפים ונכסי המשנה הרבים שכלולים ב-NET-A-PORTER והצוותים השונים שמנהלים את הדפים, המהנדסים ידעו שזה לא הגיוני להתחיל מאפס עם טכנולוגיה חדשה שמחייבת להיפטר מהסטאק הקיים. פתרון אידיאלי יאפשר ליצור שכבות של רכיבים חדשים ולהוסיף אותם לדפים, בזמן שייווצרו רכיבים נוספים. הרכיבים צריכים להיות מסוגלים לתקשר עם שירותים שונים לקצה העורפי, והם יצטרכו גם להציג לסורקי האינטרנט נתונים מובְנים על המוצר.

בדיקות והצלחה בעזרת Polymer

אחרי שבדקו כמה פתרונות, הם בחרו לבדוק את ספריית הפולימרים של Google ב-NET-A-PORTER. הניסוי הראשוני ב-Polymer הושלם כל כך מהר ומוצלח שמהנדסי NET-A-PORTER החליטו להתקדם ולהכניס את Polymer לתכנון הכולל של האתר באופן כמעט מיידי.

רובין גלן ומת'יו גרין, מהנדסים בצוות, שיתפו את הפרטים הבאים:

היה קל לשלב את Polymer במערכת שלנו ולהתחיל לפעול תוך זמן קצר. העובדה שיש לנו אתר גדול כל כך עם כל כך הרבה היבטים שונים, פירושה שקל לנו למצוא חוסר עקביות. בזכות Polymer אנחנו יוצרים אפליקציות אינטרנט מלאות ומורכבות שניתן להתאים ולתחזק אותן.

גם התקינה של הקוד הייתה קלה, כי Polymer מבוסס על תקני הדפדפן של רכיבי אינטרנט. גלן ממשיך:

כשיוצרים באמצעות תקני אינטרנט, הקוד שלנו נשאר קרוב לפלטפורמה. כך קל יותר ללמוד איך להשתמש ברכיבים חדשים ולבנות אותם, וכך להבטיח שהביצועים ישתפרו כל הזמן ככל שהדפדפנים ישתפרו, והם מאפשרים לנו לתכנן את בטווח הארוך. מאחר שהוא מבוסס על תקן W3C, יש לנו ביטחון רב בפיתוח של הפלטפורמה. בקרוב אפילו הצורך למלא מילויים ייעלם לגמרי.

והיו גם יתרונות אופטימיזציה למנועי חיפוש (SEO). גלן אומר כי:

רכיבים מציגים באופן יעיל נתונים מובנים מפורטים על מוצרים למנועי חיפוש. הבדיקה של הנתונים המובְנים האלה היא עכשיו חלק ישיר מסכמת השילוב הרציף של הצוות שלנו.

בזכות ההשקעה מראש בתכנון ובבניית הרכיבים, צוות NET-A-PORTER רואה שיפור משמעותי ביעילות לטווח הארוך: קל יותר ליצור ולהשיק דפים חדשים ומהירים יותר, וקל יותר לשלב משוב מבעלי העניין ולבצע שינויים בעיצוב בתהליך ההנדסי.

עתיד הפולימר

הצוות מרוצה מהאפשרות של פיתוח אתרים ב-Polymer. גלן אומר,

ברגע שראינו איך אפשר לעשות שימוש חוזר ברכיבים על ידי שילובם בדרכים שונות, התרגשנו מאוד. התחלנו לתהות אם יש דרכים נוספות לנצל רכיבים בתוך העסק.

גלן חושב שיש עוד הרבה מה לגלות עם Polymer. הוא אומר,

זוהי רק תחילת התהליך של מסע הפולימרים. אנחנו משפרים כרגע את האספקה והתחזוקה של רכיבים קיימים, ובמקביל להרחיב את השימוש ב-Polymer לדפי NET-A-PORTER. אנחנו פועלים לתיעוד הגישה שלנו באמצעות מדריך סגנון של רכיבי NET-A-PORTER זמין לציבור. פולימר משמש מאוד גם ליצירת כלים פנימיים. לאחרונה בנינו סדרה של רכיבים גרפיים והפצנו מחדש את כל שירות המעקב שלנו כך שישתמש ב-Polymer.