胡言亂語一番前端圈

不知從什麼時候起，前端圈開始癡迷於框架技術選擇的爭論，從原來的新出的js庫都要貶低下jquery，到如今Angular、Vue、React的站隊，都僅僅圍繞這些庫或者框架進行前端技術討論，連你去應聘也都問問你用過哪些框架或庫，你說沒聽過或者沒看過總會有些人帶着蔑視的眼光嘲諷你一把。

確實，基於一些業務來講，你僅僅是知道這些框架或庫的應用就足夠了，何須再動腦子去想其它的問題呢？

說了那麼多，其實我想基於我我的的經驗聊下前端的演進和將來，但願能夠貢獻微薄的力量，消除一些我我的認爲的前端社區不太好的風氣。

以史爲鑑，想要知道前端的將來，必須知道前端的過去，抽象前端發展的規律。

前端的歷史

前端的發展始終伴隨着端的發展。

PC 端的興起

06 年左右國內互聯網公司開始有了前端工程師的概念，緣由很簡單，是由於上網訪問網頁的人數增多，大型互聯網公司爲了提高用戶體驗專門剝離了這樣一個崗位來解決相關問題。這是第一批專業前端工程師的起源。

在這幾年中的發展，進行了不少輪的技術方案、框架、瀏覽器的演進。好比 jQuery 兼容性庫，再到 Require.js 異步加載，再到如今 React、Vue、Angular 等附帶編程思想的前端庫以及先後端分離、前端構建器、樣式預處理器等。這些演進都是隨着 PC 端的用戶量的增多和業務複雜度的提高，爲了用戶體驗和開發者體驗而進化的。

移動端的興起

09 年左右，智能手機的興起致使了移動端開發的熱潮。人人擁有智能手機，這種特殊的端的特性，也產生了新的業務形態。所以無線前端相關需求開始爆發，無線前端開發、iOS/Android 工程師等需求量很是大。

這幾年中的發展，先從最初把 PC 端頁面放在手機上渲染，再到出來響應式設計的概念，再到專門作無線端頁面，再到獨立客戶端和 Weex、React Native 這些跨終端的方案。也是出現了很是多的技術演進，這些演進不難看出也是由於用戶量的增多和業務複雜度的提高，爲了用戶體驗和開發者體驗而進行優化的。

PC 端的衰落

13 年左右，其實 PC 端頹廢之勢早已顯現，但在雙十一下被放大。阿里系前端在這個時間點附近就開始弱化 PC 端前端的投入。 之前 PC 端業務，在無線端流量更大的直接被下掉，核心鏈路的 PC 端業務能用就能夠了，再也不作效果、功能迭代優化。甚至不少業務直接不作 PC 端只作無線端。業務指標也從 PC 的 PV、UV 變成了客戶端的 DAU 等指標。

在這個時間，只作 PC 端的前端，毫無無線端經驗的前端，將會慢慢喪失競爭力。PC 兼容庫 jQuery 之流也漸漸被替換廢棄，由於 PC 的業務不多花費精力作兼容性測試，甚至目前咱們團隊的業務歷來都只測試最新版 Chrome。能夠看到，隨着端和業務形態的變化，不少前端演進的產物會逐步被替換廢掉。

移動端的衰落

移動端目前尚未衰落，但一個端只要興起，就會有衰落的時候。總會有新的、更好的、更高效的端來替代老的端，如今無法想象

前端的將來

回顧前端的歷史，前端老是伴隨的端的變化而變化：

端的出現 -> 業務場景的落地 -> 須要端的開發者 -> 端開發者學習、演進 -> 端的開發效率提高 -> 新的端出現 -> 端的沒落 -> 端開發者轉領域或者被淘汰

這也就是爲何前端須要學習這麼多東西，有這麼龐大的體系的緣由。每個端都有它本身的特性。好比將來可能會火的 VR、AR 端，它們的特性就不一樣於二維平面的移動端，掌握 VR、AR 端的開發就須要新學習不少三維圖形圖像以及圖像識別領域的東西。

所以若是你想要知道前端的將來，你須要預測端的發展。但端的發展是很難預測的，回到 06 年，有誰會想到會有智能手機，並開創了移動端這個端？

而如今火熱的 VR、AR 端，目前看下來並不具有普適性。你須要在特定地點或者佩戴比較大的設備才能夠用，你能夠帶着它給人作手術第一視角給學生作演示，但你上廁所蹲坑更願意掏出手機看新聞而不是帶着 VR 眼鏡看。現有的技術很難將其很天然的融入到咱們的生活中。

沒有普適性和極大用戶量的端，不會有太大的開發需求量，主要是特定領域的端開發者。若是這個端死掉了，端的開發者將一無全部。但下一個幹掉移動端的端究竟是什麼？咱們可能很難預料，只能順應時代的發展快速學習頂上去。但人的精力有限，跟站在巨人肩膀上的每一年出來活力四射的校招生，你又能競爭幾年？

那麼如今前端還能夠作什麼？

除了移動端領域，既然沒法預料到將來的端，那咱們在當下和一段將來能夠作什麼？

其實在上面這些前端的歷史發展中，其實暗藏了一條被忽略的前端的線。咱們再來回顧一下前端技術的迭代規律：

