【開源專訪】Sea.js創始人玉伯的前端開發之路

在Web應用程式的用戶體驗越來越被重視的今天，前端開發的地位也上升到了前所未有的高度，而隨之而來的也有更多的挑戰。

為了將前端開發者繁重的工作變得簡單，框架應運而生。國內也不乏一些非常優秀的前端開發框架。本期【開源專訪】我們邀請到了國內前端大牛玉伯（@玉伯也叫射鵰），請他為我們分享一些關於前端框架、前端開發的那些事，以及前端大牛是如何煉成的。

玉伯（王保平），淘寶前端類庫 KISSY、前端模塊化開發框架SeaJS、前端基礎類庫Arale的創始人。

CSDN：先介紹一下自己和目前的工作吧！

玉伯：我叫王保平，阿里花名玉伯。目前在支付寶前端技術部工作，從事前端基礎類庫、工具等產品的研發。喜歡編碼，熱愛思考，努力把每一天過得平淡又精彩。

CSDN：Sea.js是什麼？致力於解決什麼問題？

玉伯：Sea.js是一個很純粹小巧的模塊加載器，它只解決一個問題：前端代碼的模塊化。通過Sea.js，可以將大量JavaScript代碼封裝成一個個小模塊，然後輕鬆實現模塊的加載和依賴管理。

有了Sea.js，我們就可以書寫模塊了。Arale則是一套滿足支付寶需求的通用模塊集合，是一套基於模塊化的前端基礎類庫，目前具備100多個模塊，簡單易用。

CSDN：發起Sea.js項目的初衷是什麼？它的本質意義是什麼？

玉伯：2008年，在前端開發過程中，經常會出現一個單文件幾千行甚至近萬行的情況。這種大文件，對協作開發、後續維護、性能調優等都不利。Sea.js初衷是幫助前端開發工程師將大文件拆分成小文件，能保持小顆粒度的模塊化開發，同時不需要過多考慮依賴關係，讓依賴管理輕鬆自如，讓模塊化開發變得更自然，就像瀏覽器原生提供的一樣。

Sea.js的本質意義是通過模塊化開發，來提高代碼的可維護性。對工程師而言，是關注度分離，更將更多精力聚焦在代碼本身的邏輯上。

CSDN：Sea.js的設計思想是什麼？是如何具體實現的？

玉伯：Sea.js的核心設計思想是保持簡單。有兩層含義：

1. 對外保持使用接口的簡單。Sea.js的常用API只有7個，使用者一旦了解，基本沒什麼記憶成本，可以快速上手。
2. 內部實現代碼儘可能簡單。追求內部實現的簡單有很多好處，比如別人可以比較容易讀懂源碼，這樣就能參與進來協同開發。源碼簡單，往往也意味著不太會有晦澀的bug存在。Sea.js的內部實現，一直在往「簡單得明顯沒有bug」的方向努力。

除了保持簡單，Sea.js的設計理念還有職責清晰、性能優先和適度完備。

職責清晰是讓Sea.js的範疇明確，隨時知道自己應該做什麼，不應該做什麼。一個框架，最怕的是需求膨脹，最怕的是複雜化。

性能優先是因為Sea.js是底層加載器，倘若性能不好，直接會影響頁面性能，因此源碼中有不少地方會刻意追求性能。

適度完備是從功能的層面看Sea.js的API是否能滿足常用需求，同時又能通過插件機制對外提供適度的可擴展性。Sea.js不追求能夠滿足所有需求，而是追求2/8原則。

具體代碼實現純文字不太好描述，感興趣的可以閱讀源碼：https://github.com/seajs/seajs，所有源碼都在上面，歡迎閱讀，歡迎給出建議。

CSDN：Sea.js開發過程中，最大的困難是什麼？是如何解決的？

玉伯：這個說起來比較有意思，在開發過程中，Sea.js最大的困難，不是編碼，而是模塊定義規範的確定。

在業界，目前流行的模塊定義規範，有CommonJS的Modues/1.x規範，還有RequireJS倡導的異步模塊定義規範AMD。這兩個規範，在社區裡存在比較大的討論，各有利弊，適用於不同的運行環境。Sea.js最後採用的是延自CommonJS Modules/2.0規範的通用模塊定義規範CMD。這個至今都有爭議，不同的團隊，不同的場景下，喜好和選擇都有可能不同。

隨著Sea.js的推廣，CMD規範目前在國內已經有相當多人認可。接下來會進一步國際化，希望能得到更大社區範圍內的認可。這條路還很長，不能說已解決了，一切還在解決的路上。

不過，這些都不是關鍵。即便Sea.js以後死掉，只要大家對模塊化開發理念有深度認可了，那一切也就值了。

CSDN：Sea.js和Arale目前分別應用在哪些地方？

玉伯：Sea.js目前已應用在阿里、騰訊、網易、百姓網等很多公司，具體可以查看seajs.org首頁下面的logo牆，目前國內有大量中小網站採用Sea.js。

Arale的使用範圍是支付寶，還有阿里巴巴ICBU部門，在一小部分國內創業型公司中也有使用。

CSDN：您之前還開發過前端類庫KISSY，而Arale也是一個基於Sea.js的前端類庫，兩者有什麼不同？這是在「造輪子」嗎？它們的開發初衷是什麼？目標又是什麼？

玉伯：Kissy和Arale都是前端基礎類庫，從組件提供的功能來講，存在很大重合度。但從理念上來講，這兩個類庫有比較大的不同。

Kissy是大教堂式思路，所有組件，從底層基礎組件，到上層UI組件，都是自主研發。這和業界的YUI3、Sencha等類庫的思路是一樣的。

Arale有所不同。Arale的首要理念是開放。開放不光意味著將自己做好的貢獻給社區，開放更意味著將社區已有的優秀組件直接拿進來用。在開放的理念下，Arale類庫裡，直接引入了jQuery、Backbone、Moment、Handlerbars等業界成熟組件。在這種思路下，Arale能與開源社區緊密互動，彼此快速共進。

Kissy和Arale的初衷都很簡單，Kissy是解決淘寶的前端基礎類庫問題，Arale則是解決支付寶的前端基礎類庫問題。兩者的目標，都是減少前端開發過程中的重複工作量，儘量提高前端開發的工作效率，同時在通用組件層面保障全站的用戶體驗。

CSDN：Sea.js和Arale未來會如何發展？目標是什麼？

玉伯：從2.0開始，Sea.js的發展目標是做簡單、純粹的模塊加載器，甚至希望從2.x的某個版本開始，就不需要更新了，就能滿足絕大部分需求，能非常穩定下來，不需要再升級。

Sea.js穩定後，更多精力會放在Arale等前端基礎類庫的建設上。Sea.js名稱中的Sea，是海納百川、有容乃大的意思。Sea.js希望是一片海，通過CMD規範，可以容納各種各樣的模塊，希望能形成一個模塊的生態圈，能形成生態鏈，能促進良性循環，能讓整個前端開發界都受益。

接下來，玉伯為我們分享了他的開源感悟和前端開發之路，請看第2頁。