對於開發者而言，2017出奇的高效，不過2018年有望為IT領域帶來更多發展。本文中，為了處理項目時緊跟潮流，我們會描述出每個前端編程人都需要關注的2018年JavaScript的五種主要發展趨勢。
1. Vue.js
就在兩年前，很難想象Vue.js能夠忍受迅猛發展的React系統的競爭。經過深思熟慮且久經時間考驗的Angular是一回事，但是Vue ......我們沒想到這個開發環境成為前端技術工具列表中的佼佼者。 對於那些不熟悉Vue的讀者，讓我們簡要介紹一下它的制勝之道。
為何Vue.js居於榜首？首先，很容易學習並且擁有靈活的創建前端代碼的環境，這使得代碼編寫的出錯率較低。Vue的開發者Evan You曾在Angular工作過。 他確定後者對於UI的構建而言不必要且繁瑣，他大膽地創建了一個入口門檻很低的前端創建解決方案，因此Vue出現。 它旨在幫助那些編程經驗很少的設計人員將所有工作都用於創建功能界面。 此外，Vue.js支持聲明式呈現，異步DOM更新，雙向數據綁定，以及嚴格遵守Web組件規範和HTML模板的簡單集成。
到目前為止，Vue.js的特性被一個小型的社區支持（相比於React和Angular這種當前特別流行的庫來說，這是通過React和Angular的消息來源得到的）。一般來說，如果Angular甚至是React——Javascript最流行的庫之一——對你來說過於複雜，而且看起來相當嚴格和不靈活，那你絕對應該在2018年就結識Vue。
2.Angular
儘管我們在2018年看到的頂級Javascript庫的競爭趨勢直接在Angular和Vue.js之間展開，但前者在來年的實用性不會減少。如果你之前還沒有使用Angular工作（至少是使用Angular 2），那麼你一定要熟悉它的優點。讓我們開始吧。
首先，這個框架需要Javascript與HTML和CSS。第二，它是團隊協作的理想選擇，因為它創建的應用程序可以明確劃分為組件 - 業務邏輯和前端。這是可能的，因為開發環境是基於MVVM（模型－視圖－視圖－模型）模式下的。第三，Angular是創建可擴展應用程序的理想選擇，支持與第三方庫的簡單集成。這個框架經常用於構建動態的移動應用，因為它使用了雙向數據綁定，這種方法增加了帶有豐富動畫元素的應用程序的響應能力。
現在，讓我們來討論一下Angular的缺點。第一件事情，也是開發人員經常提到的，就是在移動設備上的高耗電量（不過與其他框架相比，通過正確的代碼優化，可以減少這個問題）和高入門門檻（如果你是從頭開始使用Angular開始工作，那麼你要準備好去花費1.5到2個月的時間去學習它的大量文檔）。那些喜歡“簡潔”Javascript編碼的開發者在剛接觸Angular時
如果我們總結一下上述不同的框架所克服的各種問題，我們可以說Angular是一個久經考驗的框架，通過適當的模塊化處理，使得它可以構建出可擴展的解決方案（這足以從相關的demo中證明）。因此，我們自信的推斷，儘管每年都有越來越多的JS框架進入IT市場，Angular依然是近幾年來最好的Javascript框架之一。
3. GraphQL
GraphQL是一種有著奇怪語法的API查詢語言，由Facebook開發者們開發。它的目的是超越傳統的REST APIs的功能，同時簡化多個源傳輸的數據集合。
讓我們舉個具體的列子。想象一下，你需要在正在構建的社交網絡框架中顯示帖子列表，以及用戶的喜好（點贊、收藏等）。在實現方面，這個例子很簡單，你只需從下一個數據庫端點發出請求。但是，由於這些數據可能來自不同的來源（例如，如果帖子存儲在 MongoDB或Redis中），生成的應用將比舒適的工作慢得多。此外，如果您考慮到，隨著時間的推移，數據的大小會增加，因此需要更多的存儲空間，你會意識到，REST API遲早會耗盡其效率。這就是GraphQL的用武之地，使用GraphQL而不是使用單獨的端點來訪問每個資源。你可以使用單個端點，該端點能夠同時處理涉及多個數據源的複雜查詢。與REST模型相比，GraphQL是一個智能的個人助理，使用你指定的源地址，提供所需的內容。
GraphQL的實力也得到了證明：2017年，它被Github，Spotify，Walmart等知名公司所採用。
4.Gatsby
如果你的預算比較緊張，但是同時又希望在你的項目中只使用高級技術，那麼你一定要嘗試 Gatsby。Gatsby 是 Kyle Matthews 為靜態網站的創建而構建的新型解決方案。
它如何優於同行？與 Jekyll，Hugo 或 Hexo 等流行解決方案不同，這個靜態生成器不使用模板，而是信賴於 Webpack 和 React 組件（注意 React 官網本身也是在 Gatsby 的幫助下編寫的）。因此，你可以獲得自動更新和即時頁面轉換等優勢。從1.0版本開始，Gatsby 使用了上面提到的 GraphQL。因此，在構建過程，它可以從多個 GraphQL API 中獲得數據，然後使用它們創建一個完全靜態的 React 客戶端應用程序。現在，讓我們從枯燥的特徵列表轉移到真正的問題，看看 Gatsby 是否適合你。
Web 開發者使用現成的引擎並不總是那麼容易。即使是最受歡迎的那些，比如 Joomla 或 Wordpress，也會以需要及時更新或安全性不足的形式給它們的用戶帶來麻煩（經驗豐富的黑客在攻擊你的網站上未更新的關鍵插件時會遇到些麻煩，這是為了在以後的欺詐活動中使用它）。主題也是許多內容管理系統的弱點。相反，開發者更喜歡使用單獨的模塊，這些模塊可以在將來根據自己的需要重寫。此外，CMS 在性能優化方面會限制其用戶（是的，最先進的，可以更快的讓你創建網站的解決方案；然而，在多個用戶大量請求服務的情況下，並不容易加快使用現成引擎所編寫的網站）。這就是為什麼靜態網站在這些年變得如此流行。除了我們上面描述的明顯的優勢外，這種頁面有一個重要的缺點 —— 它的內容不容易被編輯。靜態網站生成器專門用於解決此問題，Gatsby 是其中最好的，感謝 GraphQL。我們堅持認為，任何在職的前端工程師在 2018 年至少都能掌握這個流行工具的基本知識。
5. Storybook
Storybook 是開發者在與 React 打交道過程中一個有用的開源工具。特別是，得虧 StoryBook，你可以在獨立的環境中設計和策劃應用程序外的 UI 組件，並且在創建新的 UI 組件時它會發生變化。如果這個功能對你來說並不太重要，那麼讓我們考慮一下 Storybook 將幫助解決幾個嚴重問題的情況。
今天，許多有用的工具支持簡單快速地創建功能性客戶端 - 服務器系統，包括最著名的 Meteor、Firebase、GraphQL 和 Falcor。所有這些工具使編程過程基礎化，應用程序可快速響應。雖然 React 及其熱門的重加載功能對於 UI 創建的開發者來說是一個很大的幫助，但設計階段仍然需大量的時間和編寫不少代碼行。
設想一下，你有一個待辦事項列表的組件。它擁有幾個狀態（一個空列表，一個部分填充的列表，列表中所有元素都被填充，列表中僅有一些元素被填充），我們需要適配每個元素的 UI。即使你可以創建一個通用代碼來根據每個狀態轉換應用程序界面，你仍然需要記錄它（否則對其他團隊成員而言是很難理解的）。Storybook 如何在這裡提供幫助？
如前所述，React Storybook允許您在應用程序之外開發和測試UI組件，並允許團隊中的其他開發人員繼續使用它們。 也就是說，有時會加速界面開發的過程。
2018年JS趨勢：總結
我們非常希望我們的名單能夠引起您對來年最顯著的前端發展趨勢的關注。 另一方面，如果您已閱讀本參考資料，並希望將主要項目工作委託給專業人士，我們將很樂意接受這一責任！ 我們的專家隨時準備為您提供預算內最先進的技術。 立即聯繫我們以獲取更多信息並討論您項目的詳細信息。
閱讀更多 社會學堂 的文章
關鍵字: 前端開發 JavaScript 迅猛發展
