React 18: concurrency

hailey·2022년 10월 12일
0

TIL

목록 보기
11/14

Concurrency는 그 자체로는 기능이 아니다.
동시에 ui의 다양한 버전을 준비하게 해준다.

Concurrent React는 전형적인 구현 디테일보다 중요하다. 모델을 렌더링하는 리액트의 코어의 기초적인 업데이트다. 그렇기 때문에 Concurrency가 높은 가치가 있다는 걸 아는 게 중요하다.

18 전 버전
single, uninterrupted, synchronous transaction

synchronous transaction 일 때는, 업데이트가 렌더링을 시작하면 사용자가 화면에서 결과를 볼 수 있을 때까지 업데이트를 중단할 수 없다.

18 버전
업데이트 렌더 시작하면, 중간에 멈추고, 그 후에 계속할 수 있다.그리고 진행 중인 렌더를 아예 포기할 수도 있다. 렌더링이 중단되더라도 UI가 일관되게 표시되도록 보장한다. 이를 위해, 전체 트리가 평가되면 끝까지 DOM mutation을 수행하기를 기다린다.

이 기능을 통해, react는 메인 thread를 막지 않고, 백그라운드에서 새 화면을 준비할 수 있다. UI가 대규모 렌더링 작업 중에도 사용자 입력에 즉시 응답하며 유동적인 사용자 경험을 생성할 수 있다.

또다른 예: 재사용 가능한 상태 (reusable state)

idempotent : 멱등성 -> 연산을 여러 번 적용하더라도 결과가 달라지지 않는 성질

Suspense in Data Frameworks

Server Components is Still in Development

새 기능: Automatic Batching
리액트가 더 나은 성능을 위해 여러 개의 상태 업데이트를 한번에 re-render로 묶는 작업

0개의 댓글