從2020看2021前端發(fā)展趨勢
來源：SegmentFault 思否
作者：野林
前言
又到了年底，想簡單談談這一年前端的發(fā)展，以及21年可能會出現(xiàn)的一些趨勢。毋庸置疑，2020年確實是不平凡的一年，對前端來說，私以為可以用“大前端持續(xù)深耕，泛前端兼容并包”這十四個字來形容。
這里需要明確一下我對“大前端”以及“泛前端”這兩個概念的理解：首先大前端可以分為廣義的“大前端”和狹義的“大前端”，市面上常說的大前端主要分為這兩類，所謂廣義的“大前端”是指以前端技術(shù)解決所有本屬于其他領域問題的前端技術(shù)，這里其實是包含了后邊所說的泛前端的概念，也就是說只要是使用前端技術(shù)去解決的都可以定義為“大前端”；而狹義的“大前端”是僅指垂直到后端領域的前端技術(shù)，其代表是以node.js為主的擴展的去解決后端領域的技術(shù)，如出現(xiàn)了諸如express、koa、egg、nest等等配套的后端技術(shù)框架，甚至出現(xiàn)了node的微服務框架，我這里不做說明僅指狹義的“大前端”概念。
對于“泛前端”，這個概念沒有歧義，通常指的都是跨端技術(shù)，比如客戶端、桌面端，甚至HUB等等，上圖中所示的僅僅指一部分框架，并未收錄完全，畢竟js/ts的社區(qū)實在太太太太活躍了，下面簡單分說一下“大前端”和“泛前端”個人的一些見解，是以前端三大框架Vue、React、Angular為核心進行橫向和縱向的框架探討。
泛前端技術(shù)框架探討
大前端技術(shù)框架探討
今年阿里前端練習生計劃將前端領域劃分了七大方向，分別是工程化方向、前端中后臺方向、Node.js方向、跨端技術(shù)方向、互動技術(shù)方向、可視化技術(shù)方向、前端智能化方向，個人認為Node.js是一個整體的前端基礎，并不能單算做一個方向，因而我將其替換為音視頻方向，私以為可將前端方向劃分為以下幾種，下面我將在這幾個不同的方向維度進行個人的一些闡述和拙見：
中后臺方向：微前端 可視化方向：antv 智能化方向：imgcook 互動方向：Eva 音視頻方向：wasm 工程化方向：severless、全鏈路工程 跨端方向：kbone、rax
中后臺方向
對于中后臺方向，這是傳統(tǒng)web方向，對于前端來說，2020年對于微前端的落地應用已有很多實踐。因此，私以為微前端會作為未來前端大型應用的一種趨勢，對于不同團隊的不同技術(shù)棧的匯總整合是一個比較好的方案，雖然不同于服務端的那種微服務可以微的很徹底，但是前端加持著ts等的特性也是可以實現(xiàn)微化的效果，從而優(yōu)化工時，提升效率，避免重復勞作； 既然第一點提到了ts，那這里我想說一說關(guān)于ts的問題，在19年我對ts的態(tài)度尚存觀望，但在今年，我認為ts可以作為一種必備技能來考察和實踐，并不是因為大家都在用，而是因為隨著時間的發(fā)展，現(xiàn)在前端要承載的能力越來越重，項目也越來越大，ts可以很好的約定，對于后期的維護以及修改都可以很好的限制，對于大型團隊、大型項目來說，ts是不二之選；另外，如果有團隊真的要去開發(fā)服務端，那我真的建議你去用ts，如果你用過nest.js，你會發(fā)現(xiàn)和寫java真的沒什么區(qū)別，而且服務端的很多理念也可以通過ts的各種特性來使用，比如泛型、抽象類等。當然，如果是小團隊，而且需要快速開發(fā)，對于小而美的應用，個人認為還是js適合，畢竟js是一門靈活的語言，哈哈哈~
可視化方向
可視化這里，今年其實沒有做多少實踐，但是個人認為，這七個大方向而言，最容易出成果，或者說最能出大佬的，可能還真是可視化領域，如果能在可視化領域做到了前5%，那么我相信各大廠肯定會花錢養(yǎng)著你，畢竟我擁有你不一定重要，但是對手不擁有你對我很重要，你的技術(shù)壁壘就呈現(xiàn)了出來，也就在這個內(nèi)卷的江湖獲得了一些領先和優(yōu)勢，最起碼裁員的優(yōu)先級也不會那么靠前，哈哈哈~ 第一點說的有點兒遠，說說實在的，個人覺得可以將阿里的antv作為可視化領域的一個標桿，針對各種特定領域進行展開，比如gis等，當然，其實可視化領域研究的深的話還是挺冷門的，這其實也會有一些機會，webGL/webAR/webVR等等都可以作為切入點，配合著下面的音視頻領域，這兩個的相互結(jié)合，確實還是能做出些東西的。
智能化方向
智能化領域，個人認為其實核心不在于前端，而在于人工智能，而人工智能領域就不僅僅前端那么些東西了，對于封裝好的如TensorFlow.js，我們是直接拿來用的，但是對于領面的模型建立其實才是關(guān)鍵，如果有同學想在智能化領域有所發(fā)展，個人建議還是要深鉆一下，最好可以深造一下，畢竟這個東西是真的需要學術(shù)研究+產(chǎn)業(yè)實踐的。 在產(chǎn)業(yè)實踐的前端領域，阿里還是比較領先的，比如imgcook，其核心目的是將圖片轉(zhuǎn)成前端代碼，利用的機器視覺去識別圖片中的不同的位置信息等，將其轉(zhuǎn)成前端的代碼，也就是所謂的D2C，即：Design to Code，今年的D2大會上又提出了P2C，即：Product to Code，但并不是真的將人類語言直接轉(zhuǎn)換成code，而是對D2C的一個業(yè)務擴展，對于D2C某些業(yè)務代碼利用一些特定的schema進行約定，讓機器學習過程中多一些參數(shù)約束，從而提升代碼實現(xiàn)度。雖然轉(zhuǎn)化的代碼還很冗余，但是對于一些初級的項目或頁面，確實可以交給機器去實現(xiàn)，個人認為人工智能對低端重復的工作確實會進行替代，也算是對前端內(nèi)卷做了一定的貢獻，攤手...
互動方向
互動方向，目前大頭還是在游戲方向，但是我還是認為頁游或前端實現(xiàn)游戲主要還是做一些開胃菜的功能，并不能真正的將用戶帶進沉浸式的體驗，對于小游戲引擎，今年阿里好像出了一個eva的引擎，感興趣的同學可以看看。 對于新體驗方面，AR/VR/MR等可能在明年5g深化的時候會有一些落地實踐，但可能還是不溫不火，互動方向配合設計的新理念可能會是一個新的突破點。
音視頻方向
這里想說一說WebAssembly，雖然都說wasm是會替代掉js，但目前看應該還不太現(xiàn)實，wasm目前主要還是配合音視頻領域多一些，另外就是一些額外的優(yōu)化措施，配合rust進行優(yōu)化等，如果有志于音視頻領域有所建樹的同學，wasm確實可以儲備起來。 webrtc是音視頻領域一個繞不開的技術(shù)，另外就是播放器的實現(xiàn)，video.js、flv.js等，對于一些視頻播放的協(xié)議也要了解，如rtmp/rtsp等，今年疫情的關(guān)系，帶動著直播領域的火熱，前端音視頻方向說不定會是一個風口。
工程化方向
工程化方向就不得不提serverless，這是今年前端最火熱的一個話題了，私以為serverless不僅僅是前端領域的變化，它可能改變目前的開發(fā)模式，以后沒有前后端之分（ps：目前確實是有合的趨勢），只有云工程師和端工程師之分，那么對于目前的前端來說，我們就不能僅僅只關(guān)注前端領域的一些內(nèi)容了，docker、k8s等屬于傳統(tǒng)后端或運維的部分，我們也需要掌握，對于一些后端的思維及名詞也需要熟悉，如限流、削峰、服務降級等。當然serverless的前提其實是云原生，如果沒有云化，那實現(xiàn)serverless的效果應該不如目前這樣，當然個人認為這是一個必然的趨勢，從今年的云棲大會以及運營商5g云化來看，云網(wǎng)融合、云邊協(xié)同應該會是主流。 前端工程化另外一個方向就是全鏈路的工程化，從腳手架、low code、插件市場等全鏈路的提供，簡化前端開發(fā)門檻，這里可以參考淘系的飛冰，對low code以及ide的插件提供都有涉及，以及ui組件庫的提供等等，形成一個全鏈路的前端生態(tài)。這里可以說說low code和no code，no code是一個無需任何編碼的現(xiàn)成的工具，就是完全沒有編程的入口；low code是一個需要部分編碼的工具，為了是給一些非專業(yè)人士但又有編程需要的人員使用，強調(diào)開發(fā)出來給別人用，常見的比如給運營人員用的h5編輯器，如易企秀、maka、ih5等。
跨端方向
跨端方向是一個老生常談的問題，主流還是要write once，run anywhere，常見的無非就是利用各種框架將各個DSL進行來回轉(zhuǎn)換，但其實這是一個偽命題，本質(zhì)是不可能達到大一統(tǒng)的局面的，抽象就很難具象，這兩者需要有一個平衡，需要對具體常見具體分析。 私以為小程序領域是端方向下一個各家大佬追逐的市場，因為app領域的跑馬圈地都已基本形成，現(xiàn)在再去開發(fā)出一個現(xiàn)象級的app幾乎很難很難了，但是將app作為操作系統(tǒng)，以小程序去帶動用戶，形成用戶閉環(huán)，還是有很大市場的，類小程序應用，如pwa、快應用等都是這種承載方式的不同展現(xiàn)，對跨端來說，這個不失為一種發(fā)展選擇。對于小程序的框架也出現(xiàn)了kbone、rax等，可能也會有一個類似w3c這樣的一個小程序標準，但是像微信這種巨無霸應用，是否真的會遵守就是另一回事了，總之，其實也不失為一個選擇。
總結(jié)
回望2020，展望2021，總結(jié)如下：
大前端持續(xù)深耕，泛前端兼容并包 中后臺微服務化，可視化行業(yè)細化 智能側(cè)算法深化，互娛側(cè)形態(tài)變化 音視頻結(jié)構(gòu)優(yōu)化，工程側(cè)全面轉(zhuǎn)化 跨端側(cè)具體改化，前端更加內(nèi)卷化
好了，2021到了，愿大家在這個內(nèi)卷的時代，都有自己的一技之長，形成自己的核心競爭力，升職加薪，再創(chuàng)輝煌，共勉！！！
