Render

performace

我们从performace里面入手我们刷新浏览器的时候录视，直到结束，我们就可以获取到在这段时间，一整个render是调用了那个文件，那个函数，那个方法

首先render阶段的开始调用performsyncworkonroot方法

我们知道其实内部有两棵树，一颗是currnt是页面展示的，一棵树是Workinprogress,这两数其实是一模一样的，作用在更新和初始渲染的时候会用到，workLoopSync这个函数里面有个while循环（循环构建树），条件是不为空的时候继续向下执行performUnitOfwork方法

执行performUnitOfwork方法的时候会把刚刚的树传进去，来创建出节点

到了这一步才开始创建节点，按照深度优先遍历原则进行节点渲染，按照react来讲就是 App -> div -> header -> img -> p -> img -> header -> div -> App 相当于一个递归的过程

判断是文本节点还是，dom节点，还是数组，如果是数组就递归遍历

执行到这里就结束了我们每个都渲染上去了