1. jsx就是在react的js中使用標籤的語法react
2. 最外層能夠不用div，能夠用Fragment算法
3. dangerouslySetInnerHTML不轉義標籤redux
4. 在constructor中綁定函數如this.handleChange = this.handleChange.bind(this)，能夠提高性能dom
5. this.setState({
list: [...this.state.list, this.state.inputValue],
inputValue: ''
})
改爲異步函數的形式
this.setState((prevState) => {
return {
list: [...prevState.list, prevState.inputValue],
inputValue: ''
}
}, () => {})
能夠提高性能異步
6. 單項數據流函數
7. propTypes校驗父組件傳過來的數值或者函數
defaultProps父組件傳過來的數值給一個默認值性能
8. 當組件的state或者props發生改變時，render函數就會從新執行this
9. 虛擬dom
1. state 數據
2. JSX 模板
3. 數據 + 模板 生成虛擬dom（虛擬dom就是一個js對象，用它來描述真實的dom）
['div', {id: 'abc'}, ['span', {}, 'hello world']]
4. 用虛擬的dom結構生成真實的dom，來顯示
<div id='abc'><span>hello world</span></div>
5. state 發生變化
6. 數據 + 模板 生成新的虛擬dom
['div', {id: 'abc'}, ['span', {}, 'bye bye']]
7. 比較原始虛擬dom和新的虛擬dom的區別，找到區別是span中的內容
8. 直接操做dom，改變span中的內容
原理：js建立dom比js建立js對象損耗的性能大spa
優勢：
1、性能提高了
2、它使得跨度應用得以實現。React Nativecomponent
10. diff算法
同層比對，若是發現哪一層的虛擬dom不一樣，那這一層及這層如下的全部虛擬dom所有更新
11. 生命週期函數
定義：在某一時刻組件會自動調用執行的函數
shouldComponentUpdate：在組件被更新以前自動執行 能夠被用來避免子組件在無數據更新時更新，從而提高性能
shouldComponentUpdate(nextProps, nextState) {
if(nextProps.content !== this.props.content) {
return true
} else {
return false
}
}
componentWillUpdate：組件被更新以前自動執行，可是它在shouldComponent以後被執行，若是shouldComponentUpdate返回true，它才被執行
render
componentDidUpdate：組件被更新以後自動執行
componentWillReceiveProps：當一個組件要從父組件接受參數，只要父組件的render函數被執行了，子組件的這個生命週期函數就會被執行
若是這個組件第一次存在於父組件中，不會執行
若是這個組件以前已經存在於父組件中，纔會執行
componentWillMount：在組件即將被掛載到頁面的時刻自動執行
componentDidMount：在組件被掛載到頁面後自動執行
componentWillUnmount：當這個組件即將被從頁面中剔除的時候，會被執行
12. react-transition-group
13. redux
reducer能夠接受state，可是毫不能修改state
ActionTypes 常量或者變量寫錯了會報錯，字符串寫錯不會報錯，很差定位錯誤所在，因此須要才分ActionTypes
store是惟一的
只有store才能改變本身的內容
reducer必須是純函數（純函數指的是給定固定的輸入，就必定會有固定的輸出，並且不會有任何反作用）
14. UI組件負責頁面的渲染，容器組件負責頁面的邏輯，無狀態組件（只有一個render函數的時候），無狀態組件的性能比普通組件的性能高
15. redux-thunk、redux-saga、react-redux