端的技術演進的緣由，本質是由於業務的複雜度提高。好比一個資訊類業務，最初就展現一個信息列表和信息詳情頁面，那麼簡單的 HTML 就能夠完成。以後他們對列表和詳情頁增長了不少元素，好比有的詳情頁面增長了投票功能、有的詳情頁展現問答和評論功能等。業務邏輯的複雜就致使這個諮詢詳情頁須要 先後端分離、平臺化機制、前端組件化、異步加載模塊渲染 等技術演進。然而這只是消費者端的前端，運營者端的前端卻被忽略掉了。某類詳情頁顯示投票、某類詳情頁顯示問答和評論，都是業務規則，是須要運營者在運營後臺進行操做和配置；前端組件化是須要有組件化平臺來管理並推送相關組件等。

暗藏的這條被忽略的前端的線，其實就是中後臺前端。簡單的說，就是整個業務鏈路中偏向於運營端後臺鏈路的前端。

隨着前臺業務的複雜度提高，運營後臺的複雜度成倍提高。簡單的前端交互已經難以知足運營的需求和效率。之前配置運營規則，只須要提交個表單便可，而如今則須要操做一個更復雜的表單，表單上面各類數據接口異步請求、聯動變化。運營平臺的建設和效率，在快速變化的互聯網環境，在某些狀況下是關乎於公司業務發展的，能夠預見的是這將成爲前端需求的爆發點。

相比面向消費者端的前端，中後臺的前端更加穩定，一般只須要面向 PC 端便可，可是須要基於複雜的業務場景進行抽象產出通用技術方案和產品，面臨的挑戰並不會很小。

阿里系前端在作什麼？

阿里的業務體系很龐大，不少業務十分深刻，所以阿里系前端也會提早針對業務發展的預期，作一些技術儲備。包括早期的 Node 先後端分離、前端工程化體系、Weex（weapp 等）在國內都是領跑的，並且有足夠的業務場景進行落地。因此一般能夠做爲前端領域的風向標。

如今這個時間節點，整個阿里集團各個 BU 都有團隊在作中後臺產品。就我所知就有四五套組件體系、五六個可視化搭建體系。目前組件體系領跑的有 @玉伯 下面的開源產品 ant-design 以及內部沒開源的跨 BU 聯合協做的後起之秀 Fusion。

而在淘寶終端技術團隊，咱們的暫未開源的 ICE 中後臺技術產品也是集團範圍內強有力的中後臺產品，通過咱們一年的打拼已經基本站穩淘寶中後臺業務，開始逐步輻射到菜鳥、盒馬、搜索等 BU 的中後臺業務。咱們團隊基於 Fusion 中後臺體系，針對業務封裝了大量技術解決方案，並佈局可視化拖拽系統和前端人工智能領域，處於領先位置。同時咱們有很是大的中後臺業務場景 淘寶商家後臺 和 淘寶達人平臺，這些都是面向百萬級用戶對外的中後臺業務。

這些均可以說明中後臺前端領域多是將來會爆發的一個領域，這個領域會立足業務、助力業務，快速產出（好比拖拽建立後臺頁面、特定領域解決方案）運營平臺頁面或者內部產品以響應複雜的業務邏輯變化。

Angular、Vue、React 框架之爭

上面內容全程沒有提 Angular、Vue、React，由於這些庫或者框架都是基於現有端的業務體系，基於用戶體驗和開發者體驗演進出來技術方案，並無什麼優劣之分，各有各的長處。而在整個前端演進過程當中，只是一塊很小的內容。

Angular 約束多，擅長複雜中後臺場景和多人協做。Vue 靈活，適用於簡單業務快速迭代（固然也有 Vue 作中後臺的）。React 組件化設計的好，能夠實現比較好的組件生態進行復用。對於這些框架，你只須要基於現有的業務體系和開發者經驗，作好最佳的技術方案選型便可。在某些場景下甚至 jQuery 反而是更好的技術選型。

而隨着端的變化，一輪一輪的框架和技術方案會持續迭代，當新的端或者業務領域出現以後，更適合的庫或者框架將會出現。那麼 Angular、Vue、React 很容易的就會像如今咱們對待 jQuery 同樣，被咱們更新換代掉。畢竟一個公司賺錢是由於業務賺錢，而不會由於你用了 Vue 或者 Angular 這些技術框架而賺錢。哪一個庫或者框架適合你的業務形態，能夠給你帶來穩定的系統和好的用戶體驗，讓你有高效的開發效率，固然就選哪一個了。

前端新手很容易會把框架當成前端的所有，好比我前幾年剛學會 jQuery 能夠用 jQuery 寫出任何特效的前端頁面，當時的我認爲 jQuery 就是前端的所有，用熟了就能夠一招走天下。但工做時間長了你纔會發現 jQuery 只是知足了當時的業務需求，技術框架是隨時會變的，不變的是特定業務的解決思想和方案。這個我認爲纔是非框架研發的前端須要探討研究的更有價值的內容，好比針對無線頁面跨頁面跳轉的狀態本地存儲方案、多頁面無刷新的單頁面路由方案等等。