概覽
因為長期在做跟阿裡雲飛天大資料平台相關的前端工作，也一直在思考一個問題：“大資料的前端跟其他業務的前端有什麼不一樣”，具體來說就是，在大資料和人工智能的浪潮下，到底對前端技術的發展帶來了什麼影響。
以團隊在負責在做的阿裡雲飛天大資料平台為例，從在 2009 年寫下第一行代碼，現在已經是阿裡大資料發展的第 11 個年頭。我是 2011 年加入阿裡的，之後就一直在負責做大資料相關的前端工作，基本上參與了阿裡絕大部分大資料發展的曆史程序。現在回頭看，很慶幸自己在一個曆史的變革時期入行，更有幸見證了一些劃時代意義的資料産品的誕生，以及它們對前端技術帶來的變革。
如果我們把 2010 年當做大資料 Web 産品應用的元年，會發現它是一個有趣的年份，為什麼這樣講？
回看前端的發展曆史，在 2005 年前後有一波大的技術變革，就是從 Web1.0 到 Web2.0 的過渡。
在此之前，前端更多地是做純内容的靜态展示，比如下圖中的那個時期的蘋果和雅虎的官網。
之後前端開始逐漸做成複互動的動态網頁，這其中一個重要的曆史性标志就是 Gmail 對 Ajax 等新技術的應用。
而在 2010 年前後，各種大資料應用進入一個爆發期間，阿裡很多知名的應用基本都在那段時間展露頭角，現在回頭再來看那段曆史，這其中很大的一個原因，随着網際網路的大發展，特别是 Web2.0 之後，資料的有了大爆發的增長。
下圖就很好地展現了這個趨勢，如果說之前的 Web 應用更多在“産生”資料階段，那在 2010 年之後如何更好的“展現”資料被提上了新的高度，很多前端技術也因之打開了新的篇章。
後面會結合自己的實踐，以三條主線來講講資料智能浪潮對前端技術發展的影響，分别是資料可視化，軟體泛 Web 化和互動多樣化。
資料可視化
大資料浪潮下，最明顯的一個特征就是資料的指數型增長，從上圖中就能看到這個趨勢，随之而來的挑戰就是如何更形象地展現資料并進行互動展示，也就是我們通常講的“資料可視化”。
回到技術本身，那資料可視化對前端最大的影響應該是大大促進了 SVG，Canvas 和 WebGL 的發展。
而這當中，除了浏覽器底層技術的更新，在上層可視化庫和可視化應用也湧現了大量優秀的作品，其中佼佼者包括：
- 開源技術元件層面
-
- AntV
-
- Echarts
-
- HighLights
-
- ...
- 重資料可視化的産品
-
- 阿裡雲大屏可視化産品 DataV
-
- 阿裡雲的 Quick BI
-
- BI 分析工具 Tebleau
-
- 特色領域的分析産品，比如 Plantir
在專業的細分領域，比如地理，安防，新零售，等領域中不同場景就有很多機會。具體比如在我們阿裡雲的一站式大資料開發治理平台的 DataWorks[1] 産品就有用于做流程編排的 DAG，圖分析[2]，資料的血緣分析等有意思的可視化。
軟體 Web 化
大家最近應該注意到一個現象那就是：Web 系統做得越來越複雜，很多原先桌面端的複互動應用逐漸 “泛 Web 化”，甚至很多應用一上來就是 Web 的技術做第一版。
這裡說的泛 Web，從表現中又可以分為兩種：
一是直接用前端技術去做桌面軟體，其中标志性事件就是 NW.js 和 Electron 在 2013 起步後的蓬勃發展；大家熟悉的 IDE VSCode 就是這當中的典型代表；阿裡的桌面版釘釘 UI 層大量用到的 Web 的技術。
另外一種就是直接在 Web 上實作，比如 大家最近能看到各種 Web'X' 系統（ Google Docs ）。
這背後推動力，一是随着浏覽器相關逐漸走向統一，用它的技術可以更便捷地實作跨端，另一個就是雲計算大資料的興起，特别雲端的存儲和算力逐漸突破了原先的本地 PC 的性能邊界，因而重塑了原先人機互動的入口。
關于跨端的好處自不用多講，我想想重點講講第二點。要講這個邏輯，我又得簡單講講計算機的發展，從占地 170 平方米的世界上第一台通用計算機 “ENIAC”，到蘋果和微軟時代的個人 PC，移動時代的 iPhone 和 Andriod，再到雲計算時代的大型計算叢集。
對開發者工具而言，之前前很多軟體很多都是本地，因為它往往用本地 PC 的計算力就夠了，但大資料的場景下計算本地算力肯定是不夠的，它是依賴雲端的計算叢集（以我們阿裡飛天大資料平台而言，我們已經 10 萬台計算叢集的規模），如何在使用者側用上更友善和靈活地使用這些算力就是我們前端重點要做的，而這是原先軟體的架構要不不能讓你做定制，要不定制的成本很高（有時候甚至超過了重新做一套的成本），是以很多系統會選擇重新起航做一版。
這其中，我們負責阿裡雲的 Dataworks 中的兩大件：WebIDE 和 WebExcel ，就非常典型的例子。
Dataworks 從一開始就是根據雲原生的思路設計開發的，後端需要通過雲計算提供強大的算力替換原先的本地算力，前端需要實作更精巧的架構設計來對應日益複雜的互動能力；具體到我們的應用，它包括但不限于：
- 架構層面
-
- 狀态管理
-
- 插件化
-
- 複互動的元件
-
- Editor
-
- Form/Excel
-
- Tree
-
- Logivew
-
互動多樣化
最近今年在以資料驅動的人工智能的大力發展下，特别在圖像識别，語音識别，自然語言處理方面獲得了很大的突破，讓前端的新互動也獲得了長足的進步。
UX
在面向使用者（UX）産品由 GUI（Graphical User Interface）變成 XUI，使用者不僅可以用通過滑鼠鍵盤方式操作圖形界面，更可以通過面部表情，身體動作，語音互動等形式提供新的互動形态。
下圖就是在 2016 年左右，我們在阿裡雲ET中一些人機對話，互動遊戲中的一些實踐，具體可以看這裡[3]。
這一輪的技術變革，有兩個大的宏觀的背景。
AI 技術的第三波潮起
随着 2010 年前後，深度學習技術的成熟，計算力的提升，以及網際網路時代積累的大資料财富，人工智能技術開始一段與以往大為不同的複興之路；分别在語音識别，圖像識别，自然語言處理等相關技術上獲得根本的突破。
例如， 2012 年到 2015 年，在代表計算機智能圖像識别最前沿發展水準的 ImageNet 競賽（ILSVRC）中，參賽的人工智能算法在識别準确率上突飛猛進。2014 年，在識别圖檔中的人、動物、車輛或其他常見對象時，基于深度學習的計算機程式超過了普通人類的肉眼識别準确率。
下圖就摘自李開複老師的《人工智能》就展現了這個趨勢：
WebRTC
對于前端來講，另一個必備條件就是 WebRTC （Web Real-Time Communication）技術的成熟，它于 2011 年 6 月 1 日開源并在 Google、Mozilla、Opera 支援下被納入網際網路聯盟的 W3C 推薦标準。通過它，前端可以便捷地處理圖像，視訊，語音等内容。大家目前看到很多有意思的互動底層就是依賴他。
DX
在面向前端開發者（DX）：智能化手段可以提升我們的研發效率和體驗，以我們阿裡和螞蟻自身的實作看，Imgcook（D2C：Desgin to Code），代碼智能提示[4]，智能可視化 AVA[5]，前端機器學習 pipcook[6] 都是挺有意思的嘗試。
總結
以上就是我在實踐中關于資料浪潮下前端技術發展的一些思考。當然前端技術技術這幾年能獲得這麼長足進步，除了資料智能，其他大趨勢（比如移動互聯，5G，IoT）也深刻影響了前端技術的走向，但這些就不在本文讨論的範圍内，有機會再跟大家讨論。
一直很喜歡吳軍在《智能時代》一書中提到的一個觀點：“2% 的人将控制未來，成為他們或者被淘汰”。期望各位前端同學都能在這波資料智能化的浪潮中找到自己的定位。
寫在最後
如果大家對這塊感興趣，也希望來阿裡巴巴一起做大資料和人工智能相關的工作，随時歡迎私信或者發履歷給我：[email protected]。大家一起合作，做件有意義的事情，團隊長期招人。
相關連結
[1]
https://www.aliyun.com/product/bigdata/ide[2]
https://zhuanlan.zhihu.com/p/132393588[3]
https://www.zhihu.com/question/56560321/answer/203249193[4]
https://zhuanlan.zhihu.com/p/115377444[5]
https://github.com/antvis/AVA[6]
https://github.com/alibaba/pipcook