JavaScript 開發者的 10 款必備工具

發表於2017-10-31

JavaScript,一種所有主流瀏覽器都支援的語言,是開發基於瀏覽器的 Web 應用程式的主力,幾乎每年都會受到來自眾多開發人員的關注。自然地,框架和庫的生態系統自然而然地圍繞著 JavaScript 而努力,以簡化和增強 JavaScript 應用程式的開發。

這些工具提供從事件處理到程式碼縮減和資料渲染的功能。以下是開發基於瀏覽器的 Web 應用程式的 JavaScript 開發人員工具包中最必要的技術彙總。

JavaScript 開發者的 10 款必備工具

JavaScript必備框架:Angular

Angular,之前是由Google開發的被稱為AngularJS,是用於移動和桌面Web開發的單框架。為了建立類原生漸進式web應用程式,Angular提供用於彙編應用程式的資料服務的依賴注入,以及用於複合元件的HTML模板。

何處下載Angular?

Angular專案快速入門頁面使得開發者可以輕鬆開始使用Angular。

Angular的功能

2016年9月的Angular第2版的特色是基於TypeScriptMicrosoft的JavaScript型別化超集)的重寫,以處理在Angular初始版本中架構上存在的效能限制。
現在,開發者都在等待Angular 5,預計到到十月二十三日釋出(沒有第3版或第4版)。它預期的功能包括:

  • 用於在瀏覽器中快取應用程式,以加強構建漸進的Web應用程式的便利性。
  • 構建優化器,通過刪除不必要的程式碼使應用程式更小。
  • 使Material Design元件與伺服器端渲染相容。

Angular 6,預計釋出時間比Angualr 5玩晚釋出五到六個月,將聚焦於與Angular 5相同的主題:易用性,更小尺寸和效能。Angular本身具有強大的生態系統,在IDE中有四個資料庫和支援,如JetBrains IntelliJ Idea。

JavaScript必備框架:Aurelia

由聚焦的模組組成的Aurelia是由Blue Spire開發的用於移動、桌面和Web應用程式的客戶端框架。它實現了快速渲染和“高效”的記憶體使用率。

何處下載Aurelia?

你可以從GitHub上下載Aurelia

Aurelia的功能

Aurelia有處理後設資料、依賴注入、繫結、模板和路由的模組。Aurelia整合了Web元件,並提供與物件的雙向資料繫結。多數Aurelia程式碼都是以純JavaScript編寫的。其他功能包括:

  • 一個用於構建自定義元素和給元素新增屬性的HTML編譯器。
  • 支援動態載入。
  • 用於單元測試的可構建耦合程式碼的依賴注入容器。
  • 提供建立新專案選項的Aurelia CLI,需要安裝Node 4或更高版本、NPM 3和Git。
  • 與Polymer庫的整合,用於構建可重複使用的web元件。
  • 在模板引擎中,用於元件繼承時支援bindable的繼承。

JavaScript 必備之 Backbone.js

Backbone.js ,也就是 Backbone ,為重度 JavaScript 應用程式提供了結構體。它具有帶有鍵值繫結和自定義事件的模型,它們是一個支援可列舉函式和宣告性事件處理檢視的 API 的集合。

何處下載 Backbone.js ?

你可以從 Backbone 專案網站下載開發版本和產品釋出版本。

Backbone.js 的功能

Backbone.js 中的資料是使用可以建立、校驗、銷燬並儲存到伺服器的模型表示的。這些模型通過 RESTful JSON 介面連線到應用程式。使用 Backbone.js 時,當 UI 操作提示要更改模型的屬性時,該模型會觸發更改事件。顯示模型狀態的檢視會收到此更改的通知並重新渲染他們。

JavaScript 必備之 Ember.js

Ember.js 是一個強調開箱即用的高效率的框架。它具有整合的模板,被稱為控制程式碼條,旨在減少程式碼編寫量; 在資料改變時,這些模板會自動更新。

從哪裡獲取 Ember.js

可以在 NPM 中輸入 npm install -g ember-cli@2.15 來安裝 Ember.js 。

Ember.js 的功能

Ember.js 的功能包括:

  • 專注於簡化開發的 API 。
  • 專注於讓開發者使應用程式特例化的通用風格。

Ember.js 3.0 穩定版會在2018年1月1日釋出測試版之後的2月12日釋出。在 2.x 版本中不推薦使用的 API ,依然是支援的,這些 API 將在 Ember.js 3.x 中被清除。 一個 add-on 應將支援在 3.x 程式碼行中的 Ember.js 2x API 。

JavaScript 必備之 Ext JS

與其他知名的 JavaScript 框架不同,Sencha 的 Ext JS 並不是開源的; 它是一種商業產品。它用於構建面向企業的資料密集型跨平臺 Web 應用程式,需要多種形式的因素。

何處下載 Ext JS ?

The Ext JS 軟體可以從 Sencha 的 Ext JS 頁面下載到。

Ext JS 的功能

Ext JS 框架提供了許多元件,例如資料網格和日曆。Ext JS 可與 Sencha Architect 等工具一起使用,用於拖放 HTML5 應用程式開發,以及 Sencha Themer ,用於應用程式的樣式設定。

Ext JS 的構建器正在考慮如何使用 Ext JS 的架構執行長期的任務。Sencha 計劃在今年年底或明年初發布 Ext JS 7 ,但是由於 Sencha 收購了 Idera ,這些計劃現在被擱置了。關於提供符合最新的 ECMAScript 標準和使用 NPM 包管理器和 Webpack 模組繫結器的可行性討論已經舉行過了。

