Polymer 和 Web 元件是近期的熱門話題,由於這個生態系統發展迅速,開發人員往往很難隨時掌握最新變化。
在 Chrome 開發人員大會上,Polymer 團隊的工程管理員 Matt McNulty 解釋了 Polymer 的概念,並概略說明 Polymer 1.0 的路線圖。
什麼是 Polymer?
首先,什麼是 Polymer?
Polymer 是一種程式庫,可協助您使用網路元件建構元素和應用程式。網頁元件是一套最新的標準,可讓開發人員使用自訂元素擴充 HTML 字彙。

由於 Web 元件是為瀏覽器設計的新基本元件,因此它們功能強大,但也非常低階,因此使用這些元件需要大量程式碼。

Polymer 可透過「糖衣」語法,讓您更輕鬆地操作網頁元件。這項功能可減少您需要編寫的樣板程式碼數量,並新增宣告式樣式,讓您輕鬆地建立網頁元件,就像編寫 HTML 一樣簡單。
軟陶實驗
Polymer 一開始只是一項實驗,目的是看看我們能否在所有瀏覽器推出這些技術之前,為 Web 元件標準提供 polyfill,並向開發人員徵求意見回饋。隨著越來越多開發人員開始使用 Polymer,它已從單純的 polyfill 轉變為實際的程式庫,內含許多提升工作效率的功能 (資料繫結、屬性變更監控器、自動節點搜尋等)。但所有實驗都有結果,那麼我們如何做呢?

雖然許多開發人員表示,他們喜歡在 Polymer 中使用 Web 元件所帶來的表現力和生產力提升,但他們也對效能和整體複雜度表達了疑慮。
這突顯了 Polymer 一直以來的自然緊張關係:一方面是推動網路平台的實驗,另一方面則是開發人員可以信賴的正式發布版本。
近期異動
Polymer 團隊仔細研究了程式庫的每項功能,目標是打造更精簡、可正式發布的版本,讓開發人員能放心使用。
圖層
Polymer 已重構為一系列的層。核心功能快速且精簡,而進階功能則需要使用者選擇啟用。對大多數用途而言,核心功能應可滿足開發人員的需求。

簡化資料繫結
Polymer 的資料繫結系統也經過大幅最佳化,可提供更出色的效能。根據分層方法,雙向繫結現在是選擇加入,預設為單向繫結。此外,已發布的屬性類型已明確化,且屬性變更現在會觸發事件,協助不同程式庫的元素更輕鬆地進行通訊。

更精簡的 Shadow DOM
Shadow DOM polyfill 是令人驚豔的工程技術。這項設計旨在全面且符合規格,這對於徹底測試平台原始元素非常重要,但不幸的是,這會為 Polymer 未使用的功能帶來許多效能瓶頸。
Polymer 的下一個版本將採用不同的方法,使用補丁式樣式層,只為 Polymer 所需的內容進行 polyfill。

現有的 polyfill 會繼續支援一般非 Polymer 網路元件。
遷移至 webcomponents.org
說到 polyfill,這些也將搬新家。目前許多開發人員對 Polymer 和 Web 元件之間的關係感到困惑。有些人認為您必須使用所有 Polymer 才能使用 Web 元件,但事實上,您只需要 polyfill。
為進一步區分這兩者,我們將 polyfill 移至 webcomponents.org,並將其重新命名為 webcomponents.js
。

這項異動旨在協助其他程式庫作者充分利用 polyfill,避免造成任何混淆。Polymer 團隊將持續為 polyfill 做出貢獻,但希望這項異動能讓 polyfill 成為社群的共用資源。
結果
那麼,這些變更的結果如何?
速度
在 Chrome 上,Polymer 的速度現在提升了 5 倍,在 Safari 上則提升了 8 倍。

檔案大小
檔案大小也縮減了 87%,從 123 KB 降至 15 KB (經過 gzip 壓縮後為 6 KB)。

發展藍圖
下一個版本將包含一些 API 中斷變更,並以新版本號碼 (0.8) 表示,但團隊想明確指出,這並非重寫。將目前專案從 Polymer 0.5 遷移至 0.8 應該相當簡單。
Polymer 團隊也規劃了路線圖,讓開發人員更清楚瞭解即將推出的版本。

0.8 預覽版現已在 GitHub 上以分支版本的形式提供 (但仍處於積極開發階段,且缺乏相關說明文件)。0.9 版官方 Beta 版預計於 2015 年第 1 季推出,1.0 版則會在第 2 季某個時間推出。
實驗結束
隨著 Polymer 的最新變更,團隊正在為 Web 元件奠定基礎,讓 Web 元件成為每位開發人員堆疊的必要元素。如果您是 Web 元件新手,現在正是時候來瞭解並熟悉這些創新技術。如果您已經開始使用元件 (和 Polymer),未來的發展前景確實相當樂觀。請持續關注 Polymer 網誌,掌握所有最新動態,並訂閱 Polymer 的電子報,以便提出問題或意見。祝您駭客愉快!