https://www.youtube.com/watch?v=W5_jtoRPgR0
performConcurrentWorkOnRoot
- 비동기 작업 : performConcurrentWorkOnRoot
- 동기 작업 : performSyncWorkOnRoot
함수 까보기
callbackNode Task를 소비하는 과정 -> null을 할당할 때까지 진행
root.callbackNode(scheduleCallback의 return 값 즉 Task // Work를 Task로 만드는 함수이므로 결국엔.)은
- commit phase 지나면 null로 초기화
- null이 아니다? -> Work를 진행하다 중지됨
- workLoopConcurrent에서 while문 중지됨 -> performUnitOfWork 호출 못함 -> workInProgress가 null 할당이 안됨 -> commit phase에 도달 못함 -> callbackNode에 null 할당 X
(workInProgress(render phase에서 작업중인 fiber) -> commit phase -> current) // current가 되고나면 workInProgress가 null이되는 것!
ensureRootIsScheduled 호출 후에도
(각 phase 진행 중 추가적인 UPDATE 발생할 경우를 대응하기 위하여 스케줄링 요청 -> callbackNode가 바뀔 수 있음)
여전히 root.callbackNode가 originalCallbackNode와 같다면
현재 callbackNode(Task)가 최우선이므로 peformConcurrentWorkOnRoot를 bind해서 return -> scheduler가 다음 프레임에서 performConcurrentWorkOnRoot을 실행 // return null이 될때까지
* workInProgress가 null이 아니면 아직 render phase / null이면 commit phase
'TIL' 카테고리의 다른 글
좋은 코드의 기준이란? feat. 토스 Frontend Fundamentals (3) | 2025.02.01 |
---|---|
PDF.js를 활용해 PDF 임베드하기: pdfjs-dist 사용법 (1) | 2024.11.27 |
[React 까보기 시리즈] 리액트가 WORK를 스케줄링하는 과정을 까보자 (2) | 2024.11.07 |
[React 까보기 시리즈] Virtual DOM 의 맨 위에는 어떤 node 가 있을까? root node 까보기(feat. CRA) (0) | 2024.11.07 |
[React 까보기 시리즈] Fiber 생성 과정 (0) | 2024.11.07 |