大前端2020年前瞻:有哪些你不能錯過的技術趨勢?【轉藏】

原文地址:https://developer.aliyun.com/article/739880?utm_content=g_1000094950

提起大前端,總會有人抱怨“學不動”了,因為新東西實在太多。2019 年的大前端領域雖然并沒有出現什么顛覆性技術,但是 Flutter、WebAssembly、Serverless 的火爆發展還是超乎我們預期,也讓我們進一步看到大前端的融合趨勢。在即將到來的 2020 年,大前端領域又有哪些你不能錯過的技術趨勢呢?正值 GMTC2019 全球大前端技術大會召開之際,我們采訪了大會四位專題出品人:PayPal Senior Software Engineer 于航,騰訊前端技術專家 / 總監、IVWEB 團隊負責人劉恒兵(河伯),騰訊 QQ 小程序前端負責人黃佳琳,阿里巴巴前端技術專家桑世龍(狼叔),請他們對 2020 年進行展望,同時也闡述 2020 年前端從業者可能將要面臨的挑戰。

InfoQ:2019 年即將過去,在今年大前端領域,您印象最深刻(或者認為最重要)的一件事情是什么?
于航: 我印象最深的要屬 WebAssembly 在 2019 年的飛速發展了。從 3 月份 Mozilla提出 WASI (WebAssembly 系統接口,WebAssembly System Interface)的概念到后來成立 ByteCode Alliance 聯盟(字節碼聯盟),再到最近 WebAssembly 進入 W3C 成為正式推薦標準,Wasm 在 “out-of-web” 領域的發展著實迅速。不僅如此,伴隨著谷歌和 Mozilla 強有力的推廣和在 Chrome 以及 Firefox 上對 MVP 標準的快速實現,Wasm 目前已經或者正準備逐漸取代 PNaCl、SIMD.js 甚至 ASM.js 等昔日的流行技術。

劉恒兵(河伯): 2019 年我認為相對重要的是 TypeScript 的大規模普及和流行,至少在我們團隊,TypeScript 已經跟 JavaScript 并行成為我們的重要選擇了。當然選這個的原因還在于 TypeScript 的普及會反向推動 ES6(ECMAScript 6.0)的進步和發展。我們知道在最近 Node.js 13.2.0 版本中,正式支持了 ECMAScript modules,這些新特性的逐漸支持其實也源于社區內先行者們的探索和實踐,正因為這樣的努力才最后推動了 JavaScript 的進一步發展。

黃佳琳: 2019 年印象最深的是小程序的發展,以及各大主流 App 紛紛推出小程序平臺。小程序發展至今,熱度不斷攀升,目前小程序平臺越來越多,這也促使各種跨平臺的小程序框架不斷涌現。已有的框架在性能和兼容性方面也在持續優化(例如 taro 和 uni-app 都會在本次 GMTC 大會上有相關的分享),同時也出現了像 kbone 這樣的新思路。結合小程序云的開發能力,越來越低的開發門檻將持續刺激小程序的發展。

InfoQ:在今年年初您對大前端領域的趨勢預測中,如今看來跟您預測最相符的一個技術趨勢是什么?最超乎您預期的一個技術趨勢是什么?
桑世龍(狼叔): 在我看來,今年大前端增速放緩,并沒有出現很多顛覆性的技術,反而在細分領域廝殺得非常厲害,我想這是好事,意味著前端正在走向成熟。這點從框架、語言,甚至是前后端分工上都有體現。比如 Flutter,跨端能力進一步增強;比如小程序,不斷涌現出各種轉譯實現,例如 Wepy、Taro 等, ReactReconciler 出現之后,出現了 Remax 框架,通過 Remax 把生成的「虛擬 DOM」渲染到視圖層,從而做到了使用真正的 React 去構建小程序;比如 React,能講的新特性并不多,在 Create-React-App 火爆之后,類似的支付寶的 Umi 框架也正在悄然興起,尤其值得一提的是 Umi UI,在可視化輔助編程領域可謂一個新的突破。但無論怎么看,這些都不算是顛覆性的變革,而是在深度上更精進一步。

