React源码深度解析视频 某课网(完整版)

〖课程介绍〗:
        React毫无疑问是前端界主流的框架，而框架本身就是热点。课程以讲解React实现原理为主，并在实现过程中讲解这么做的原因，带来的好处以及规避了哪些问题。理解源码之后对于React开发过程中出现的一系列问题都可以非常轻松得进行解决，也是能力提升，晋升高级开发工程师的必备技能。) q& s2 m" Y7 O1 J. a/ R
, y+ [6 @. b3 ?/ Z2 p
〖课程目录〗:
        第1章 课程导学- [5 Z: V- i: x" c5 u
        对课程整体进行讲解。
' J0 h" o) {5 a( ~1 z% Y
         1-1 课程导学 试看
        第2章 基础知识 React API 一览# B) t: o  C& \$ z4 F
        React主要API介绍，在这里你能了解它的用法，为下一章源码分析打基础。

         2-1 准备工作 试看
         2-2 JSX到JavaScript的转换
         2-3 react-element
         2-4 react-component1 y# L& G0 p" }6 K! \: o7 y* a+ O
         2-5 react-ref
         2-6 forward-ref+ r. @! X8 |, d$ y/ t2 o7 N
         2-7 context
         2-8 concurrent-mode
         2-9 suspense-and-lazy8 i" Z- y$ ]0 w: v% z
         2-10 hooks6 \6 B% s7 ]0 F8 t0 [0 L
         2-11 children! E) ~! H9 @/ g8 M5 T& A. f; p
         2-12 others3 I: K8 N' @& Q9 j0 j
        第3章 React中的更新
        主要讲解React创建更新中的主要两种方式ReactDOM.render和setState，他们具体做了什么。
; ]% B% o; t# x" b+ |
         3-1 react-dom-render 试看
         3-2 react-fiber-root! U) @! W* p% ?( K; e
         3-3 react-fiber
         3-4 react-update-and-updateQueue3 B2 K5 `1 @6 T8 l
         3-5 react-expiration-time
         3-6 different-expirtation-time# z! {/ l* C( A& }" D) L" `
         3-7 react-setState-forceUpdate
        第4章 Fiber Scheduler! _9 ^3 w# _: N" r0 X
        创建更新之后，找到Root然后进入调度，同步和异步操作完全不同，实现更新分片的性能优化。4 h2 ~& [! {: y9 y: v  R
1 q! f  i5 g* e" L) G! B
         4-1 总结流程概览
         4-2 scheduleWork1 G! u  r9 g. h/ a# @' E
         4-3 requestWork
         4-4 batchedUpdates
         4-5 reactScheduler（1）3 a! n1 Y/ k7 R
         4-6 reactScheduler（2）+ E/ |4 |3 b; v
         4-7 reactScheduler（3）' h1 u3 T; X: A, h/ {" O1 w; J3 h
         4-8 reactScheduler（4）3 }) V- |9 Y1 {$ u0 ^
         4-9 performWork; N+ S3 u! i- |' `+ ?
         4-10 renderRoot
         4-11 最后补充$ Z8 M7 j7 @. R2 e. C$ E
        第5章 各类组件的Update( [4 h* S& e) Z. P, ~
        讲解10多种不同类型的组件的更新过程，以及如何遍历节点形成新的Fiber树

         5-1 入口和优化
         5-2 FunctionalComponent的更新9 }9 z! d* L8 ^6 H
         5-3 reconcilerChildren9 ^4 S/ X0 ^+ a4 |+ n) q/ z' N
         5-4 reconcilerChildren-array0 @9 |: e- X3 j8 D/ {
         5-5 updateClassComponent3 W( p$ f) q/ ~! C
         5-6 ClassComponent的更新, D% x# m2 F0 S; S3 S, c
         5-7 IndeterminateComponent组件类型和其更新过程
         5-8 HostRoot的更新: d* K, p4 O! P1 ?
         5-9 HostComponent和HostText的更新* u( G! w8 w' b6 E
         5-10 Poratl组件的更新
         5-11 ForwardRef的更新+ z/ F" r3 T. R( s& e8 g# b8 G- S
         5-12 Mode组件的更新9 D/ T+ z: D3 ~- \8 S9 l
         5-13 Memo组件的更新
        第6章 完成节点任务
        完成节点更新之后完成节点的创建，并提供优化到最小幅度的DOM更新列表
+ ]9 r% z7 X" M
         6-1 completeUnitOfWork的整体流程和意义
         6-2 重设childExpirationTime4 P$ G: L* A) V" @2 s
         6-3 completWork具体做了什么
         6-4 初次渲染中completeWork对于DOM节点的创建和appendAllChild算法
         6-5 初次渲染中如何进行DOM节点属性初始化操作
         6-6 更新DOM时进行的diff判断
         6-7 completeWork阶段对于HostText的更新" R  {& e3 m& o2 k
         6-8 renderRoot中对于错误的处理
         6-9 unwindWork以及React中的错误处理
        第7章 commitRoot
        根据更新列表最小幅度的改变DOM，实现UI的更新。+ p  i: {3 {' ^& R6 j

         7-1 commitRoot的总体工作内容) J5 Q; K3 R; B4 k3 K  I. {
         7-2 invokeGuardedCallback开发时的帮助方法- U& l7 C3 S1 p6 d* m
         7-3 commitRoot第一个操作-获取快照
         7-4 commitAllHostEffects总体做了哪些事情5 Y' ^. R. ~  v5 G' X3 a  ]$ C
         7-5 commitPlacement插入新的子节点的操作' ~9 z2 w9 ^+ m" D
         7-6 commitWork更新节点属性的过程) H8 O' j# F3 w  A7 o* Q7 |
         7-7 commitWork删除节点的操作过程5 L/ A* j: v& V8 J' t/ R8 z! j
         7-8 commitLifecycles调用生命周期方法5 _  _: C- G+ I1 d& d9 f3 m
        第8章 功能详解：基础, U! c& M# q( W4 v8 A
        各种贯穿于更新和提交阶段的功能，他们在哪里发挥作用，又是如何实现功能的
" [7 d* f7 K7 s8 Q& `/ V) u
         8-1 context-stack
         8-2 遗留context-api的实现过程（1）$ E4 D, N/ m; M. a5 |6 Y. k) O
         8-3 遗留context-api的实现过程（2）& N5 {2 w7 f: F; ^4 W+ ^. y
         8-4 新context的实现  A% [& j1 J7 T+ v9 ^
         8-5 ref的实现过程# T+ g& ^( X0 b' e
         8-6 hydrate-是否需要hydrate的判断* S# i% _8 a" N) ]
         8-7 hydrate-更新开始判断节点是否可以hydrate
         8-8 hydrate-再completeWork中复用可hydrate的节点
         8-9 event事件系统初始化-注入平台事件插件
         8-10 event事件监听的过程" Y) G4 W! o$ }/ ]* |7 _8 M
         8-11 event-事件触发的过程
         8-12 event-事件对象的生产过程( n4 Y5 U/ u3 k# Z8 G! m8 [
         8-13 event查漏补缺
        第9章 suspense and priority
        Suspense作为下一个React的杀手功能，他又是如何实现异步渲染的呢？

         9-1 优先级和任务挂起的含义（1）
         9-2 优先级和任务挂起的含义（2）4 O5 H) o4 T% ~  w( h/ K4 H. @
         9-3 两个expirationTime的不同作用% Q* y2 O; R7 y; ~& G8 |* k$ o
         9-4 Suspense组件同步模式下的更新/ n8 A( A8 B' W5 {; v2 i
         9-5 Suspense组件同步渲染模式补充9 C9 r8 z( X5 d
         9-6 Suspense组件异步模式下的更新) z+ \( i8 Q. ]% `7 s; I- g. o
         9-7 retrySuspendedWork所做的事情
        第10章 功能详解：Hooks3 l- v: B( F/ f$ [& ^
        Hooks颠覆原先的React组件开发模式，提供更小粒度的更新以及更加适合解耦的API。
( O2 [- J) y4 l  _: W8 ~
        第11章 课程总结! E  R, ~9 q6 }- g
        对课程整体进行回顾，以及总结。; q2 H6 q, m3 W

〖视频截图〗:

 

需要联系我：