移動開發將被融合，大前端領域即將出現？你信嗎？

在今天，大前端並非一個陌生的詞彙，咱們偶爾會聽人談起它，前些天還看到卓同窗寫了一篇《大前端時代下App開發者的生存之道》，說明這個詞開始成爲某種共識了。

可是大前端到底指的是什麼？事實上大前端並無明確的定義，它由國內業界發明，甚至沒有對應的英文詞彙（若是有，請悄悄告訴孤陋寡聞的筆者）。有人對發明技術詞彙不覺得然，但我認爲國內大前端相關技術發展相較於國外並不差，咱們有必要在理論、標準方面也有所建樹，這樣才能與咱們的發展狀況相匹配。

上個月我在籌備GMTC2017大會的時候，走訪了美團點評的劉平川老師、滴滴的左志鵬老師、手淘的天施老師，對大前端的問題進行了深刻的討論，在這裏，我想用這樣一篇文章來拋磚引玉，探討大前端的定義。但願能看到更多關於它的討論和分享。

1大前端指的是什麼？三個層面上的大前端

若是分析咱們到底在何時使用大前端，大概有三種不一樣的語境，在每種語境下，大前端的定義都有所不一樣。

大前端與NodeJS與先後端分離

在前端同窗的口中，大前端有時與NodeJS一塊兒提，有時與先後端分離一同提起，事實上，大前端概念也正是由前端同窗提出，從這裏，咱們能夠得出大前端的原始定義。

過去幾年，前端技術經歷了爆發式的發展，這種發展最重要的推進者之一就是NodeJS。NodeJS爲前端創建了與系統之間溝通的橋樑，今後前端技術不只能在服務端大放異彩，還能在本地的前端開發工具與工做流上大展身手，前端今後被解放了，JavaScript統治世界的論調一度甚囂塵上。

不過，當人們冷靜以後，發現NodeJS在服務端並無太多的優點，再加上NodeJS技術自己發展的一些波折，致使它在服務端的應用並不理想。不過，前端同窗仍是取得了一些階段性勝利，其結果就是先後端分離。

在之前前端頁面模板由後端生成，致使在頁面須要頻繁修改的時候效率低下，先後端分離指的是後端只提供接口，前端對頁面有完整控制，同時經過中間層將先後端隔開，在這裏對數據進行抽取、聚合、分發等操做。這個中間層，一般也是由前端同窗負責。

從這個意義上，大前端的原始定義能夠稱爲前端技術的擴大化，包括NodeJS，同時對Web頁面有更強的控制權，開發承載更多功能的頁面。

大前端與泛GUI交互

移動互聯網時代到來以後，移動App成爲新的主流，而瀏覽器的地位則逐漸下降，傳統的前端開發遇到尷尬。

固然，前端並未真正遭遇困境，以PhoneGap/Cordova爲表明的Hybrid開發，以及內嵌在App中的WebView開發，再加上微信成爲主流以後的「微信Web」，前端技術其實在移動端也有不少的使用場景。

可是，當時人們提起移動開發，主要指的仍是iOS與Android原生開發技術，這一狀況隨着React Native的發佈獲得了改變。其實直到如今，在國內外大規模使用React Native仍然很少，可是它的確能解決原生的跨平臺代碼複用、動態化等痛點，又避免了以前Hybrid的性能問題，所以受到普遍關注。

隨着React Native的加入，前端的技術棧再次擴展。而且React Native讓咱們發現，其實經過加入一個虛擬視圖層（Virtual DOM），邏輯操做和模型部分的代碼可以獲得很大程度的複用，在已有的實踐總結中，大部分React Native代碼都獲得了80%以上的複用。虛擬視圖層也不只僅只能用在移動端，在全部經過圖形界面進行人機交互的地方均可行，在PC、Web、移動設備甚至還未發明出的將來的種種設備上，只要系統能運行JavaScript引擎，理論上均可以採用相似React Native的開發方案。這種前端技術，固然能夠稱爲大前端。

若是說先後端分離是前端在縱向上變大，那麼這種跨不一樣的終端的前端技術則能夠說是在橫向上變大。

大前端團隊現狀

在實際中，還有一種使用大前端的狀況，那就是國內公司的大前端團隊/部門。據我瞭解的狀況，目前美團點評、餓了麼、網易杭研都有叫大前端的團隊或者在對外時使用該稱謂。

不過，因爲以前大前端並無明確的定義，這些團隊的人員構成並不相同，它們都是各個公司在本身對大前端的理解，以及對公司業務的支持需求下設立的。具體狀況以下（可能有誤差）：

• 美團點評大前端團隊：包括FE、iOS、Android開發，以及一些工程化工做。

• 餓了麼大前端團隊：以FE爲主，包括NodeJS，以及Weex等。

• 網易杭研大前端團隊：去年末在網易杭研執行院長汪源的一次分享中，他稱網易杭研大前端的技術體系，包含Web前端、PC客戶端和移動端。

這些寫在新聞稿、印在名片上的文字，是幫助大前端概念落地的重要助力，同時也是最終肯定大前端的定義究竟是什麼的斷定依據。固然，目前案例太少，還不足以影響咱們對大前端的理解。

2爲何說大前端是發展趨勢

在客戶端開發上，Native與HTML5之爭持續快十年，吵了人們都失去興趣了，從如今來看，並無誰取代誰，而是有融合的趨勢，融合以後的產物就是大前端。

