首先下载charles软件地址，更详细的使用方法都包含在操作文档里，包含汉化版补丁（下载后查看）

链接：https://pan.baidu.com/s/1Q5rMbcX0Wus7AwdGUWa-Wg

提取码：mkgt

官方文档（https://immutable-js.github.io/immutable-js/docs/#/）

有人说 Immutable 可以给 React 应用带来数十倍的提升，也有人说 Immutable 的引入是近期 JavaScript 中伟大的发明，因为同期 React 太火，它的光芒被掩盖了。这些至少说明 Immutable 是很有价值的，下面我们来一探究竟。

JavaScript 中的对象一般是可变的（Mutable），因为使用了引用赋值，新的对象简单的引用了原始对象，改变新的对象将影响到原始对象。如 foo={a: 1}; bar=foo; bar.a=2 你会发现此时 foo.a 也被改成了 2。虽然这样做可以节约内存，但当应用复杂后，这就造成了非常大的隐患，Mutable 带来的优点变得得不偿失。为了解决这个问题，一般的做法是使用 shallowCopy（浅拷贝）或 deepCopy（深拷贝）来避免被修改，但这样做造成了 CPU 和内存的浪费。

Immutable 可以很好地解决这些问题。

首先我们使用react组件会配合connect来连接store获取state，那么只要store中的state发生改变组件就会重新渲染，所以性能不高，一般我们可以使用shouldComponentUpdate()来判断，但react提供了PureComponent组件，当我们把Component替换成PureComponent的时候会自动帮我们优化组件避免不必要的渲染，注意：前提是使用immutable来管理数据，不然会出现一些问题。

什么是异步组件？简单来说就是异步加载一个组件，正常情况浏览器加载的是我们打包好的bundle.js文件，那么这个文件是集合了所有js是代码，然而我们首屏加载并不需要一次性加载所有的组件，这会造成性能的损耗，所以我们可以使用异步组件，推荐使用（react-loadable）https://github.com/jamiebuilds/react-loadable，那么使用react-loadable就会造成路由跳转的问题，所以我们需要使用withRouter来解决，withRouter组件的功能是让当前组件有能力获取到所有的参数和内容

1.首先进入项目运行 npm run eject 展开详细代码（只可以使用一次，展开后不可恢复）

2.create-react-app 的版本在低于 2.0 的时候可以在 package.json 增加 proxy 配置， 配置成如下：

1
2
3
4
5
6

"proxy":{
    "/api/**":{
        "target":"https://easy-mock.com/mock/5c0f31837214cf627b8d43f0/",   //需要代理的地址
    　　 "changeOrigin": true
    }
}