建站
咨詢(xún)
售后
建站咨詢(xún)
新聞中心
哪些技術(shù)會(huì)決定前端開(kāi)發(fā)者的未來(lái)發(fā)展？
創(chuàng)新互聯(lián)公司主營(yíng)上猶網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營(yíng)網(wǎng)站建設(shè)方案,重慶APP開(kāi)發(fā),上猶h5微信小程序搭建,上猶網(wǎng)站營(yíng)銷(xiāo)推廣歡迎上猶等地區(qū)企業(yè)咨詢(xún)
2019年下半年即將到來(lái)，上半年狂風(fēng)驟雨般的裁員浪潮讓每一位從業(yè)者背脊發(fā)涼，在經(jīng)歷了五六年黃金發(fā)展期之后，前端開(kāi)發(fā)這個(gè)行業(yè)似乎也進(jìn)入了轉(zhuǎn)折點(diǎn)。
我一邊聽(tīng)開(kāi)發(fā)者在網(wǎng)絡(luò)上抱怨工作難找，前端開(kāi)發(fā)早已經(jīng)飽和了，又在另一邊聽(tīng)大廠(chǎng)的朋友們抱怨，招了很久的人，四處出擊卻填不滿(mǎn)HC，前端人才市場(chǎng)就是這么充滿(mǎn)了矛盾與反常。
其實(shí)仔細(xì)想想，出現(xiàn)上述的情況很容易理解，實(shí)際上前端開(kāi)發(fā)單純從數(shù)量上已經(jīng)飽和了，所以大量的初級(jí)前端工程師找不到活干，但是從另一方面，高級(jí)前端工程師依然是鳳毛麟角，高級(jí)崗的HC永遠(yuǎn)是不飽和的。
前不久民工叔發(fā)的動(dòng)態(tài):
目前前端人員的分布是金字塔形的，而且是底部比較長(zhǎng)的金字塔形狀:
所以進(jìn)階是大部分前端開(kāi)發(fā)必須要面對(duì)的事情，現(xiàn)在已經(jīng)不是能寫(xiě)幾個(gè)頁(yè)面就能找到工作的時(shí)代了，只有往上進(jìn)階才能保持職業(yè)競(jìng)爭(zhēng)力，否則我們誰(shuí)都不能保證下次裁員潮來(lái)臨的時(shí)候，我們會(huì)不會(huì)成為沙灘上裸泳的人。
我對(duì)前端技術(shù)的思考方式
前端社區(qū)是非常活躍的社區(qū)，幾乎每過(guò)一段時(shí)間都會(huì)有新的技術(shù)或者新的開(kāi)發(fā)方式變成了熱點(diǎn)，因此前端開(kāi)發(fā)者才會(huì)有了『學(xué)不動(dòng)了』的梗，以及畢竟丟人的Deno留言事件。
以我自己為例，因?yàn)橄胱约洪_(kāi)發(fā)一個(gè)APP，所以面臨技術(shù)選型，也面臨將來(lái)要投入大量時(shí)間選擇學(xué)習(xí)的技術(shù)，擺在我面前的有三個(gè)選項(xiàng)：
-
Flutter跨平臺(tái)技術(shù)
-
RN跨平臺(tái)技術(shù)（WEEX除了阿里生態(tài)外，很少用的）
-
原生技術(shù)
到底選擇哪一個(gè)技術(shù)既能滿(mǎn)足開(kāi)發(fā)APP的需求，又值得投入時(shí)間進(jìn)行學(xué)習(xí)呢？
如果你去知乎或者其他技術(shù)類(lèi)的社區(qū)去問(wèn)，絕大多數(shù)的回答是Flutter（雖然從回答來(lái)看很多答主似乎都沒(méi)用過(guò)Flutter），F(xiàn)lutter作為正式發(fā)布才剛剛半年的新技術(shù)已經(jīng)席卷了整個(gè)大前端圈子，成為了當(dāng)之無(wú)愧的關(guān)注熱點(diǎn)，真是佩服谷歌的布道能力。
關(guān)于Flutter的事情我思考了很久，也用它快速開(kāi)發(fā)了一個(gè)demo，它有很吸引人的地方：
-
聲明式UI這跟react很像，比Android 那種UI編程方式先進(jìn)太多（筆者很早之前寫(xiě)過(guò)一個(gè)Android APP，那編碼體驗(yàn)不談了）
-
更徹底的跨平臺(tái)，直接調(diào)用Skia繪圖引擎進(jìn)行組件渲染，比RN更加底層，它的理念更像是游戲。
-
更大的潛力，有消息稱(chēng)Flutter是谷歌新操作系統(tǒng)的第一指定框架，這意味著你可能搭上這新系統(tǒng)的風(fēng)口。
這門(mén)技術(shù)確實(shí)很吸引人，加上社區(qū)各個(gè)會(huì)Flutter不會(huì)Flutter的人義務(wù)宣傳下，我甚至快決定好好學(xué)習(xí)一下Flutter了。
但是，大家有沒(méi)有想過(guò)，通過(guò)學(xué)習(xí)Flutter，你的技術(shù)就提升了嗎？
很多人第一反應(yīng)是『當(dāng)然了，學(xué)了一門(mén)新技術(shù)，學(xué)了一門(mén)新語(yǔ)言，難道技術(shù)不是提升了嗎？』。
但是我覺(jué)得并沒(méi)有，我其實(shí)依然在原地打轉(zhuǎn)，一個(gè)Java開(kāi)發(fā)者學(xué)會(huì)了用Ruby增刪改查并不能代表能力提高了，一個(gè)前端開(kāi)發(fā)者用RN或者Flutter開(kāi)發(fā)了簡(jiǎn)單的APP也不能說(shuō)明水平提高了，只不過(guò)是用另一種語(yǔ)言再寫(xiě)了一遍UI而已，會(huì)用三種框架寫(xiě)頁(yè)面，并不是什么高技術(shù)含量的事情，會(huì)三種不如深入一種。
Flutter跟RN一樣，想玩得轉(zhuǎn)必須深入到原生開(kāi)發(fā)中，因?yàn)檫@兩個(gè)技術(shù)都不是真正的跨平臺(tái)，他們僅僅是UI跨平臺(tái)，如果你僅僅學(xué)一個(gè)Flutter寫(xiě)寫(xiě)UI，意義不大，也不存在能力的提升。
我們或者再功利一點(diǎn)地思考，就算你學(xué)會(huì)了用Flutter寫(xiě)UI又怎么樣呢？你們公司內(nèi)部有Flutter項(xiàng)目嗎？即使有輪得到你施展拳腳嗎？畢竟你沒(méi)有原生平臺(tái)的知識(shí)儲(chǔ)備，僅僅寫(xiě)個(gè)UI又有什么呢？
其實(shí)，這個(gè)例子說(shuō)了這么久，我只是在說(shuō)兩件事情：
-
我們有時(shí)候看似在學(xué)很多技術(shù)，其實(shí)這些技術(shù)并不能提升你，但是給你造成了『我學(xué)了新東西能力提升了』的自我感覺(jué)偏差
-
不要盲目追尋社區(qū)的熱點(diǎn)，很可能撿了芝麻丟了西瓜，要仔細(xì)思考這門(mén)技術(shù)對(duì)于你本身是否有提升，而不是被布道師們『洗腦』
我以這種思考模式仔細(xì)研究了近一段時(shí)間熱點(diǎn)的技術(shù)，有幾門(mén)技術(shù)我可以比較確信在未來(lái)會(huì)在前端開(kāi)發(fā)領(lǐng)域大展拳腳。
TypeScript
我從2017年就開(kāi)始使用TypeScript了，可以說(shuō)正當(dāng)時(shí)，在使用過(guò)程中踩了很多坑，也總結(jié)出很多經(jīng)驗(yàn)，知乎上的問(wèn)題『你為什么不使用TypeScript？』中的獲得最高票數(shù)回答就是筆者本人。
在2019年的年中，我可以非常確信TypeScript會(huì)在一年內(nèi)大規(guī)模流行，怎么定義大規(guī)模流行？
超過(guò)30%基于前端框架的新項(xiàng)目會(huì)以TypeScript為主要語(yǔ)言開(kāi)發(fā)。
原因我總結(jié)了三點(diǎn)。
逐漸統(tǒng)治開(kāi)源社區(qū)
大量重量級(jí)前端開(kāi)源項(xiàng)目采用TypeScript開(kāi)發(fā)，包括不限于：Angular、VScode、Vue3.0、Rxjs、TypeScript（對(duì)，它自舉）、Mobx、deno、Antd，而且這個(gè)趨勢(shì)越來(lái)越明顯，包括Facebook自家的Jest也宣布從flowType轉(zhuǎn)向TypeScript。
這些重量級(jí)的開(kāi)源項(xiàng)目有非常強(qiáng)得帶動(dòng)作用，我不止一次見(jiàn)過(guò)有的前端開(kāi)發(fā)者說(shuō)，為了看懂Antd的源碼，特地學(xué)了TypeScript。
可以說(shuō)，TypeScript的開(kāi)源生態(tài)已經(jīng)非常完善了，公司完全可以放心大膽得進(jìn)行TypeScript化開(kāi)發(fā)。
TypeScript是真正解決生產(chǎn)力問(wèn)題的技術(shù)
請(qǐng)問(wèn)前端開(kāi)發(fā)中，引起錯(cuò)誤的最多的三種報(bào)錯(cuò)是什么？
你不會(huì)想到，是：
-
Uncaught TypeError: Cannot Read Property
-
TypeError: ‘undefined’ Is Not an Object (evaluating...)
-
TypeError: Null Is Not an Object (evaluating...)
居然是三種非常非常低級(jí)的錯(cuò)誤，原因就是JavaScript是動(dòng)態(tài)語(yǔ)言，只有運(yùn)行時(shí)才會(huì)報(bào)錯(cuò)，這些低級(jí)錯(cuò)誤在類(lèi)型定義完整的TypeScript中不會(huì)發(fā)生，這就是TypeScript的優(yōu)勢(shì)之一，編碼時(shí)就能規(guī)避大量的類(lèi)型錯(cuò)誤。
TypeScript完整定義接口，可以減少非常多的溝通成本和文檔編寫(xiě)成本，最好的文檔就是類(lèi)型，除此之外，有了TypeScript的支持前后端的協(xié)作也會(huì)非常方便，有了TypeScript我們完全可以開(kāi)發(fā)一個(gè)工具把后端Java Swagger的信息映射到TypeScript中，方便我們?nèi)?shù)并最大程度規(guī)避錯(cuò)誤。
現(xiàn)在已經(jīng)有了這么一款前端取數(shù)庫(kù)pont.
總而言之，TypeScript解決了前端的兩大問(wèn)題，規(guī)避錯(cuò)誤和提升效率。
阿里 MidwayJs Team的負(fù)責(zé)人在GMTC上就說(shuō)到過(guò)『 TypeScript，來(lái)幫助我們解決這些質(zhì)量，習(xí)慣，方法上的問(wèn)題，就拿 midway 團(tuán)隊(duì)來(lái)說(shuō)，自從使用了 TypeScript，質(zhì)量提升的非常明顯，平常需要測(cè)試很久的代碼，幾乎不會(huì)出現(xiàn)低級(jí)的問(wèn)題，反而暴露出的大多都是邏輯問(wèn)題?！徊⑻岬健憾衲?，我們希望新應(yīng)用全量使用 TS?！?/p>
Vue3.0會(huì)是TypeScript大規(guī)模普及的導(dǎo)火索
Vue3.0將在下半年的發(fā)布，雖然尤雨溪確認(rèn)Vue3.0支持JavaScript和TypeScript兩種語(yǔ)言，但是vue2.x那種殘疾級(jí)別的支持到現(xiàn)在原生支持TypeScript，勢(shì)必會(huì)引起大量以vue為技術(shù)棧的公司進(jìn)行TypeScript化運(yùn)動(dòng)。
屆時(shí)三大框架都可以完美支持TypeScript，甚至其中有兩個(gè)是由TypeScript直接開(kāi)發(fā)的，而vue在國(guó)內(nèi)的用戶(hù)量最多，也最能影響TypeScript在國(guó)內(nèi)的走勢(shì)。
而據(jù)我所知美團(tuán)、餓了么等一大批vue技術(shù)棧的前端團(tuán)隊(duì)也已經(jīng)大量實(shí)踐了TypeScript，至少在大廠(chǎng)層面，TypeScript已經(jīng)開(kāi)始大規(guī)模普及了。
圖形技術(shù)
圖形技術(shù)不會(huì)在短時(shí)間內(nèi)席卷前端，也永遠(yuǎn)不可能成為前端的熱門(mén)技術(shù)，但是卻是前端開(kāi)發(fā)者進(jìn)階必學(xué)的技術(shù)。
為什么說(shuō)圖形技術(shù)不會(huì)在前端大火？
要火早就火了，今年年內(nèi)都要發(fā)布webGPU了，絕大部分前端連webgl1.x都搞不清楚，歸根到底是技術(shù)棧不匹配，前端開(kāi)發(fā)和移動(dòng)端開(kāi)發(fā)雖然很大一部分工作是實(shí)現(xiàn)UI，但是這個(gè)實(shí)現(xiàn)方式幾乎都是調(diào)用宿主內(nèi)置組件，極少有用圖形接口畫(huà)UI的情況。
為什么又說(shuō)是進(jìn)階必備？
圖形技術(shù)可能是僅有的與前端有密切聯(lián)系的計(jì)算機(jī)底層技術(shù)了，因?yàn)樗^的UI就是靠圖形接口調(diào)用GPU繪制而成的，這樣就意味著掌握?qǐng)D形技術(shù)就能更深度地定制UI。
未來(lái)的前端UI不僅僅是簡(jiǎn)單的Input、Table、List等粗顆粒的組件構(gòu)成的，而是更加多元化、更加細(xì)粒度，就拿筆者最近研究的可視化大屏項(xiàng)目來(lái)說(shuō)，它幾乎用不到任何傳統(tǒng)的前端組件，一部分2D組件是調(diào)用Canvas繪圖接口，一部分3D組件是靠webgl繪制而成。
今年下半年5G開(kāi)始在國(guó)內(nèi)大面積鋪開(kāi)，普遍的一個(gè)觀(guān)點(diǎn)是認(rèn)為5G的到來(lái)會(huì)讓AR、VR等虛擬技術(shù)重新煥發(fā)生機(jī)，這些技術(shù)也無(wú)一例外不與圖形技術(shù)相關(guān)聯(lián)，畢竟你總不會(huì)認(rèn)為在A(yíng)R中繪制一個(gè)input組件吧。
從去年開(kāi)始關(guān)注圖形技術(shù)，我也驚喜的發(fā)現(xiàn)跟一些前端專(zhuān)家們的觀(guān)點(diǎn)不謀而合。
一個(gè)是年初奇舞團(tuán)的leader月影在知乎的回答：
另一個(gè)也是年初winter的前端技術(shù)預(yù)測(cè)：
編輯器領(lǐng)域技術(shù)
這里的編輯器指的是各種編輯器的總稱(chēng)，例如：代碼編輯器（WebIDE）、圖形編輯器（在線(xiàn)的3d建模或者ps）、文本編輯器等。
編輯器領(lǐng)域技術(shù)不會(huì)像TypeScript一樣蔓延到幾乎所有的前端團(tuán)隊(duì)，但是一定是會(huì)在局部火起來(lái)的技術(shù)。
為什么說(shuō)只會(huì)在局部火起來(lái)？
這是個(gè)非常小眾的領(lǐng)域，但是復(fù)雜度和重要性卻與日俱增，首先絕大部分公司的絕大部分業(yè)務(wù)場(chǎng)景中對(duì)編輯器的需求很小，其次，編輯器的通用性很大，每個(gè)網(wǎng)站的具體業(yè)務(wù)場(chǎng)景的實(shí)現(xiàn)千差萬(wàn)別，但是說(shuō)到用戶(hù)輸入的文本編輯器，那可能用的都是同一款開(kāi)源軟件。
說(shuō)完了局部，我們?cè)谡務(wù)劄槭裁磿?huì)火，最重要的一點(diǎn)就是云端開(kāi)發(fā)的普及，大量的開(kāi)發(fā)者服務(wù)被移植到云上，包括最近比較火的FaaS、小程序服務(wù)等等，云廠(chǎng)商一方面為了給開(kāi)發(fā)者提供更好的服務(wù)，比如開(kāi)發(fā)FaaS的調(diào)試服務(wù)，所以需要定制符合自己業(yè)務(wù)的webIDE，另一方面也更重要，一個(gè)開(kāi)發(fā)者的開(kāi)發(fā)環(huán)境輕易是不會(huì)變的，webIDE就是這個(gè)環(huán)境，webIDE就是云廠(chǎng)商開(kāi)發(fā)者爭(zhēng)奪戰(zhàn)的入口。
另一個(gè)原因就是，大規(guī)模的團(tuán)隊(duì)十分需要將各個(gè)團(tuán)隊(duì)的能力整合在一起，而整合開(kāi)發(fā)的鑰匙就是IDE。
雖然很多公司招編輯器相關(guān)的工程師都是掛著前端的Title，但是普通的前端工程師如果沒(méi)有相關(guān)經(jīng)驗(yàn)，完全拿不下這種場(chǎng)景，這就造成了雖然這是個(gè)小眾領(lǐng)域，但是人才卻很缺失的情況。
下圖為圓心在GMTC上展示的阿里前端委員會(huì)布局的四大方向：
談一談其它熱點(diǎn)技術(shù)
-
Serverless
Serverless肯定會(huì)火，而且也是生產(chǎn)力上的直接提升，前端可以不考慮部署、運(yùn)維、環(huán)境等場(chǎng)景，直接編寫(xiě)函數(shù)來(lái)實(shí)現(xiàn)后端邏輯，可能以后人人都是所謂的全干工程師了。
但是為什么沒(méi)有重點(diǎn)拿來(lái)將，首先serverless的適用場(chǎng)景還比較輕量，他不是銀彈，現(xiàn)在的serverless熱在一定程度上夸大了它的實(shí)際作用。
還有一點(diǎn)，對(duì)于前端而言Serverless其實(shí)是工具，你只能拿來(lái)用，本身的開(kāi)發(fā)需要云原生的專(zhuān)業(yè)開(kāi)發(fā)者，所以前端根本無(wú)法深度參與，他反而把前端對(duì)node的要求降低了（因?yàn)橹灰獣?huì)代碼，不需要后端知識(shí)），但是對(duì)于企業(yè)和團(tuán)隊(duì)是好事，對(duì)于個(gè)人而言并不是非常有助于成長(zhǎng)的一門(mén)技術(shù)。
-
IOT
5G來(lái)臨，萬(wàn)物互聯(lián)的說(shuō)法又隨之而來(lái)，IOT會(huì)不會(huì)在5G時(shí)代火，我并不確定，但是前端在IOT上想大展身手我覺(jué)得這幾年內(nèi)看不到進(jìn)展。
有人會(huì)說(shuō)不是有人把js移植到嵌入式領(lǐng)域了嗎？是的，甚至三星還為IOT設(shè)備定制了js虛擬機(jī)。
IOT是低性能低功耗低內(nèi)存的設(shè)備，越是在這種場(chǎng)景下，低運(yùn)行時(shí)高性能偏底層的編程語(yǔ)言越強(qiáng)大，可惜js與此恰恰相反，這門(mén)語(yǔ)言天生不適合IOT，而C語(yǔ)言卻如魚(yú)得水。
ps：我之前聽(tīng)過(guò)一個(gè)專(zhuān)門(mén)搞IOT的技術(shù)專(zhuān)家說(shuō)過(guò)，js最大的問(wèn)題就是功耗，很多便攜式的IOT設(shè)備上js根本沒(méi)辦法商用（充電五分鐘，待機(jī)5秒鐘）
那為什么還有那么多人在炒js in IOT這個(gè)話(huà)題？
感興趣的可以聽(tīng)Ruff的作者鄭曄的電臺(tái)采訪(fǎng)。
原因就是js開(kāi)發(fā)者多。。。有技術(shù)難度的底層技術(shù)都會(huì)被專(zhuān)業(yè)的嵌入式開(kāi)發(fā)者搞定，js開(kāi)發(fā)者只需要寫(xiě)業(yè)務(wù)即可，所以又回到關(guān)于Flutter的問(wèn)題了，你在IOT寫(xiě)業(yè)務(wù)比瀏覽器寫(xiě)業(yè)務(wù)有啥技術(shù)提升呢？
當(dāng)然了，從職場(chǎng)角度搞IOT還是有前途的，一旦IOT火起來(lái)，先進(jìn)入這個(gè)領(lǐng)域的人可以更輕松地摘桃子，但是我個(gè)人不推薦現(xiàn)在就入坑，風(fēng)險(xiǎn)遠(yuǎn)大于收益，如果真的對(duì)js in any感興趣，不如去研究js runtime，比如node和deno，這是真正有助于提升能力的技術(shù)。
-
GraphQL
GraphQL已經(jīng)被炒了好幾年了，但是依舊動(dòng)靜不大，不是技術(shù)本身又有問(wèn)題，是這門(mén)技術(shù)嚴(yán)重?fù)p害了后端開(kāi)發(fā)利益。
GraphQL對(duì)于前端開(kāi)發(fā)者是真的好用，從此不用求后端大哥搞新接口了，完全可以自給自足，但是這個(gè)讓前端開(kāi)發(fā)爽到天的技術(shù)，付出的代價(jià)就是大量的改造工作需要后端來(lái)做，后端團(tuán)隊(duì)累死累活搞了GraphQL，得利最大的卻是前端，出了錯(cuò)鍋得后端背，這種技術(shù)推動(dòng)的阻力可想而知。
這門(mén)技術(shù)考驗(yàn)的是跨團(tuán)隊(duì)溝通協(xié)作能力，不是技術(shù)本身，當(dāng)然很多時(shí)候前者比后者更重要，但是與本文主題不符，按下不表。
-
AI IN FE
這幾年炒的最火的技術(shù)就是AI，雖然這個(gè)領(lǐng)域跟前端可以說(shuō)沒(méi)有任何交集，但是依然有很多人想往這方面靠。
先說(shuō)tfjs的問(wèn)題，基于瀏覽器的深度學(xué)習(xí)框架，其實(shí)應(yīng)用范圍非常非常窄，筆者在調(diào)研的時(shí)候沒(méi)有發(fā)現(xiàn)什么有商業(yè)價(jià)值的案例，在瀏覽器中跑深度學(xué)習(xí)本來(lái)就很小眾，再加上js本身的性能問(wèn)題和瀏覽器沒(méi)有支持GPU加速的API，導(dǎo)致tfjs更像是個(gè)殘次品，實(shí)際上一些前端團(tuán)隊(duì)雖然在開(kāi)發(fā)AI應(yīng)用，但是基本用的都是正宗TensorFlow。
目前算是比較靠譜的前端+AI的場(chǎng)景就是自動(dòng)化UI，將設(shè)計(jì)師的設(shè)計(jì)稿自動(dòng)生成UI組件，還原UI是非常機(jī)械重復(fù)性的工作，早日干掉還原設(shè)計(jì)稿可以充分解放前端，目前閑魚(yú)的大前端團(tuán)隊(duì)已經(jīng)有相關(guān)的成果了。
前端就算涉及AI，也最多是停留在工具使用階段，也就是所謂的『調(diào)包俠』，當(dāng)然，即使這樣你能幫助團(tuán)隊(duì)解決生產(chǎn)力問(wèn)題，那么已經(jīng)是大功一件了，建議有能力的同學(xué)可以布局一下這方面的技術(shù)，但是對(duì)于絕大多數(shù)人而言，玩轉(zhuǎn)深度學(xué)習(xí)即使是調(diào)參也是很遙遠(yuǎn)的事情。
最后
這是筆者看完圓心的分享之后的一點(diǎn)感受，圓心的格局很高，談到的都是技術(shù)形態(tài)、技術(shù)影響力和技術(shù)生態(tài)，本文格局還很小，只停留在技術(shù)成長(zhǎng)上，只不過(guò)對(duì)于當(dāng)下的筆者這種小格局似乎更實(shí)用。
分享標(biāo)題：未來(lái)這些前端技術(shù)可能會(huì)火
當(dāng)前路徑：http://m.5511xx.com/article/dpijhes.html