JavaScript必備庫:jQuery

JavaScript 的 jQuery 庫的 API 提供了操作 HTML 文件、事件處理和動畫等功能。jQuery 庫由 JS 基金會管理,於 2006 年 8 月首次釋出。

哪裡下載 jQuery?

jQuery 可以從jQuery 專案網站下載。

jQuery 的特性

jQuery 並不是用來構建應用程式的框架,但它提供基本的 API,很容易在瀏覽器中操作 DOM。jQuery 也可以和應用程式構建工具一起使用,比如 Angular 和 React/Redux。

jQuery 團隊現在差不多每年釋出兩個版本,從現在到 2018 年中只會釋出一些小版本。除此之外,jQuery 4.0 和後續版本要求使用“下一代”JavaScript完全重寫,這需要對構建系統進行更新。在 jQuery 4 和後續版本中還有如下計劃:

  • 重寫 jQuery 的速度框架,跟蹤效能迴歸
  • 新設計的事件模型,會丟棄特殊事件鉤子,避免使用 jquery.Event 類的包裝
  • 支付新的原生選項,比如被動事件監聽器

JavaScript 必備之 Meteor

Meteor(又名 Meteor.js )是一個 JavaScript 框架,可以使用較少的程式碼更快地開發 Web、移動和桌面應用程式。開發人員可以在所有環境中使用 JavaScript ,包括在應用伺服器、Web 瀏覽器和移動裝置上。

何處下載 Meteor

Meteor 軟體可以從 Meteor 專案網站下載。

Meteor 的功能

Meteor 平臺,也被稱為 Meteor.js ,包括用於構建已連線客戶端的響應式應用程式的技術,構建工具以及一系列來自 Node.js 和 JavaScript 社群的軟體包。使用 Meteor 後,伺服器會通過裝置傳送資料而不是HTML,然後在客戶端渲染它。

Meteor 1.6 是下一個發行版本號,其重點是升級到 Node.js 8,這將讓 Meteor 更好地利用伺服器上的 ECMAScript 功能,從而提高構建效能。

JavaScript必備庫:Polymer

Google的Polymer JavaScript庫旨在使開發人員能夠充分利用Web元件,為可重用的自定義元素提供與瀏覽器內建元素的互動提供可能。

何處下載Polymer?

你可以從Bower包管理器上安裝Polymer。

Polymer的功能

5月份釋出的Polymer 2.0版通過去掉DOM操作時使用的Polymer.dom改善了互操作性。這使得使用其他庫和框架時再使用Polymer元件更容易。
Polymer 2.0中的其他功能包括:

  • 資料系統的改進,以提升資料通過和元素之間的除錯和傳遞。
  • ECMASript 2015類和標準的自定義元素。Polymer第1版中的方法用於定義元素,而不是使用Plymer的工廠方法。但是工廠方法仍然通過相容性層來支援。
  • 更簡單的陣列處理。

即將釋出是Polymer 3.0,它目前是預覽版本,功能包括Bower和HTML import、NPM和ECMAScript 15模組。Bower和HTML imports功能適用於基於HTML基於匯入的工作流程。但是,他們把Polymer置於網路開發的主流之外,並且使人們難以使用其他框架或構建工具。

JavaScript 必備框架: React

Facebook用來構建使用者介面的 React 庫 ,提供基於元件的宣告性的檢視(view),使用JavaScript來編寫元件邏輯。React庫,也就是React.js,並不支援模型(model)和控制器(controller),但是可以通過其他一些相關的專案完善這些功能。

哪裡下載 React

React 可以從 React 專案網站 下載。

React 特性

你可以使用React的 JSX 語法 來描述使用者介面。JSX允許在一個元件中混合使用JavaScript和HTML。在構建的過程中會轉換成純JavaScript。

為了提高效能,React 在最近的發行版React 16 中對架構進行了重寫,稱為Fiber。這次更新的主要特點是著重於為了處理大型元件的非同步渲染。但是React本身還並不支援非同步渲染,這將會在React 16.x的版本線中實現。

React 16的其他改進包括:

  • 提供元件堆疊追蹤,使得除錯更加簡單。
  • 可以在元件的渲染方法(render)中直接返回字串或者陣列。
  • 新的更快的,基於流的伺服器端渲染。
  • 更接近原生應用的效能。

在一些組織如Apache軟體基金會反對其許可條款後,React 重新修改了其基於BSD+MIT Patents的新的許可證。Apache 擔憂基於BSD + Patents 的許可使得軟體對於下游專案來說,不再是一個“萬能捐贈者” 。

JavaScript 重要框架 : Vue.js

Vue.js是React的競爭對手之一,聲稱更快的渲染速度。其核心庫聚焦於檢視層,並且框架主要是為了增量實現。

何處下載Vue.js?

Vue.js軟體可以從Vue.js專案網站下載。

Vue.js的功能

宣告式渲染是Vue.js中的關鍵,使用模板語法將資料渲染到DOM中。Vue.js元件系統是一種抽象,支援由可自包含開發和可重用的模組組成的大型應用程式。Vue.js中的元件本質上是一個具有預定義選項的Vue例項。
Vue.js 2.5將於2017年10月到來,具有更好整合了TypeScript功能。稍後版本的Vue.js的計劃包括:

  • 使TypeScript使用者更容易在Vue.js中啟動新專案
  • 使用代理重寫框架的響應式系統
  • 支援WebAssembly可移植程式碼格式
  • 吸收Web元件更多功能的能力

相關文章