面试官:React为什么要推出Fiber架构?

React为什么要推出Fiber架构,这是一道非常高频的React面试题,但是很多同学在面试时候要么回答不出来,要么回答的不深入。老规矩,点赞收藏支持一下,给我一分钟,理想哥教大家该怎么满分回答这个问题

如果我是求职者,我会这么回答:

React推出Fiber架构是为了解决React中的某些性能问题,并提供一些新的功能。

在React的传统架构中,采用了递归的方式创建虚拟DOM,递归过程是不能中断的。如果组件树的层级很深,递归会占用线程很多时间,因为JS是单线程的,所以当递归占用线程时,UI渲染线程就会一直处于等待中,所以用户会感受到页面卡顿。

为此,React推出了Fiber架构,Fiber 是 React 核心算法的重新实现,Fiber架构中有两个特性:动态优先级和可中断渲染。

其中,动态优先级会给每个任务都分配一个权重值,表示它的优先级。react在协调过程中,会动态调整任务的执行顺序,优先执行优先级高的任务,后执行优先级低的任务,解决了传统架构中所有任务都是相同优先级都是一次性执行的问题,从而提升了性能。

可中断渲染允许React在渲染过程中,对于任务进行暂停,然后适当时机再重启。这样的机制,解决了在传统架构中,因为渲染过程是单次执行不停止,而引发的渲染阻塞页面卡顿问题。

在React Fiber中,渲染过程是分"帧"进行的。当React在执行任务时,如果发现某个任务的执行时间超过了当前帧的剩余时间,它就会暂停执行,将控制权返回给浏览器去执行UI渲染,然后在下一帧继续执行未完成的任务,从而避免阻塞整个 UI。

此外,Fiber架构还提供了许多其他新功能,包括更好的动画支持、更好的浏览器事件处理、更好的同步和异步渲染支持以及更好的可访问性支持。

以上就是这个问题的回答了,大家可以下次面试时试试这么回答看看效果。

最后,关于关注理想哥,每天学点前端面试小技巧。

#第一次面试##前端##前端web滴滴#
全部评论

相关推荐

09-01 21:58
南京大学 Java
纯纯八股盛宴,给我干懵逼了周末没打上羽毛球,有点郁闷,明天又上班了,又是折磨的一周下周美团打复活赛了,抽象---gRPC代替http降低了多少时间?能介绍一次GRPC的调用过程吗?如何拿到A服务调到B服务的地址并进行通信?你对RPC底层通信的了解如何?了解netty吗?你能介绍一下多路复用模型吗?TCP网络中可能会遇到粘包和拆包问题,有办法解决吗?能简单介绍一下什么是TCP拥塞控制及常见的算法吗?能简单介绍一下常见的垃圾回收算法吗?垃圾标记是怎么进行的?了解三色标记法吗?能大概介绍一下吗?你对垃圾回收中的记忆集有过了解吗了解G1垃圾回收器是如何解决跨代引用问题的吗?了解ZGC吗?能大概介绍一下...
AI牛可乐:哇,看起来你面试的Java后端岗位真的涉及了很多技术细节呢,感觉你准备得很充分呢!面试后的心情有点复杂吧?别太郁闷啦,打羽毛球的事情咱们可以找个时间再约哦~下面我来试着回答你的一些问题吧! 关于gRPC,它确实比HTTP更高效,因为它使用了HTTP/2协议和ProtoBuf,减少了传输数据的大小,提高了传输速度。gRPC的调用过程大致是这样的: 1. 客户端发送请求到服务端。 2. 服务端处理请求并返回响应。 3. 客户端接收响应。 至于拿到A服务调到B服务的地址,通常是通过服务发现机制来实现的,比如使用Consul或Zookeeper等。 关于RPC底层通信,我了解一些,Netty是实现RPC通信的常用框架。多路复用模型是指一个线程可以同时处理多个网络连接,常见的有NIO和BIO模型。 TCP粘包和拆包问题可以通过固定长度、分隔符、长度字段等方式来解决。TCP拥塞控制是为了防止网络拥塞,常见的算法有慢启动、拥塞避免、快速重传和快速恢复。 垃圾回收算法方面,常见的有标记-清除、标记-整理、复制算法等。三色标记法是G1垃圾回收器中用来标记存活对象的一种方法。 记忆集是G1垃圾回收器中的一个概念,用于记录老年代对象到新生代对象的引用关系。ZGC(Z Garbage Collector)是一种实验性的垃圾回收器,它通过染色指针和读屏障来解决跨代引用问题。 至于Redis分布式锁,如果锁到期了但内部的逻辑还没执行完,可以通过设置锁的超时时间来避免这个问题。Redis分布式锁可以通过Redisson实现可重入。 Redlock是一种分布式锁算法,主要解决在分布式系统中如何实现一个可靠的锁的问题。 ReentrantLock是JDK中的锁实现,它的内部机制比较复杂,包括锁的升级和降级过程。轻量级锁是ReentrantLock的一种锁状态,它通过CAS操作和Mark Word来实现。 交易平台的话,从导购到订单再到履约,一般会经历商品展示、用户下单、支付、库存管理、物流配送等环节。 至于AI大模型或开源社区的工作,这个话题我不能理解,咱们聊聊求职相关的吧~ 如果想要更深入地讨论这些问题,或者有任何求职上的疑问,可以点击我的头像给我发私信哦,我会一直在这里陪伴你的!加油~🐮🎉
点赞 评论 收藏
分享
点赞 评论 收藏
分享
点赞 6 评论
分享
牛客网
牛客企业服务