React的一点理解

110 阅读1分钟

React是什么

简单的来说,React就是一个渲染工具,专心只做渲染,随着软件架构思想在软件开发中的影响,现在很多架构专心只做一件事情,并且把它做好,能做到这点,其实看似简单,但实际操作起来是一件很难的事。所以,Just do one thing,do it best.

React跟浏览器之间的关系

既然是渲染工具,那肯定跟浏览器有着很大的关联,虽然前端工具都是基于浏览器引擎进行开发,我们知道浏览器都是一帧一帧地进行渲染,那浏览器的每一帧都在做什么呢

接收输入事件

执行事件回调

开始第一帧

执行RequestAnimationFrame

layout 样式计算

绘制渲染

执行RequestIdleCallback

这里的每一个任务都在详细做什么,等待查资料了解一番再做展开。

React在做了什么

Scheduler

React16之后增加了调度器,可以设置任务的优先级,根据优先级来决定哪个先执行。

Reconciler

这块也是React的核心实现,负责找出组件的变化,React16之前是通过递归数组的不可中断方式,而16之后采用的是单链表结构的可中断更新的方式,核心的实现就是Fiber。

Fiber

等待更新。。。

Render

这个阶段就是将变化的组件更新渲染到真实的DOM上。