摘要
Net-A-Porter 透過 Google 的 Polymer 程式庫節省開發時間
NET-A-PORTER 使用 Google 的 Polymer 程式庫，在他們的線上屬性中實作以元件為基礎的設計。最終能大幅縮短開發時間，在網站上全面整合程式碼，而使用結構化資料也提升了 SEO 成效。
成果
- 節省開發時間。
- NET-A-PORTER 線上資源上的標準化程式碼。
- 使用結構化資料提高搜尋引擎最佳化 (SEO) 成效。
關於 NET-A-PORTER
NET-A-PORTER 於 2000 年 6 月推出，是全球豪華時尚領域的全球領導品牌，匯集了來自全球 350 多個最美味的設計師系列。
在公司線上店面後方，該公司的工程團隊致力提供及維護 net-a-porter.com 以及自家網站和應用程式的網路，其中包含兩本時尚雜誌和一個社群網路。
「NET-A-PORTER」工程師在思考網站資源時，會將網站上的每個網頁當成元件的集合，而非單一網頁。
舉例來說，產品頁面可能包含在特價期間儲存的定價元件、包含相關產品連結的輪轉介面元件、展示主打產品的完整服裝的互動式元件，以及將產品加入願望清單的下拉式選單元件等。
以元件為基礎的方法
2016 年初，NET-A-PORTER 工程團隊決定如何取用元件，並以撰寫網站資源程式碼的方式應用。由於很多頁面和子資源都屬於「NET-A-PORTER」，以及管理這些頁面的不同團隊，因此工程師也意識到，採用必須捨棄現有堆疊的新技術就不太合理。理想的解決方案可讓員工將新元件分層，並在建立其他元件時添加到頁面中。元件必須能分別與不同的後端服務通訊，而且也需要向網路檢索器顯示產品的結構化資料。
Polymer 的測試與成功
在評估多種解決方案後，NET-A-PORTER 選擇測試 Google 的 Polymer 程式庫。對 Polymer 進行的初始實驗很快就完成了，因此 NET-A-PORTER 的工程師決定進一步發展，將 Polymer 引進機構的整體網站開發規劃。
團隊成員 Robin Glen 和 Matthew Green 共同努力：
Polymer 很容易就能整合至系統，且無須立即啟動。我們擁有如此大型的網站，具有許多不同的面向，因此很容易出現不一致的情況。Polymer 讓我們能夠建立完整且複雜的網頁應用程式，不僅可擴充，而且能維護。
程式碼標準化也很容易，因為 Polymer 是以網頁元件瀏覽器標準為基礎。Glen 繼續執行：
使用網路標準進行建構時，我們的程式碼就在平台附近。如此一來，您就能更輕鬆地瞭解如何使用及建構新元件，確保瀏覽器隨著瀏覽器改善而持續改善效能，我們也能用來規劃長期的計畫。這套系統以 W3C 標準為基礎 所以我們很有信心地在平台上建構應用程式。不久後，甚至需要使用 polyfill。
另外，搜尋引擎最佳化也帶來許多好處。他表示：
元件可以有效向搜尋引擎顯示產品的詳細結構化資料。測試這項結構化資料現已直接成為團隊持續整合配置的一部分。
NET-A-PORTER 團隊預先投入了設計及建構元件，因此長期的效率大幅提升：新頁面和功能的建立和啟動速度變得更簡單、更快速，而且更易於將利害關係人的意見回饋與設計調整工作整合到工程流程中。
Polymer 的未來
Polymer 對自家網路開發情形帶來了莫大的助益，Glen 說：
知道如何以不同方式組合元件時 重複使用元件後，我們就感到非常興奮。我們開始思考是否有其他方法可以運用企業內部元件。
Glen 認為透過 Polymer 探索更多地方等。他說：
我們現在是 Polymer 旅程的開端。我們目前正改善現有元件的提供和可維護性，同時致力將 Polymer 拓展至更多 NET-A-PORTER 頁面。我們正在努力記錄公開的 NET-A-PORTER 元件樣式指南。Polymer 對內部工具來說也是非常實用我們最近建構了一組圖形元件，並重新建構整個監控服務平台，以便使用 Polymer。