知識點(diǎn)

1. 引入styled-components依賴， css的寫法可轉(zhuǎn)為js寫法

import styled from ’styled-components’;
export const HeaderWrapper =styled.div`
    height: 58px;
border-bottom: 1px solid #f0f0f0;
`

//'injectGlobal' is not exported from 'styled-components’
//injectGlobal已過期 現(xiàn)在采用 createGlobalStyle
引入方式即相當(dāng)于組件的方式
import {HeaderWrapper} from ‘./style.js’;
調(diào)用方式
<HeaderWrapper> Header</HeaderWrapper>
子屬性引入  &.right{ }

2. devtool依賴可以采用redux-devtools-extension
3. combineReducers 對reducer進(jìn)行合并處理
4. immuable.js 第三方依賴 讓state不可變（fromJS({name:’hello'})）
5. react-immuable state的獲取和設(shè)置都通過set和get方法
6. react-router-dom 路由<Router>
7. PureCommponent 結(jié)合immableJS實(shí)現(xiàn)自己根據(jù)數(shù)據(jù)進(jìn)行刷新，可以避免父組件更新，所有子組件都更新的情況

優(yōu)化

1. 代碼編寫 每個組件有各自的reducer等其它信息，統(tǒng)一在index.js導(dǎo)出
2. 性能優(yōu)化 PureCommponent 結(jié)合immableJS實(shí)現(xiàn)自己根據(jù)數(shù)據(jù)進(jìn)行刷新
3. 性能優(yōu)化 Link(react-router-dom)替換a標(biāo)簽，優(yōu)化一次html請求
4. 性能優(yōu)化 react-loadable 引入 ，優(yōu)化js資源，避免一次性加載所有js文件（結(jié)合WithRouter）