在 Node.js 領域,今年新東西也不多。最新已經發布到 v13,lts 是 v12,Egg.js 的生態持續完善,進度也不如前兩年,成熟之后的創新就少了。在很多框架上加入 TypeScript 似乎已經大致正確,比如自身是基于 TypeScript 的 Nest 框架,比如阿里也開源了基于 Egg 生態的 Midway 框架。另外,GraphQL 也有很強的應用落地場景,尤其是 Apollo 項目帶來的改變最大,極大地降低了落地成本。已經用 Rust 重寫的 Deno 在穩步發展中,沒有火起來,但也有很高的關注度,它不會替代 Node.js,而會是基于 Node 之上的一種更好的嘗試。

大家可能會感覺 Node.js 熱度不夠,但事實上很多做 Node.js 的人已經投身到研發模式升級上了。對于今天的 Node.js 來說,會用很容易,但用好很難,比如高可用、性能調優,這些還是非常有挑戰的。我們可以假想一下,流量打網關,網關根據流量來實例化容器,加載 FaaS 運行時環境,然后執行對應函數提供服務。在整個過程中,不許關心服務器和運維工作,不用擔心高可用問題,是不是前端可以更加輕松地接入 Node.js?這其實就是當前大廠在前端做的基于 Serverless 的實踐,比如基于 FaaS 如何做服務編排、頁面渲染、網關等。接入 Serverless 不是目的,目的是讓前端能夠借助 Serverless 創造更多業務價值。

于航:最相符的可能就是 WebAssembly 將會在 2020 年底成為 Web 新技術浪潮的主角,不過現在來看這個時間可能要提前了。Wasm 技術自 2015 年被提出后經過四年多的發展,現在逐漸從規范制定轉向到了技術實施的層面。但實際上相較于規范制定所花費的時間,今年以來,技術實施的進度是以肉眼可見的速度在發展。因此伴隨著各類基礎設施的完善和落地,相信 Wasm 被真正應用到各類實際項目中的日子并不會太遙遠。

劉恒兵(河伯):相對符合我的預測的技術趨勢應該是工程提效。提效對于企業研發來說非常重要,因此大前端領域建設中如何更好地提效也是最值得關注的重點之一。無論是 React Native 還是 Flutter,其實都是在提效(大前端跨端研發)的基礎之上兼顧性能。另外,同構、組件、智能研發、Serverless 等等都離不開企業提效。

讓人驚喜的大前端領域的技術趨勢應該就是 Wasm 逐漸看到了商業化的可能,我們目前在播放器場景下通過 Wasm 來解決瀏覽器不支持 H.265 編解碼的問題。可以看到隨著瀏覽器逐漸完善其基礎能力,大前端的空間也越來越大。

黃佳琳:與我預測相符的是 Flutter 的爆炸性發展和 Flutter for Web 的發布。此外,小程序平臺也在嘗試和 Flutter 技術結合,提升小程序的渲染性能。

最超乎我預期的一個技術趨勢是 Docker 在前端領域的快速發展。Docker 在過去一年里改變了我們團隊的構建方式和部署方式,在效率提升上十分明顯。

InfoQ:預測 2020 年的大前端領域,您認為最值得關注的技術趨勢是什么?
于航:伴隨著 WebAssembly Post-MVP 標準的逐漸完善,Wasm 在 Web 領域能夠擦出怎樣的火花?這是我比較關注的事情。Wasm 能否真正享受到與 JavaScript 一樣的瀏覽器控制能力?是否能夠直接操縱 DOM 進而以更低的成本來操作和構建前端 UI 組件 / 頁面?

谷歌和 Mozilla 對 WebAssembly 的大力推廣可見其對該技術的重視程度,但在此之前 Wasm 真正落地的項目其實并不多,因此 2020 年可能會是一個 Wasm 應用百花齊放的年份。不僅如此,在構建 AI 以及區塊鏈應用上,基于 WebAssembly 技術構建的 SSVM 虛擬機可能也將會在 2020 年得到大規模使用,此舉將會把 Wasm 技術的應用場景拓寬到更多領域。

