從2020看2021前端發展趨勢

野林 發表於 2021-01-01

image

前言

圖片

又到了年底,想簡單談談這一年前端的發展,以及21年可能會出現的一些趨勢。毋庸置疑,2020年確實是不平凡的一年,對前端來說,私以為可以用“大前端持續深耕,泛前端相容幷包”這十四個字來形容。這裡需要明確一下我對“大前端”以及“泛前端”這兩個概念的理解:首先大前端可以分為廣義的“大前端”和狹義的“大前端”,市面上常說的大前端主要分為這兩類,所謂廣義的“大前端”是指以前端技術解決所有本屬於其他領域問題的前端技術,這裡其實是包含了後邊所說的泛前端的概念,也就是說只要是使用前端技術去解決的都可以定義為“大前端”;而狹義的“大前端”是僅指垂直到後端領域的前端技術,其代表是以node.js為主的擴充套件的去解決後端領域的技術,如出現了諸如express、koa、egg、nest等等配套的後端技術框架,甚至出現了node的微服務框架,我這裡不做說明僅指狹義的“大前端”概念。對於“泛前端”,這個概念沒有歧義,通常指的都是跨端技術,比如客戶端、桌面端,甚至HUB等等,上圖中所示的僅僅指一部分框架,並未收錄完全,畢竟js/ts的社群實在太太太太活躍了,下面簡單分說一下“大前端”和“泛前端”個人的一些見解,是以前端三大框架Vue、React、Angular為核心進行橫向和縱向的框架探討

泛前端技術框架探討

VueReactAngular
web端Vue全家桶React全家桶Angular全家桶
桌面端Electron/NwElectron/NwElectron/Nw/Cordova/Ionic
原生移動端WeexReact NativeCordova/Ionic
小程式端uniapp/mpvue/mapxtaro/Rax

大前端技術框架探討

VueReactAngular
web端Vue全家桶React全家桶Angular全家桶
SSRNuxtNextUniversal
服務端無特定無特定可配合Nest

今年阿里前端練習生計劃將前端領域劃分了七大方向,分別是工程化方向、前端中後臺方向、Node.js方向、跨端技術方向、互動技術方向、視覺化技術方向、前端智慧化方向,個人認為Node.js是一個整體的前端基礎,並不能單算做一個方向,因而我將其替換為音視訊方向,私以為可將前端方向劃分為以下幾種,下面我將在這幾個不同的方向維度進行個人的一些闡述和拙見:

  • 中後臺方向:微前端
  • 視覺化方向:antv
  • 智慧化方向:imgcook
  • 互動方向:Eva
  • 音視訊方向:wasm
  • 工程化方向:severless、全鏈路工程
  • 跨端方向:kbone、rax

中後臺方向

  1. 對於中後臺方向,這是傳統web方向,對於前端來說,2020年對於微前端的落地應用已有很多實踐。因此,私以為微前端會作為未來前端大型應用的一種趨勢,對於不同團隊的不同技術棧的彙總整合是一個比較好的方案,雖然不同於服務端的那種微服務可以微的很徹底,但是前端加持著ts等的特性也是可以實現微化的效果,從而優化工時,提升效率,避免重複勞作;
  2. 既然第一點提到了ts,那這裡我想說一說關於ts的問題,在19年我對ts的態度尚存觀望,但在今年,我認為ts可以作為一種必備技能來考察和實踐,並不是因為大家都在用,而是因為隨著時間的發展,現在前端要承載的能力越來越重,專案也越來越大,ts可以很好的約定,對於後期的維護以及修改都可以很好的限制,對於大型團隊、大型專案來說,ts是不二之選;另外,如果有團隊真的要去開發服務端,那我真的建議你去用ts,如果你用過nest.js,你會發現和寫java真的沒什麼區別,而且服務端的很多理念也可以通過ts的各種特性來使用,比如泛型、抽象類等。當然,如果是小團隊,而且需要快速開發,對於小而美的應用,個人認為還是js適合,畢竟js是一門靈活的語言,哈哈哈

視覺化方向

  1. 視覺化這裡,今年其實沒有做多少實踐,但是個人認為,這七個大方向而言,最容易出成果,或者說最能出大佬的,可能還真是視覺化領域,如果能在視覺化領域做到了前5%,那麼我相信各大廠肯定會花錢養著你,畢竟我擁有你不一定重要,但是對手不擁有你對我很重要,你的技術壁壘就呈現了出來,也就在這個內卷的江湖獲得了一些領先和優勢,最起碼裁員的優先順序也不會那麼靠前,哈哈哈
  2. 第一點說的有點兒遠,說說實在的,個人覺得可以將阿里的antv作為視覺化領域的一個標杆,針對各種特定領域進行展開,比如gis等,當然,其實視覺化領域研究的深的話還是挺冷門的,這其實也會有一些機會,webGL/webAR/webVR等等都可以作為切入點,配合著下面的音視訊領域,這兩個的相互結合,確實還是能做出些東西的

