看了网上很多帖子很多都说setState慎用，因为可能导致页面性能变差。 报着怀疑的态度发现并不如此。
代码和运行结果直接看效果（后面再从源码角度进行分析）涉及到React的事件系统。
现象分析
1. yes代表渲染成功，可以看到总共渲染了两次。 那么setState可不止2次。 那么什么导致渲染次数的。（首先一个事件发生到结束的过程（比如Click，setTimeout），每次调用setState并不会立即进行渲染，而是放到了一个队列里面，等待事件结束，看setState最后渲染的那个结果，最后在进行渲染）;
2.如果同上面使用了this.setState({ }); 这里面的值是空的，那么这个有什么作用？这个能够把除其它setState里面排列的值之外的，其它的用this.state.val直接赋值的内容，给重新渲染一次，如下图：
原理分析
如下图流程图所示，其中的batch update就是判断是否在事物当中，如果是，接着排队列，否则进行渲染。
(正在整体看其它的源码，就先不按照自己的了 https://zhuanlan.zhihu.com/p/20328570?columnSlug=purerender可以参考此链接) 后续看完后在进行分享。
总结：在React中setState不是每次调用就立刻渲染的。 他们的队列的顺序也在一次事件之内进行结算（比如在click事件过程中可能有很多setState在等待，等Click事件完成之后，setState这个队列里面的内容就开始进行结算了），所以setState多次调用并不会导致渲染多次。 但是事务的次数可能会导致渲染。