React 性能优化：性能永远是第一需求

这是我参与 8 月更文挑战的第 10 天，活动详情查看：8月更文挑战算法

前言

在项目开发中，性能永远是第一需求，必须时刻考虑性能问题。性能优化

如何避免应用出现性能问题，能够考虑这几个方面：markdown

了解常见的性能问题场景，在出现性能问题时，能根据经验按优先级先解决影响最大。网络

在 Web 应用中，最常出现的有两种状况：键盘输入的卡顿、鼠标事件的卡顿。函数

好比在一个列表页面，搜索框的每一次输入都会引起列表内容的刷新，若是每次刷新都须要消耗较大的性能，那就是有问题的。工具

再好比一个视图区域 resize 的功能，每一次鼠标的移动都会致使页面组件的更新，这时就能够经过防抖函数（debounce）来优化性能。post

在开发的时候时常思考：何时能够拆分组件？何时出现了优化的空间？...性能

特别是在 React 中，当页面状态发生变化时组件是否能够高效更新，当组件的粒度越细，React 可优化的空间也越大，diff 算法能够最大程度的保留不变的组件，从而提高性能。优化

什么样的代码是可重构的？这就要求代码的耦合性很是低，是一个独立的功能模块，即不依赖外部的变量、不被不少外部模块所依赖。这样的模块在快速实现后，即便存在必定的性能问题，也能够在以后的优化中重构，即保留了可优化的空间。spa

当问题发生时，咱们能够经过工具定位问题的位置，好比 React 提供的 Dev Tool 和 Chorme 提供的 Dev Tool。

综上，是对性能问题的一些概述，具体场景的实践，会有后续的文章跟进。