最近重新拾起了前端,瞄了一眼react和redux。
关于react
现在的前端,已经从原始粗狂的裸写html,css和js转向专业化工业化的工具链条与各个思想。无论各种编程实践,最后都将模块化,而react则是对html的封装,相当于MVC架构中的View层。
对于每个组件而言,内部绑定一个状态变量,组件的显示依据这个状态来的,当状态转换时,将会重新渲染这个组件(当然,可以hook的)。
对于传统的用javascript拼接字符串来更新DOM而言,react更为轻量,总的来说,它只更新必须更新的。它利用虚拟DOM,比较两次渲染的不同之处,然后只对改焦点进行更新。
对于一颗DOM树,传统通用的树比较算法是O(n^3) 的,react结合实际与经验,提出了多个假设,将时间复杂度降低到O(n)。其中一个很显然的假设是:如果根结点不同的两个DOM是不同的。
关于redux
react只负责视图层的渲染,其他交互部分要由javascript负责,Facebook官方提供了一个基于数据流的Flux,将交互行为分层,通过数据的传递控制UI的显示。不过Flux太重,产生了其他一些类库,redux就是其中之一。
redux的思想和Flux一样是单向数据流,事件数据只由各个事件的触发经过一系列的处理函数传递到视图层。
在react中,父组件是无法获取子组件的状态的,当要进行数据共享时,只能将状态提升到父组件。而redux做得更为彻底,它将所有的状态提到全局,存储在一个称为store的对象内,各层通过api与之交互。