高性能迷你React框架 anu1.2 發佈，支持React16的三大特性

anu已經有兩個月沒有發佈了，通過1.1.5-pre, 1.1.5-pre2, 1.1.5-pre3, 1.1.5-pre4, 1.1.5-pre5, 1.1.5-pre6, 最終放棄了1.1.5, 改爲1.2. 由於內部變更很是多，受控組件與非受控組件那塊徹底重寫，只差一個case沒有跑通（這部分的測試代碼有2000多行）。支持React1.6 的三大特徵，組件支持返回數組，傳送門與錯誤邊界。

下面是新支持的React16特性

1. ReactDOM.render的第一個參數能夠是數組，字符串，數字，undefined, null, true, false。
2. React組件的render方法能夠返回數組，字符串，數字，undefined, null, true, false.
3. 對於undefined, null, true, false， React15是生成一個佔位用的註釋節點（nodeType爲8），如今什麼也不生成，徹底靠算法實現對齊。
4. 相鄰的數字與字任串會合併成一個文本節點，好比說<div>xxx{111}yyy</div>在React15中，div裏面有3個文本節點，兩個分界用的註釋點，如今只有一個文本節點，其nodeValue爲xxx111yyy，用於真實DOM的減小，性能大幅提高。
5. setState/forceUpdate的回調函數之前總在更新週期後才執行，如今提早到每一個組件的componentDidMount/Update後執行。
6. 生命週期順序改變，先A.componentWillMount->B.componentWillUnmount->A.compountDidMount.
7. createPortal的事件冒泡是基於虛擬DOM進行冒泡的
8. 跑通錯誤邊界的1900多行的測試，這裏的規則很是多，有空才詳細介紹。有了它，React16成爲對錯誤處理最完善的框架。
9. 虛擬DOM的結構發生變化，每一個節點都有return, child, sibling等描述本身位置的屬性。
   -return 指向父節點，相似於瀏覽器的parentNode, 取代以前的_hostParent
   -child 指向第一個子節點，相似於瀏覽器的firstChild
   -sibling 指向下一個節點，類擬於瀏覽器的nextSibling
10. componentDidUpdate如今只保留兩個參數，lastProps與lastState

其餘變化與完善

1. React.options添加了大量鉤子，埋點於vnode與組件的各個生命週期之中。
2. 重構findDOMNode,遇到註釋節點返回null
3. 重寫受控組件（基於事件綁定）與非受控組件（基於屬性監控）。
4. 模仿React16，使用stateNode屬性代替舊有的_hostNode與_instance。
5. React.Children與flattenChilden底層依賴的方法由_flattenChildren改成operateChildren，讓其更具通用性，
   flattenChilden改名爲fiberizeChildren，產出一個帶鏈表結構的數組。
6. 新的架構：元素虛擬DOM與組件虛擬DOM都有本身的更新對象，簡化匹配算法
7. 簡化Refs模塊
8. 修復更新虛擬DOM時，namespaceURI丟失的BUG
9. 升級SSR版本
10. 升級lib下的ReactTestUtils
11. 測試case多達524個。

使用

npm i anujs

或者使用架手架 https://github.com/Levan-Du/a...

npm i -g anu-cli

webpack.config中如何代替原來用React編寫的項目

resolve: {
   alias: {
      'react': 'anujs',
      'react-dom': 'anujs',
        // 若要兼容 IE 請使用如下配置
        // 'react': 'qreact/dist/ReactIE',
        // 'react-dom': 'qreact/dist/ReactIE',
    
        // 若是引用了 prop-types 或 create-react-class
        // 須要添加以下別名
        'prop-types': 'qreact/lib/ReactPropTypes',
        'create-react-class': 'qreact/lib/createClass'
        //若是你在移動端用到了onTouchTap事件
        'react-tap-event-plugin': 'anujs/lib/injectTapEventPlugin',  
   }
},

歡迎你們爲anujs加星星與試用！！！

https://github.com/RubyLouvre...