簡介：
React 是一個構建使用者介面的 JavaScritp Library，主要用於UI，它的核心設計就是「狀態一有變動，就用新畫面取代舊畫面」，在React的世界裡所有東西都是Component為基礎，而寫Component時通常會使用JSX來提升開發效率，而此寫法也讓程式碼可讀性增加。
它是由Facebook、Instagram和一個由個人開發者和企業組成的社群維護，React由Facebook 的軟體工程師Jordan Walke建立。他受到PHP的HTML組件框架XHP影響。
該框架首先於2011年部署於Facebook的 newsfeed，隨後於2012年部署於Instagram。它於2013年5月在JSConf US開源。除此之外，React還有React Native框架，可以用JavaScript寫原生應用程式。
特點：
- 宣告式的設計 (Declarative)
- 使用Virtual DOM的Diff算法 來提升重新繪製的效率，減少DOM的操作
- JSX，是一種語法糖，類似 XML 的 ECMAScript 語法擴充
- 自訂Component，可重複使用
- 父子元件之間可用props傳遞資料
Virtual DOM：
所謂的虛擬DOM物件，指的就是JavaScript物件，例如，若要表現
<li class='book1'>Book 1</li>
我們可以使用物件
{
tagName: 'li',
props: {class: 'book'},
children: ["Book 1"]
}
表示。
當我們開啟頁面時， React 透過render函式建構出一棵DOM樹出來，之後每次state或props變動時 ，React會建構出另一個虛擬的DOM出來，來與真實的DOM做比較，這就是虛擬DOM的概念。
相對於建立一個DOM片段，建立對應的物件樹，輕量許多。實際上，在React中使用JSX撰寫的HTML片段，產生的就是物件樹；由於物件樹是純粹的JavaScript物件，在其它環境也可以運用，因此才會有ReactNative之類的實現。
虛擬DOM「比直接操作DOM高效」的這個說法，常令許多開發者誤認為，使用React比原生操作DOM實現相同頁面功能時的效能要高，實際上，React官方首頁並沒有標榜這類特色。
Diff演算法：
在執行 Diff 演算法時， React 有個假設前提：
- 兩個相同元件產生類似的 DOM 結構，不同元件產生不同的 DOM 結構。
基於這點假設，Diff 演算法只會針對同層節點進行比較
Diff 也極大的優化了這個比較的過程，將演算法複雜度從O(n^3)降低到O(n)。
- 如果父節點不同，React不會再去比較子節點，會銷毀舊樹，建立新樹，這提高了比對的效率。
Babel：
由於並非所有瀏覽器都支援 ES6+ 語法，所以透過 Babel 這個 JavaScript 編譯器（可以想成是翻譯機或是翻譯蒟篛）可以讓你的 ES6+ 、JSX 等程式碼轉換成瀏覽器可以看得懂的語法。通常會在資料夾的 root 位置加入 .babelrc 進行轉譯規則 preset 和引用外掛（plugin）的設定。
JS模組化開發：
隨著 Web 應用程式的複雜性提高，JavaScript 模組化開發已經成為必然的趨勢，以下簡單介紹 JavaScript 模組化的相關規範。事實上，在一開始沒有官方定義的標準時出現了各種社群自行定義的規範和實踐。
- CDN-Based也就是最傳統的
<script>引入方式，然而使用這種方式雖然簡單方便，但在開發實際中大型應用程式時會產生許多弊端：- 全域作用域容易造成變數污染和衝突
- 文件只能依照
<script>順序載入，不具彈性 - 在大型專案中各種資源和版本難以維護
- 必須由開發者自行判斷模組和函式庫之間的依賴關係
- Asynchronous Module Definition 簡稱 AMD，為非同步載入模組的規範，其在宣告時模組時即需定義依賴的模組。AMD 常用於瀏覽器端，其最著名的實踐為 RequireJS基本格式：
define(id?, dependencies?, factory); - CommonJS 規範是一種同步模組載入的規範。以 Node.js 其遵守 CommonJS 規範，使用
require進行模組同步載入，並透過exports、module.exports來輸出模組。主要實現為 Node.js 伺服器端的同步載入和瀏覽器端的 Browserify。 - Common Module Definition 簡稱CMD，其規範和 AMD 類似，但相對簡潔，卻又保持和 CommonJS 的兼容性。其最大特色為：依賴就近，延遲執行。主要實現為：Sea.js。
- Universal Module Definition 簡稱UMD，是為了要兼容 CommonJS 和 AMD 所設計的規範，希望讓模組能跨平台執行。
- ES6 Module ECMAScript6 的標準中定義了 JavaScript 的模組化方式，讓 JavaScript 在開發大型複雜應用程式時上更為方便且易於管理，亦可以取代過去 AMD、CommonJS 等規範，成為通用於瀏覽器端和伺服器端的模組化解決方案。但目前瀏覽器和 Node 在 ES6 模組支援度還不完整，大部分情況需要透過 Babel 轉譯器進行轉譯。
Cheng® 