劉恒兵(河伯):我基于 2019 年大前端技術趨勢的發展再進行一下延展,我認為企業效率以及大前端性能可能會是 2020 年最值得關注的大前端趨勢。針對企業提效這點,未來 Serverless、基于 AI 的智能研發、高效的全鏈路監控等都能在大前端中扮演更多的角色和戲份;在性能方面,除了瀏覽器逐漸提升基礎能力之外,跨端研發這樣能讓大前端更為一體的技術,將會逐漸被更多團隊所選擇。

黃佳琳:2020 年的大前端領域,隨著跨平臺框架、Serverless 等技術的不斷成熟,端的邊界會變得越來越模糊,大前端將進一步走向融合。在小程序方面,我認為值得關注的是小程序的工程化趨勢。Web 項目的工程化在 2019 年日趨規范,而小程序項目的工程化目前還不夠完善,我們在這方面則做出了嘗試,提供了官方的 CI 構建方案。隨著小程序項目的復雜化,小程序工程化方面的更新值得大家在 2020 年去重點關注。

InfoQ:您認為對于前端從業者來說,2020 年可能面臨的最大挑戰是什么?
于航:前端技術逐漸開始不再局限于 Web,或者說不再局限于我們所熟知的 JavaScript + CSS + HTML 這三種技術了。隨著前端應用體積的逐漸增大,更多用于提高應用性能、解決大型應用工程化構建問題的解決方案開始逐漸涌現。

不僅如此,近年來,依賴于 Node.js、Chromium 等前端相關的成熟技術或底層基礎設施,Electron/NW.js 也讓我們可以將前端技術應用在本地桌面構建領域,類似的還有 React Native 在移動應用開發領域所占有的一席之地。

除了應用開發領域,基于 Serverless 的 BFF 層也開始將后端的“部分控制權”移交到了前端開發者的手中。而 2020 年,我相信隨著 WebAssembly 技術及其相關基礎組件的逐漸成熟和完善,其在“ on-web ”和“ out-of-web ”這兩個領域內,都會開始不斷涌現出更多的、在各類新技術領域和場景下的嘗試,Web 技術逐漸開始向多領域融合。再借助 WebAssembly 本身的高性能、高可移植性以及可大量復用歷史代碼庫等特性,相信類似 Chrome OS 的“瀏覽器操作系統”又會席卷而來。

為了迎接前端技術的快速發展,前端開發者需要不斷學習、快速橫向擴展所了解的知識領域,這樣才能夠在遇到問題時找到最合適的解決方案,然后再進行對該知識領域縱向而深入地了解。

劉恒兵(河伯):我認為 2020 年最大的挑戰是前端技能模型的擴展(無邊界化)。以前做前端,懂 HTML+JS+CSS 就好了,但現在不同,Serverless 的發展讓前端更多參與到中后臺建設中,如果要做得更專業,就要掌握更多的 Server 知識。在端上也如此,React Native、小程序、Flutter 等跨端技術要求我們更多地去掌握 Native 上的技能知識。所以如何快速適應變化和發展、快速普及知識 / 能力模型變得尤為重要。

黃佳琳:如果說 2020 年大前端融合是趨勢所在,那么對前端從業者來說既是機遇,也是挑戰。機遇在于前端開發的天花板越來越高,想象空間越來越大;挑戰在于對優秀前端開發人員的要求越來越高。前端發展方向趨于多元化,而真正的全能型人才比較稀缺,我們要在關注領域動態、擴大知識面的同時,找準自己專精的方向去鉆研,忌淺嘗輒止。

桑世龍(狼叔):不可否認,這依然是大前端最好的時代。對于前端從業者來說,證明自己的最好辦法不是看你獲得多少資源,而是看你可以創造多少業務價值。雖然在垂直領域的深耕可以讓我們有更多生存空間,但我更愿意認為 Serverless 可以帶來前端研發模式上的顛覆,只有簡化前后端開發的難度,才能更好地放大前端的業務價值。最后,引用我常說的一句話送給大家:”少抱怨,多思考,未來更美好。“

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 228,363評論 6 532
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,497評論 3 416
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 176,305評論 0 374
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,962評論 1 311
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,727評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,193評論 1 324
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,257評論 3 441
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,411評論 0 288
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,945評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,777評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,978評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,519評論 5 359
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,216評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,642評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,878評論 1 286
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,657評論 3 391
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,960評論 2 373

推薦閱讀更多精彩內容