2018 年最值得關註的 JavaScript 趨勢
編者按：JavaScript滲透的范圍越來越廣，它能做的事情已經遠不止前端開發而已。不久前stateofjs.com剛剛發佈瞭2017 JavaScript現狀報告，現在Ryan Chartrand非常應景地推出瞭2018年的JavaScript發展趨勢，把這兩份文章一起結合來看，相信作為JS開發者的你一定不再迷茫。
去年，有50000人對JavaScript的上升趨勢感到好奇。。那麼好吧，我的開發者同胞們，現在我們再來看看2018年怎樣。
如果你2017年一整年都與世隔絕或者忙於項目而自顧不暇的話，這篇文章就是給你準備的。
2017年發生的很多事情正在為2018年的許多行動和創新做好準備。
你還可以把本文用作規劃個人成長的指南，來推出更具創新性的項目。
React vs. Vue.js
我們開門見山，直接上好東西吧：認為Vue可能會成為React的一大競爭敵手的人不是很多，但是今年想要無視Vue是不可能的，在開發者的炒作方面甚至令Angular黯然失色。
展望2018年的時候，我們即將迎來2年的激烈競爭，而對Vue的炒作會非常多。
React有著全球最富有公司之一的財政支持，更不用說他們還有極其有才的維護人員。
但是Vue做瞭下面這些讓開發者真心高興的事：
Vue輕量，容易學習，有著令人難以置信的工具，有很棒的狀態管理和路由內置（！）等等。
Vue的社區當然還沒有React那麼大，但從核心團隊是否有很好的使者並且是否傾聽客戶來看，這個社區正在壯大。
談到取悅開發者，不要忘瞭Facebook今年在BSD+Patents的收錢事件中遭遇的史詩般的失敗，這惹惱瞭不少的開發者。
我們現在其實已經發展到你一樣可以通過Vue啟動任何項目來讓自己生活變得簡單的程度，這是他們的核心團隊取得的一項令人印象深刻的成就。
這裡有一篇文章對React、Vue和Angular進行瞭很好的對比。
最終可能會發展成什麼樣子？Facebook會做它最擅長的東西：抄襲創新者然後世界繼續使用React。
如果你是一位拒絕學習React的Angular開發者，隨著Angular的機會日漸消亡，Vue應該迅速成為你職業生涯更好的選項（而且Vue的部分語法跟Angular類似）。
每一位JS開發者都仍然應該考慮學習Vue.js，因為它已經制造瞭足夠大的水花，現在我們開始看到對Vue.js開發者的需求出現，這意味著至少在短期內你能夠為自己創造一些價值。
Next.js
然後就是Next.js，我們稱之為“React的保險”。
盡管Facebook從未在這場遊戲中領先過，並且在創新的勢頭上無法與Vue匹敵，但在工具使用、代碼切割、路由以及狀態管理方面，React加上Next.js能讓你在體驗上跟Vue接近許多，此外還能讓你獲得大規模的React生態體系和支持。
Next對於用React開發的server-side為主的應用也特別有用，二者在應用已經日益成為趨勢。
此外，再加上Now.js（由同一支團隊開發）你就能得到超級快速的部署React應用的方式。
隨著Vue與React之爭的延續，預計會看到越來越多Next與React的雙劍合璧，這會讓React陣營的每個人都感覺舒服一點。
Angular
盡管Angular越來越難以取悅開發者，它仍將是2018年廣受采用的框架之一。
許多公司采用瞭Angular 1.0，隨著2018-19年間他們尋求移植到更好的框架，這些會關註React或者Vue會不會是Angular 2更好的替代。
Angular剩下的擁護者已經表態說Angular會成為企業選擇的JS框架，但這一斷言尚有待證實，而且在2018年未必能得到證實。
這裡有你需要瞭解的2017年有關Angular的一切。
Reason
Facebook生產使用的一切永遠都值得關註。
Facebook現在用Reason來開發web版的Facebook Messenger以及其他項目（Whatsapp、Instagram、Ads等）。
2017年，他們還推出瞭reason-react，將reason跟Reacy綁定在一起，這樣你就可以寫出可編譯成慣用ReactJS的 Reason代碼。
所以你可想象一下，不需要安裝Babel（+許多插件）、Flow等，隻需要OCaml + Reason（現在已經支持React綁定）即可的強大。這是一個有待開發的一大趨勢。
在JS領域Reason今年獲得的註意力要比大部分的編譯成js型語言多很多，所以這絕對是2018年值得繼續關註的趨勢之一。
GraphQL
GraphQL 是API的查詢語言（可以看成是REST的現代版）。
GraphQL沒有辜負2017年的炒作，像Yelp、Spotify、Github、沃爾瑪、《紐約時報》等主流公司都在采用GraphQL，而且現在還有瞭基於GraphQL的API。
其中一些API甚至是專門支持GraphQL的，甚至連REST選項都沒有。簡而言之：創新公司正在押註到GraphQL身上。RESTful API當然還遠沒到滅亡的地步，但再次地，看看初創企業的使用趨勢就知道GraphQL是個熱門選項。
另一方面，像Falcor這樣的替代者幾乎連討論的聲音都沒有瞭。
如果你想在創新公司找份工作的話，現在絕對是開始學習GraphQL的時候。
Redux、Relay Modern以及Apollo
Redux 是一直很火的Dan Abramov/Andrew Clark 項目，後來有迅速成為React狀態管理和數據抓取的首選解決方案。
但GraphQL改變瞭現狀，主要是在數據抓取方面。
我們現在有瞭Relay Modern （Facebook開發）和Apollo，讓你可以比Redux更高效地抓取並傳遞GraphQL數據到React應用的GraphQL客戶端框架。
但就像一位開發者指出那樣，Relay/Apollo/Redux：
這些框架和它們的好處未必需要是互斥的。實際上，這幾個一起使用可以提供很好的關註分離，這是web開發來說可太重要瞭。
這意味著你仍然可以跟Relay一起用Redux，Redux用於本地狀態管理以及一些復雜的非服務器狀態，然後由Relay來抓取。
但是社區對簡化這個的東西（目前為止唯一的答案是Vue.js或者Cashay）比較焦慮。
Storybook
哇哦，2017年Storybook真的是火瞭。
Storybook是一個定義、開發和測試UI組件的環境。
它從年初的幾乎一潭死水變成年中的大規模流行，這要感油煙處理機價格謝社區的巨大努力。這是一個極其激勵人的故事，展現出瞭開源工作應該如何演進，它的故事真的值得一讀。
Storybook太有用瞭（而且用起來也很有趣），你可以單獨地開放和測試UI。它就像一本實時的UI設計指南，能夠為開發者提供真正的價值。
你可能已經碰到過用Storybook來設計的開源項目瞭，但如果想自己看看它是怎麼用的話，那就看看用Storybook設計的Airbnb的日期選擇器。
作為開發者如果你想在2018年脫穎而出，那就在面試的時候用Storybook展示你的最新項目。
額外提示：建議你也看看 react-bluekit，這是Storybook的替代，Netflix的工程團隊用來設計他們的組件庫。
Prett油煙分離機ier
就像它的名字一樣，Prettier是一個代碼格式化程序，可以讓你的代碼可讀性更強，並且很好看。
foo(reallyLongArg(), omgSoManyParameters(), IShouldRefactorThis(), isThereSeriouslyAnotherOne());
變成：
foo(
reallyLongArg(),
omgSoManyParameters(),
IShouldRefactorThis(),
isThereSeriouslyAnotherOne()
);
這個東西在GitHub上面得到瞭18000顆星，開發者都很喜歡這個簡單又有價值的項目。
它還被用到瞭許多其他你熱愛的項目上，比如Webpack、React、Next.js、Babel等。
再次地，你可以成為一名Go開發者，這樣就不用安裝這個也能享受它的功能瞭。
Jest和Enzyme
說到JavaScript測試，Jest無疑是領先的那個，而Enzyme則是很好的補充，尤其是在開發React應用的時候。
就像你在這裡看到一樣，在下載方面Jest現在統治著Jasmine。
Jest的Snapshots功能在2017年真的起來瞭，使得處理測試的痛苦少量很多。你可以看看React Conf 2017的這次演講來瞭解它的一切。
由Airbnb工程團隊開發的Enzyme是一個測試React組件的JavaScript庫。自從2016年以來它已經在GitHub上面拿到瞭12000顆星。
Jest和Snapshots + Enzyme超級簡單的React組件測試API形成瞭一個很強的測試組合，會在2018年不斷流行起來。
Webpack
Webpack已經崛起為最流行的資產打包工具。Webpack還經歷瞭不可思議的一年。
去年的這個時候，Webpack還幾乎連文檔都沒有，大部分的開發者都不知道該怎麼開始用它。
然後，到瞭今年年頭的時候，我寫瞭篇文章，說Webpack在3個月內就拿到瞭15000美元來支撐這個項目是如何的不可思議。而他們現在已經拿到瞭幾十萬美元的融資瞭。
Webpack不僅為開源項目如何走向繁榮鋪好未來，而且這個項目一整年都維持瞭很旺盛的發展勢頭。
謝天謝地，Sean Larkin還在領導著Webpack，所以Webpack能夠取得下一個成就還沒有結束的跡象。
因為這該項目得到的支持如此之好（以及他們對社區的關心程度如此之高），所以2018年最好預測的趨勢就是它瞭。
Parcel
但每一個大規模的趨勢發展的同時，也會有不滿開發者隊伍的日益壯大。
Parcel，一個有競爭力的打包工具，也相當迅速地獲得瞭發展勢頭，目前它已經在GitHub上面攢到瞭12000顆星，開始直接威脅到Webpack的江湖地位。
Parcel的賣點是別的打包工具都變得太龐大瞭，而Parcel的打包速度是Webpack的2倍（使用緩存的時候快10倍）。
它還針對Webpack多少有點令人困惑的配置設置，而Parcel卻不需要配置。
隻用把你應用的入口點指給它，它就會把事情做對瞭。
盡管簡化配置和改善速度都是很好的改進，如果2018年上半年Webpack沒有抄這些改進的話我不會感到奇怪。
類似於Vue與React之爭，這個小傢夥總是創新得更快，但要取決於大傢夥會不會受到哪些創新的靈感啟發而改進自己的項目。
Gatsby
Gatsby是Kyle Mathews開發的用於React的靜態網站生成器。
自從Kyle去年全職開發Gatsby以來，這個東西開始真正獲得發展勢頭。
React網站本身就是用Gatsby開發的，再也有沒有比這更有力的證明瞭。
Gatsby的全部關切都在於性能和給React提供盡可能快的web體驗。
他們網站的這張圖可以讓你瞭解到它大概是怎麼工作的：
Gatsby還利用先進的web技術替其他網頁預抓取資源，使得瀏覽起來快如閃電。
盡管Gatsby無論如何也不會統治這個行業，但卻是開發快速靜態網站非常出色的解決方案，會不斷流行下去。
要想更多瞭解Gatsby，可參考這篇文章。
Babel
到現在Babel已經沒有介紹的必要瞭，大體上它仍將成為趨勢延續下去。
總而言之，2017年對於Babel來說是個好年，它的精力主要都集中在Babel 7的開發上面（希望能在2018年初發佈）。最重要的是，他們寫瞭一首歌:)
Babel目前唯一的擔心是Reason日益成為主流。
但目前為止，Babel還會在2018年延續強勁走勢。
Flow Ty靜電機pescript
Typescript 和 Flow 都是JavaScript開發者很好的靜態類型選項，可以用來改進其代碼質量。
我們未必會在2018年看到誰摧毀誰的情形，所以它們還會一起共存，各自服務於不同的用例。
Facebook開發的Flow是React開發者的優先選擇，因為它很容易跟Babel集成，在React項目中也使用得很普遍。
微軟開發的TypeScript在Angular 2+開發者當中很流行，因為它是主要語言。
2018年這兩個的發展可能會停滯，現在真正的問題是Reason今後會不會取代瞭這兩個。
Immutable.js
有一位reddit網友是這樣描述的，我很喜歡這種說法：
immutableJS確保瞭大型團隊的開發者不會做一些愚蠢的事情。
簡而言之：Immutable.js，Facebook的另一個項目，確保瞭狀態不會因為使用不可變對象而發生突變。
正如我們的redditor網友指出那樣，這對於大型團隊的開發者會極其有用，因為這些人經常會無意識地搞亂瞭狀態。
封裝在Immutable.JS對象裡面的數據是永遠也不會變的。它總會返回一份新的拷貝。這跟JavaScript形成瞭羨慕對比，後者的一些操作不會改變你的數據（比方說一些數據方法，包括map、filter、concat、forEach等），但有的就會（Array的pop、push、splice等）。
使用Immutable.JS有相當大的限制，但視你的需求不同，那些限制未必有關系。你可以通過這篇文章瞭解更多。
在GitHub上拿到瞭20000多顆星的Immutable.js已經在2017年崛起，預計還會延續到2018年，因為開發者正在花時間理解其中的概念和權衡。
Popmotion
Popmotion是一個在GitHub上迅速贏得星星的JavaScript動畫庫。
可以把它想象為Flash預見瞭jQuery。
現在，我意識到在一句話裡面用這兩個詞對推銷這個日益流行的庫並沒有幫助。
但你對這個庫的研究越深，你就越會發現有一群人對jQuery和Falsh都有極深的抱怨，迫切需要讓情況變好一點。
而Popmotion真的體驗要好很多，在web動畫方面有瞭很多的創新。這無疑是2018年值得關註的趨勢之一。
你可以到這個網站一探究竟。
React Native Electron
React Native讓你可以針對移動設備開發React應用，而Electronlets則可以讓你針對桌面開發JavaScript應用。
這兩個框架在2017年均站穩瞭腳跟，也都是從JavaScript到原生應用很好的解決方案。
一些用Electron開發的知名app包括：Slack、Atom、Github Desktop以及Discord。
用React Native開發的流行應用包括：Facebook、Instagram、Airbnb以及UberEATS。
你現在還可以開發Windows版的React Native應用。
無論如何現在都是JavaScript開發者的好時光，考慮現在你開發桌面和移動app已經比過去容易多瞭。
額外提示：Web Assembly
有瞭這4個瀏覽器的支持後，Web Assembly幾乎大功告成瞭。不過2018年稱之為趨勢還為時尚早，再過12個月再說吧。
但一定要密切關註它，因為現在每個人都盯住這個呢。
2018學習材料
看完瞭前面介紹的所有這些趨勢後，下面我們給打擊推薦一些2018年的學習資料，不斷學習與時俱進你才能保持作為遠程開發者的競爭力並且發揮你的潛能：
勇敢去學Vue.js吧
每一位React開發者都應該學習Next.js
開始學習Reason（以及Reason React）然後做個業餘項目試試吧。
GraphQL必須列入你的2018待辦事宜清單。
跟著Relay Modern學，這是React+GraphQL應用的數據抓取選項之一。
Storybook！Storybook！Storybook！
在一個項目上安裝Prettier，讓你的代碼可讀性更強。
在一個React項目上學習使用Jest截屏及Enzyme。
學習Flow（React開發者）或者TypeScript（其他人）。
考慮用Gatsby把Markdown文本轉換成靜態頁面。
用React Native開發一個移動app。
用Electron開發一個桌面app。
玩一下Popmotion創作一個流暢的動畫。
把這個資源清單導入為Todoist項目。
原文鏈接：https://hackernoon.com/the-top-javascript-trends-to-watch-in-2018-a8437dd94425
編譯組出品。編輯：郝鵬程。512F59CA568BB2D0
留言列表