在這裏我大膽預言：大前端不只會成爲移動開發與Web前端的發展趨勢，也將會是將來的顯示設備終端的開發技術趨勢。

爲何這麼說？

終端碎片化

咱們已經進入一個終端碎片化的時代，iPhone第一代發佈到今年就整整10年，在這10年裏，咱們並無發現智能手機有被取代的跡象。可是創新仍在繼續，因而咱們有了智能手錶、TV、眼鏡、頭戴VR等等新設備，能夠想象這樣的設備仍然會繼續增多。

這些新設備同時也是新平臺，與智能手機相似，能夠安裝第三方應用，而且，這些平臺基本都支持瀏覽器或內嵌瀏覽器引擎。雖然有些平臺限制使用Web技術開發應用，但這只是平臺政策緣由，只要放開限制，前端技術就能以某種姿態進入，甚至成爲主流。

有早期Hybrid和後來的React Native的探索，在顯示終端應用的開發上，前端基本已經成爲必備技術。

Serverless

Serverless中文譯爲無服務器架構，是軟件架構領域的一個熱門概念。這裏的無服務並非說不須要服務器，而是說新的架構取代了傳統服務器的概念。Serverless的表明是2014年亞馬遜發佈的AWS lamda，後續各大雲計算廠商也紛紛跟進。

對於終端開發者，並不須要太深刻的瞭解Serverless，所以這裏不過多介紹，只須要知道它被認爲是雲計算髮展的趨勢之一。

Serverless與大前端的關係則在於，Serverless須要更強大的前端，在《Serverless Architectures on AWS》一書中介紹了Serverless的五大原則，當中有這樣一條：

Create thicker, more powerful front ends

所以，從軟件架構的發展趨勢來看，前端會愈來愈「大」，在整個系統中的重要性也會提高。

3大前端的表明技術

說了這麼多，到底哪些是大前端的表明技術？從業務上來講，我認爲終端開發、網關設計、接口設計、桌面端的工程化均可以算是大前端的業務範疇。具體的技術，則是基於HTML五、NodeJS的通用技術，以及各平臺的專有技術。從現階段來講，還須要掌握一些表明性的框架、平臺等。

React系與Vue系：兩大前端生態

前端框架目前有三架馬車，除了Angular以外，React與Vue都已經造成各自的生態體系。

生態的意義就是覆蓋全面，幾乎沒有短板，React和Vue已經覆蓋了目前主流的系統平臺，而且能夠用React Native、Weex等框架進行原生開發，相較於其它技術有很強的優點。

PWA：開放的理想

PWA是Google力推的技術，對於前端開發者來講，它表明着標準化的努力和開放的理想。雖然從目前來看，它還達不到實用階段，但從我近期得到的一些信息代表，這項技術仍是有很大潛力的，也有很多的支持者。今年可能就會有更多的實踐案例涌現出來。

小程序：Super App指向的另外一種將來

微信小程序正式發佈以後，與它未發佈以前的火熱造成了反比，在市場上幾乎沒有聲音了。但這只是產品策略的緣由，並非技術帶來的問題。事實上微信小程序的用戶體驗很不錯，代表了這項技術的應用潛力。

小程序更多的仍是爲咱們帶來了一種可能性，超級App成爲PC時代瀏覽器的精神繼承者，成爲咱們新的操做系統。

4大前端帶來的影響

最後來講說大前端帶來的影響。

新的移動開發技術棧

移動設備做爲主流的終端設備，其應用開發技術也應該是大前端最關注的技術。在之前移動開發的技術棧以原生開發爲主，但之後恐怕作移動開發須要同時掌握前端技術才行。卓同窗的文章也表達了這個意思。

在今年1月份的WeexConf上，天施老師分享的一段話讓我很有感觸，他的大意是移動端通過10年演化，創新變緩，移動開發正走在標準化的道路上，因此Weex會遵循W3C的規範。而我有更深一層的理解：移動開發以前不少組件都須要靠自研，但隨着大廠更多的開源，咱們在基礎組件/框架上的自研需求會愈來愈少，移動開發沒有W3C這樣的規範，但會有基於開源的事實標準。

因此，我認爲純原生的移動開發的道路會愈來愈窄，整個移動開發的技術棧必需要作一個大的改變。

新職業：大前端工程師

隨着大前端的概念逐漸深刻人心，會帶來什麼？我認爲會出現新的職業：大前端工程師。

它與之前的Web前端的區別是，大前端將作更多的終端開發、工程化等工做，而不只僅只是開發Web頁面。大前端工程師將能搞定全部端上的開發。與充滿爭議的全棧工程師相比，它更具可操做性。

而且，大前端工程師將會是一個擁有強大生命力的職業，由於顯示終端設備的生命力會很強，畢竟人類的信息獲取有80%以上是經過視覺，不管Amazon Echo這樣的語音交互設備如何演化，顯示終端都會有一席之地，大前端也於是不會失業。

5結語

本篇內容確定有偏頗的地方，甚至可能有錯誤，但願它能引發你的思考，那麼本文就達到目的了。

做者介紹

徐川，InfoQ中文站移動主編，GMTC大會主編。長期關注移動開發與前端技術發展。

6延伸閱讀

大前端時代下App開發者的生存之道：http://www.jianshu.com/p/1127b4aab135

淘寶先後端分離解決方案：http://2014.jsconf.cn/slides/herman-taobaoweb/index.html

無服務器架構：http://www.infoq.com/cn/articles/no-server-architecture-paer01