原文：https://x-team.com/blog/top-javascript-trends-2018/
去年有4萬人對JavaScript的上升趨勢感到好奇。那么，我的同事們呢，現在我們來看看2018年。
如果你在2017年一直生活在一塊石頭或埋在項目中，這是你想要看的文章。
2017年發(fā)生了很多事情，正在為2018年的許多行動和創(chuàng)新而努力。
您也可以將此作為指導，計劃2018年開發(fā)人員的發(fā)展，幫助您獲得更多創(chuàng)新的項目。
React 與Vue.js
讓我們直接看看好消息：沒有多少人相信Vue會成為React的一大競爭對手，但今年不可能忽視Vue，甚至會把Angular從開發(fā)者炒作的角度帶入陰影。
當我們展望2018年的時候，我們即將展開一場激烈的為期兩年的戰(zhàn)爭，充滿了對Vue的大肆炒作。
React仍然擁有世界上最富有的公司之一的財務支持，更不用說一些非常有才華的維護者。
但是Vue正在做所有讓開發(fā)者真正開心的事情：
?Vue是輕量級的，易于學習，具有令人難以置信的工具，具有良好的狀態(tài)管理和路由內置（?。┑?/p>
Vue的社區(qū)肯定沒有React那么大，但是社區(qū)的增長是基于核心團隊是否擁有偉大的使者，并傾聽其社區(qū)（兩者都在）。
當談到開發(fā)人員時，讓我們不要忘記Facebook今年史詩般的失敗，BSD +專利許可協議與開發(fā)人員很好的結合在一起。
實際上，我們已經達到了開始使用Vue來簡化生活的每個項目，這是他們核心團隊取得的令人印象深刻的成就。
可能的最終情況？Facebook做的最好：復制創(chuàng)新者，世界繼續(xù)使用React。
如果你是一個拒絕學習React的Angular開發(fā)者，那么Vue.js應該很快成為你的職業(yè)道路的一個更好的選擇，因為Angular的機會會減少（而Vue也有類似于Angular 1的語法）。
每個JS開發(fā)者都應該考慮學習Vue.js，因為它已經足夠讓我們開始看Vue.js開發(fā)者的請求，這意味著你可以在短期內為自己創(chuàng)造一些價值至少。
Next.js
然后是Next.js，我們將其稱為“React的保險”。
視頻：https://youtu.be/evaMpdSiZKk?
即使Facebook從未在競爭中領先，與Vue相同的動力進行創(chuàng)新，但React與Next.js的結合讓您更加接近Vue在工具，代碼分割，路由和狀態(tài)管理方面的體驗 ，還可以保留大量的React生態(tài)系統(tǒng)和支持。
接下來對React中構建的服務器端渲染的應用程序也是非常有用的，這是一個增長的趨勢。
另外，新加入的Now.js（由同一個團隊創(chuàng)建），你有一個超快的方式來部署你的React應用程序。
隨著Vue vs. React戰(zhàn)斗的繼續(xù)，期待越來越多的采用Next與React同步，讓React陣營的每個人都感覺更舒適。
Angular
盡管Angular在開發(fā)人員方面遇到了越來越大的困難，但它仍將繼續(xù)成為2018年被廣泛使用的框架。
很多公司都采用了Angular 1.0，并且隨著他們在2018-19年期間希望更好地遷移，他們將把React或Vue.js視為比Angular 2更好的替代方案。
Angular的其余擁護者已經采取了Angular將成為企業(yè)首選的JS框架的立場，但這一說法尚未得到證實，并且不太可能在2018年得到證實。
Reason
總是值得關注Facebook在生產環(huán)境中使用的任何東西。
Facebook現在使用Reason?(他們采取已經成熟的OCaml），Facebook Messenger的網絡版，以及其他項目（WhatsApp，Instagram，廣告等）。
在2017年，他們還發(fā)布了為React創(chuàng)建綁定的react-reason，因此您實際上可以編寫可編譯為慣用的ReactJS的原因代碼。
所以想象不需要安裝Babel（+多插件），Flow等，只需要OCaml + Reason（現在支持React綁定）的威力。這是一個等待爆炸的大趨勢。
在JS領域，今年比其他大多數編譯語言（對不起Elm，我們仍然愛你），今年更受關注，所以這絕對是在2018年繼續(xù)觀看和玩的一個。
GraphQL
GraphQL是API的查詢語言（想想：REST的現代化）。
視頻：https://youtu.be/ntBU5UXGbM8
GraphQL在2017年的炒作活下來了，因為Yelp，Spotify，Github，Walmart，NYTimes等大公司現在都擁有基于GraphQL的API。
其中一些API甚至完全是GraphQL，甚至沒有REST選項。簡而言之：創(chuàng)新型公司正在把注意力放在GraphQL上。
RESTful API肯定遠沒有死，但是再次看看初創(chuàng)公司正在移動的趨勢，GraphQL是一個受歡迎的選擇。
另一方面，像Falcor這樣的替代品幾乎不再討論。
如果你想在創(chuàng)新公司找到工作，這絕對是開始學習GraphQL的時候了。
Redux，Relay Modern 和Apollo
Redux是著名的Dan Abramov項目，不僅他的職業(yè)生涯迅速躥升，而且迅速成為了React中狀態(tài)管理和數據獲取的最佳解決方案。
視頻：https://youtu.be/-jwQ3sGoiXg
但GraphQL真的讓Redux震驚，主要涉及到數據抓取。
我們現在有了Relay Modern（由Facebook創(chuàng)建）和?Apollo?，GraphQL客戶端框架，可以讓您更加有效地將GraphQL數據提取并傳遞到您的React應用程序。
但正如一位開發(fā)人員指出的，關于 Relay / Apollo /Redux：
這些框架及其好處不一定是相互排斥的。事實上，在網頁開發(fā)中一起使用它們，可以提供一個很好的非常重要的關注點分離。
這意味著您仍然可以使用Redux與Relay一起使用，使用Redux作為本地狀態(tài)和一些復雜的非服務器狀態(tài)，然后使用Relay作為獲取。
但社區(qū)渴望某些東西來簡化這個（到目前為止唯一的答案是Vue.js或Cashay）。
Storybook
Storybook是定義、開發(fā)和測試UI組件的環(huán)境。
由于社區(qū)的巨大努力，它從今年年初幾乎死去，到2017年年中大量流行。這是一個值得一讀的關于開源的工作應該如何發(fā)展的鼓舞人心的故事。
這非常有用（甚至有趣），讓您可以獨立構建和測試UI組件。這就像一個真正為開發(fā)者提供實際價值的活的UI風格指南。
您可能已經使用Storybook來查看一個開源項目，但為了親眼看到它，請查看Airbnb的日期選擇器的故事書。
如果你想在2018年以開發(fā)商的身份脫穎而出，那么就去看看你上個項目的故事書。
Bonus：還可以查看一下故事書的react-bluekit，Netflix的工程團隊正在使用它的組件庫。
Prettier
顧名思義，Prettier是一個代碼格式化程序，使您的代碼更可讀，更好，更好。
foo（reallyLongArg（），omgSoManyParameters（），IShouldRefactorThis（），isThereSeriouslyAnotherOne（））;
會變成這樣:
foo（?
? ? reallyLongArg（）,?
? ? omgSoManyParameters（），?
? ? IShouldRefactorThis（），?
? ? isThereSeriouslyAnotherOne（）
）;
Github上有超過18,000顆星，開發(fā)人員都喜歡這個簡單而有價值的項目。
它也用于你可能已經喜歡的其他項目，比如Webpack，React，Next.js，Babel等等。
再次，你可以成為一個Go開發(fā)者，甚至不需要安裝它。
Jest and Enzyme
當談到JavaScript測試時，Jest肯定是領先的，在專門構建React應用程序時，Enzyme是一個很好的補充。
正如你在這里看到的，Jest現在在下載中遠超Jasmine。
Jest的快照功能在2017年真正起飛，使處理測試的痛苦遠沒有那么痛苦。從React Conf 2017觀看此演講，了解所有相關信息。
視頻：https://youtu.be/HAuXJVI_bUs
由Airbnb的工程團隊創(chuàng)建的Enzyme (酶，譯注)是用于測試React組件的JavaScript庫。自2016年以來，它在Github上急速獲得了12,000顆星。
Jest's Snapshots + Enzyme超級簡單的API用于測試React組件，這是一個很好的測試組合，將在2018年繼續(xù)上升。
WebPack
Webpack已經上升成為最受歡迎的資源捆綁器。WebPack也有一個令人難以置信的一年。
去年的這個時候，Webpack幾乎沒有文檔，大多數開發(fā)人員不知道如何開始使用它。
然后，在今年年初之前，我寫下了Webpack在3個月內籌集了15,000美元（以及作為其最早的贊助商之一有多高興）來支持這個項目是多么令人難以置信。他們現在有數十萬美元的資金。
Webpack不僅可以為開源項目的發(fā)展鋪平道路，而且整個項目的發(fā)展始終保持著巨大的發(fā)展勢頭。
Sean Larkin仍然領導著Webpack的發(fā)展，接下來看看Webpack是否有能力實現目標。
由于這個項目得到了很好的支持（以及他們對社區(qū)的關心程度），所以這是2018年最容易預測的趨勢。
Parcel
但是，隨著每一個大規(guī)模的趨勢，心懷不滿的開發(fā)者力量越來越大。
Parcel這個打包器的競爭者，正在迅速獲得發(fā)展勢頭，2017年獲得了12,000個Github星，直接排在Webpack的喉嚨之后。
Parcel公司的說法是，所有其他的打包器都過于臃腫，而Parcel的打包速度是Webpack的兩倍（使用緩存時快10倍）。
這也跟Webpack的配置有些混亂，就像Parcel一樣，沒有配置需要。
“只要把它指向你的應用程序的入口點，它就會幫你做其他的。”
雖然簡化配置和提高速度都是很大的改進，但是如果Webpack不在2018年上半年復制這些改進，我不會感到驚訝。
與Vue vs. React類似，這個小家伙總是會創(chuàng)新得更快，但是這個大家伙得到這個創(chuàng)新的啟發(fā)，并且改進他們的項目。
這也是#webpack團隊最喜歡的Parcel其中之一。
但是我們也從第一天開始就有一個非常干凈的架構。所有選項的可擴展性都會帶來成本。:)https://t.co/3BlZoe4Ub1
- 肖恩·托馬斯·拉金（@TheLarkInn）2017年12月22日
Gatsby
Gatsby是由Kyle Mathews 創(chuàng)建的React靜態(tài)網站生成器。
自從凱爾去年全職參與Gatsby以來，真正開始加速。
沒有比React網站本身使用Gatsby這個事實更好的證據了。
Gatsby的全部功能都是關于性能，并在React中提供盡可能快的Web體驗。
從他們的網站這個圖表給你一個如何工作的想法：
Gatsby也使用階段性（progressive）網絡技術，為其他網頁預取資源，所以瀏覽是閃電般的。
雖然Gatsby不會以任何方式主宰這個行業(yè)，但對于構??建將繼續(xù)流行的快速靜態(tài)網站來說，這是一個絕佳的解決方案。
欲了解更多關于Gatsby，閱讀這篇文章。
我們也很高興今年贊助Gatsby的發(fā)展。
Babel
Babel現在不需要介紹，而且基本上是默認的趨勢。
總而言之，對Babel 來說，2018依舊是一個美好的一年，主要集中在建造Babel 7（希望在2018年初啟動）。最重要的是，他們寫了一首歌:)
目前Babel唯一關心的問題（除了其非凡的維護人員從項目中無限期/模糊的突破），就像Reason成為主流。
但是到目前為止，Babel應該在2018年繼續(xù)保持強勁。
我們也很高興今年贊助Babel。
Flow & Typescript
Typescript和Flow都是JavaScript開發(fā)人員用來改善代碼質量的很好的靜態(tài)類型選項。
我們可能不會在2018年看到其他人倒閉，因為他們兩人一起生存下來，服務于不同的業(yè)務場景。
由Facebook構建的Flow是React開發(fā)人員的首選，因為它可以輕松地與Babel集成，也是React項目中常用的。
由Microsoft構建的TypeScript在Angular 2+開發(fā)人員中很受歡迎，作為主要的語言。
從這兩個方面來看，2018年的進步可能會比較遲鈍，接下來的幾年真正的問題將會變成是否像“Reason”這樣的東西取而代之。
Immutable.js
視頻：https://youtu.be/ewMKXHu1E1Q
我喜歡一個redditor描述Immutable.js的方式：
immutable.JS 確保大型團隊的開發(fā)人員不會做一些愚蠢的事情。
簡單地說：另一個Facebook項目Immutable.js確保state不會被使用immutable（不可更改）的對象所改變。
正如我們的redditor朋友指出的那樣，這對于一個可能無意中搞砸狀態(tài)的大型開發(fā)團隊來說是非常有用的。
數據封裝在一個immutable.JS對象從不變異?？偸欠祷匦赂北?。這與一些操作不會改變數據的JavaScript（例如一些數組方法，包括map，filter，concat，forEach等）有所不同，但也有一些（Array的彈出，推送，分片等）。
使用Immutable.JS有一些相當大的限制。但是對于你的需求，可能跟局限無關。你可以在這里閱讀更多。
現在Github擁有2萬顆星，Immutable.js在2017年已經普及，預計2018年將會繼續(xù)上漲，因為開發(fā)人員開始花時間理解其概念和權衡利弊。
Popmotion
Popmotion是一個快速在Github上獲得星星的JavaScript運動庫。
想想像Flash遇到jQuery。
現在，我意識到使用這兩個詞在同一句話中，并不能幫助推銷這個日益流行的庫。
但是，越深入了解這個項目，就越是發(fā)現一群對jQuery和Flash有嚴重困擾的人，只是需要把事情做得更好。
Popmotion真的是一個更好的體驗，圍繞網絡動畫的許多創(chuàng)新剛剛開始沸騰。這是一個值得注意的2018年。
看看他們的網站開始進行嘗試。
React Native & Electron
React?Native允許您為移動設備構建React應用程序，而Electron允許您為桌面構建JavaScript應用程序。
兩者在2017年都成為了完善的框架，都是從JavaScript到本地應用的絕佳解決方案。
在Electron上構建的一些值得注意的應用程序包括：Slack，Atom，Github Desktop和Discord。
使用React?Native構建的流行應用程序包括：Facebook，Instagram，Airbnb和UberEATS。
由于它們都服務于不同的目的，所以它們相對較少，但是如果React Native開始支持桌面，事情會變得很有趣。
有一個用于創(chuàng)建React Native桌面應用程序的實驗性開源項目。
無論如何，現在是成為一名JavaScript開發(fā)人員的好時機，考慮到您可以比過去更輕松地構建桌面和移動應用程序。
Bonus：Web組裝
現在所有4個瀏覽器都支持Web Assembly，我們快做到了?，F在稱之為2018年的趨勢還為時尚早，所以我們會在12個月內更新。
但是請保持這一點，因為大家現在正在密切關注這一點。
2018年學習資料
看完所有的趨勢之后，我們建議您考慮在2018年學習如何保持作為一個遠程開發(fā)人員的競爭力，釋放您的潛力：
- 大膽，學習Vue.js
- 每個React開發(fā)者都應該學習Next.js
- 開始學習Reason（和ReasonReact）并在一個小項目上試用。
-?GraphQL是您2018年待辦事項清單的必備工具。
- 接下來學習了Relay?Modern，React + GraphQL應用程序中用于數據獲取的Go-to選項。
- Storybook! Storybook!?Storybook!
- 安裝Prettier的項目，使你的代碼更具可讀性。
- 在React項目中學習并使用Jest快照與Enzyme一起使用。
-?學習Flow（React開發(fā)者）或TypeScript（其他人）。
- 考慮Gatsby從Markdown - >靜態(tài)頁面構建一些東西。
- 使用React Native構建移動應用程序。
- 使用Electron構建桌面應用程序。
- 用Popmotion來創(chuàng)建一個流暢的動畫。
最后，你可以將這個資源列表導入Todoist項目：