智慧化方向

  1. 智慧化領域,個人認為其實核心不在於前端,而在於人工智慧,而人工智慧領域就不僅僅前端那麼些東西了,對於封裝好的如TensorFlow.js,我們是直接拿來用的,但是對於領面的模型建立其實才是關鍵,如果有同學想在智慧化領域有所發展,個人建議還是要深鑽一下,最好可以深造一下,畢竟這個東西是真的需要學術研究+產業實踐的
  2. 在產業實踐的前端領域,阿里還是比較領先的,比如imgcook,其核心目的是將圖片轉成前端程式碼,利用的機器視覺去識別圖片中的不同的位置資訊等,將其轉成前端的程式碼,也就是所謂的D2C,即:Design to Code,今年的D2大會上又提出了P2C,即:Product to Code,但並不是真的將人類語言直接轉換成code,而是對D2C的一個業務擴充套件,對於D2C某些業務程式碼利用一些特定的schema進行約定,讓機器學習過程中多一些引數約束,從而提升程式碼實現度。雖然轉化的程式碼還很冗餘,但是對於一些初級的專案或頁面,確實可以交給機器去實現,個人認為人工智慧對低端重複的工作確實會進行替代,也算是對前端內卷做了一定的貢獻,攤手...

互動方向

  1. 互動方向,目前大頭還是在遊戲方向,但是我還是認為頁遊或前端實現遊戲主要還是做一些開胃菜的功能,並不能真正的將使用者帶進沉浸式的體驗,對於小遊戲引擎,今年阿里好像出了一個eva的引擎,感興趣的同學可以看看
  2. 對於新體驗方面,AR/VR/MR等可能在明年5g深化的時候會有一些落地實踐,但可能還是不溫不火,互動方向配合設計的新理念可能會是一個新的突破點

音視訊方向

  1. 這裡想說一說WebAssembly,雖然都說wasm是會替代掉js,但目前看應該還不太現實,wasm目前主要還是配合音視訊領域多一些,另外就是一些額外的優化措施,配合rust進行優化等,如果有志於音視訊領域有所建樹的同學,wasm確實可以儲備起來
  2. webrtc是音視訊領域一個繞不開的技術,另外就是播放器的實現,video.js、flv.js等,對於一些視訊播放的協議也要了解,如rtmp/rtsp等,今年疫情的關係,帶動著直播領域的火熱,前端音視訊方向說不定會是一個風口

工程化方向

  1. 工程化方向就不得不提serverless,這是今年前端最火熱的一個話題了,私以為serverless不僅僅是前端領域的變化,它可能改變目前的開發模式,以後沒有前後端之分(ps:目前確實是有合的趨勢),只有雲工程師和端工程師之分,那麼對於目前的前端來說,我們就不能僅僅只關注前端領域的一些內容了,docker、k8s等屬於傳統後端或運維的部分,我們也需要掌握,對於一些後端的思維及名詞也需要熟悉,如限流、削峰、服務降級等。當然serverless的前提其實是雲原生,如果沒有云化,那實現serverless的效果應該不如目前這樣,當然個人認為這是一個必然的趨勢,從今年的雲棲大會以及運營商5g雲化來看,雲網融合、雲邊協同應該會是主流
  2. 前端工程化另外一個方向就是全鏈路的工程化,從腳手架、low code、外掛市場等全鏈路的提供,簡化前端開發門檻,這裡可以參考淘系的飛冰,對low code以及ide的外掛提供都有涉及,以及ui元件庫的提供等等,形成一個全鏈路的前端生態。這裡可以說說low code和no code,no code是一個無需任何編碼的現成的工具,就是完全沒有程式設計的入口;low code是一個需要部分編碼的工具,為了是給一些非專業人士但又有程式設計需要的人員使用,強調開發出來給別人用,常見的比如給運營人員用的h5編輯器,如易企秀、maka、ih5等

跨端方向

  1. 跨端方向是一個老生常談的問題,主流還是要write once,run anywhere,常見的無非就是利用各種框架將各個DSL進行來回轉換,但其實這是一個偽命題,本質是不可能達到大一統的局面的,抽象就很難具象,這兩者需要有一個平衡,需要對具體常見具體分析
  2. 私以為小程式領域是端方向下一個各家大佬追逐的市場,因為app領域的跑馬圈地都已基本形成,現在再去開發出一個現象級的app幾乎很難很難了,但是將app作為作業系統,以小程式去帶動使用者,形成使用者閉環,還是有很大市場的,類小程式應用,如pwa、快應用等都是這種承載方式的不同展現,對跨端來說,這個不失為一種發展選擇。對於小程式的框架也出現了kbone、rax等,可能也會有一個類似w3c這樣的一個小程式標準,但是像微信這種巨無霸應用,是否真的會遵守就是另一回事了,總之,其實也不失為一個選擇

總結

回望2020,展望2021,總結如下:

  1. 大前端持續深耕,泛前端相容幷包
  2. 中後臺微服務化,視覺化行業細化
  3. 智慧側演算法深化,互娛側形態變化
  4. 音視訊結構優化,工程側全面轉化
  5. 跨端側具體改化,前端更加內卷化

好了,2021到了,願大家在這個內卷的時代,都有自己的一技之長,形成自己的核心競爭力,升職加薪,再創輝煌,共勉!!!