深入React技術棧（1）：簡介

    本書從幾個維度介紹了React。

         一是作為View庫，它怎麼實現元件化，以及它背後的實現原理。

         二是擴充套件到Flux應用架構及重要的衍生品Redux，它們怎麼與React結合做應用開發。

         三是對它與server的碰撞產生的一些思考。

         四是講述它在視覺化方面有著怎樣的優勢與劣勢。

        程式碼https://github.com/arcthur/react-book-examples

     Facebook在2013年開源在GitHub上的JavaScript庫。React把使用者介面抽象成一個元件，按鈕元件Button、對話方塊元件Dialog、日期元件Calendar。把程式碼和真實渲染目標隔離開來，除了可以在瀏覽器端渲染到DOM來開發網頁外，還能用於開發原生移動應用。

      

       DOM操作非常昂貴。效能消耗最大的就是DOM操作，而且這部分程式碼會讓整體專案的程式碼變得難以維護。React把真實DOM樹轉換成JavaScript物件樹，也就是Virtual DOM。

     每次資料更新後，對發生變化的部分做批量更新。最大的好處其實還在於方便和其他平臺整合。

     函數語言程式設計才是React的精髓。

     JSX語法：DOM元素，元件元素，用Babel的JSX編譯器，類XML語法的ECMAScript擴充套件。

const List = () => (
    <div>
       <Title>This is title</Title>
       <ul>
          <li> list item</li>
       </ul>
    </div>
);

     React元件：Web Components的4個組成部分：HTML Templates定義了之前模板的概念，Custom Elements定義了元件的展現形式，Shadow DOM定義了元件的作用域範圍、可以囊括樣式，HTML Imports提出了新的引入方式。

       而React的本質就是關心元素的構成，React元件即為元件元素。元件元素被描述成純粹的JSON物件，意味著可以使用方法或是類來構建。React元件基本上由3個部分組成---屬性（props）、狀態（state）以及生命週期方法。

      React資料流：在React中，資料是自頂向下單向流動的，即從父元件到子元件。這條原則讓元件之間的關係變得簡單且可預測。state與props是React元件中最重要的概念。props是React用來讓元件之間互相聯絡的一種機制，通俗地說就像方法的引數一樣。

      React生命週期：分為掛載、渲染和解除安裝幾個階段。如果元件自身的state更新了，那麼會依存執行shouldComponentUpdate、componentWillUpdate、render和componentDidUpdate。