Meta開源自家網頁UI樣式系統StyleX，具備CSS高效性能

IT之家 12 月 12 日消息，Meta 日前開源了自家產品所使用的網頁 UI 樣式系統 StyleX，這是一款基于編譯器的 CSS-in-JS 庫，號稱整合了靜態 CSS 的高效與可擴展性，并能夠復用組件庫和靜態類型代碼庫。

據悉，StyleX 并不全面支持 CSS 的所有功能，主要圍繞大型網站而構建，目前這一樣式系統已經在 Meta 旗下 Facebook、WhatsApp、Instagram 等產品中使用。

▲ 圖源 Meta 官方新聞稿

IT之家獲悉，StyleX 能夠自動管理 CSS 選擇器，避免過程復雜化，確保生成的 CSS 不會出現沖突，此外，StyleX 避免了使用 JavaScript 插入樣式的開銷，僅在必要時高效地組合類名字符串，從而保證生成的 CSS 樣式能夠快速被瀏覽器解析。

此外，StyleX 生成的樣式也經過了優化，官方提到，相對于傳統 CSS 庫，StyleX 顯得“更小、更具體”，通過“原子構建”和“文件級緩存”，StyleX 在編譯時能夠同時處理數萬個組件，并具備“強大的擴展能力”，從而提升開發效率。

Meta 提到，目前官方在 GitHub 上開源的 StyleX，是公司內部所使用的 StyleX 正式版本，未來官方將在 GitHub 發布 StyleX 后續更新，Meta 還將定期同步 GitHub 上發布的新版本，帶回內部使用，感興趣的小伙伴可以點此訪問項目地址。