相信大家都了解 redux，并且也认同这种数据流的方式（毕竟不认同，你也不会用嘛~），然，世间万物，皆有利弊。 本身我使用 redux 并不会有什么所谓的“痛点”，因为 redux 默认只支持同步操作，让使用者自行选择处理异步，对于异步请求 redux 是无能为力的。可以这么说…

用途：在没有这个生命周期函数之前，我们使用的数据来源可能是属性对象，也可能是状态对象，在我们的上文中的放码过来阶段就有所体现，我们可以通过这个生命周期函数将属性对象派生到状态对象上，使我们在代码中只通过this.state.XXX来绑定我们的数据。示例如下 举例：在我们的日常开…

react自从2013年推出到如今已经走过了很多个年头，react生态redux、react-redux、redux-saga也已经成为react开发者的配套标准，使用起来已经相当熟悉，本文简单聊聊redux、react-redux和redux-saga的实现原理。 这张经典的…

自从react 16出来以后，react fiber相关的文章层出不穷，但大多都是讲解fiber的数据结构，以及组件树的diff是如何由递归改为循环遍历的。对于time slicing的描述一般都说利用了requestIdleCallback这个api来做调度，但对于任务如何调…

Enzyme是由Airbnb开源的一个React的JavaScript测试工具，使React组件的输出更加容易extrapolate 。Enzyme的API和jQuery操作DOM一样灵活易用，因为它使用的是cheerio库来解析虚拟DOM，而cheerio的目标则是做服务器端…

在 web 页面中，如果需要改变多个元素的位置，可以通过元素拖动来实现。HTML5中加入了一个全局属性draggable，通过设置该属性的值为 true/false 来控制元素是否可拖动。需要注意的是： 链接和图片默认是可拖动的，可以通过将 draggable 设置为false…

在前端开发过程中，对性能产生最大影响的因素莫过于DOM的重排重绘了，React作为前端框架领跑者，为了有效解决DOM更新开销的问题，采用了Virtual DOM的思路，不仅提升了DOM操作的效率，更推动了数据驱动式组件开发的形成与完善。一旦习惯了数据驱动式开发，再要求我们使用显…

在源码中 reconciliation 阶段也被视为 "render" 阶段. 在该阶段, React 会遍历整个组件树, 并且进行如下操作: 上述所有操作被称为 Fiber 内部工作(work inside Fiber). 需要完成的工作类型取决于 React Element…

首先，合成事件这个名词是从“Synthetic Event”翻译过来的，在react的官方文档和源码中，这个术语狭义上是指合成事件对象,一个普通的javascript对象。而在这里，我们谈论的是由众多不同类型事件的合成事件对象组成的合成事件系统(React’s Event Sy…