태그: Reactivity
5편
-
Vue 3를 내부부터 이해하기: Proxy 반응형, Virtual DOM 패치, 컴파일러 최적화, 운영 패턴
Vue 3의 ref·reactive·computed·watch 사용법에서 시작해 Proxy가 track과 trigger로 의존성을 추적하는 방식, Virtual DOM 패치와 블록 트리, 정적 호이스팅·패치 플래그 같은 컴파일러 최적화, shallowRef·v-memo를 쓰는 운영 패턴까지 다룹니다.
-
Preact Signals의 반응성 모델: signal·computed·effect, batch와 untracked, React 통합
Preact Signals의 signal·computed·effect가 읽기 시점에 의존성을 추적하는 원리, batch와 untracked로 갱신을 제어하는 방법, @preact/signals-react로 React와 통합할 때 주의점, 모듈 수준 상태 패턴을 설명합니다.
-
Solid.js의 세밀한 반응성: 컴포넌트는 한 번만 실행되고 Signal이 DOM을 바꾸는 방식
createSignal의 읽기가 의존성을 등록하고 쓰기가 구독자만 갱신하는 추적 모델을 설명하고, createMemo와 createEffect를 언제 쓸지 구분합니다. createStore 불변 업데이트, onMount·onCleanup, <For> 리스트와 batch도 다룹니다.
-
Svelte 5 Runes로 상태 관리 패턴 짜기: 파생 상태, 부수 효과 동기화, 컴포넌트 계약
$state의 깊은 반응성과 $state.raw·snapshot, $derived와 $derived.by, cleanup이 있는 $effect, $props·$bindable로 정하는 컴포넌트 계약을 설명합니다. Svelte 4에서 옮겨 오는 마이그레이션 전략과 성능 패턴도 다룹니다.
-
Svelte 4에서 5로 옮길 때: Runes 마이그레이션 전략, 성능 튜닝, SvelteKit load 연동
Svelte 5 Runes의 $state·$derived·$effect를 정리하고, 레거시 반응성과의 차이·마이그레이션·성능 튜닝·SvelteKit load 연동, Todo·폼·API 실전 코드까지 한국어로 상세히 다룹니다.