React Fiber란 무엇인가 — memoizedState와 훅
Fiber는 Element에 대응하는 내부 데이터 객체다. 훅 리스트가 어떻게 붙는지, 호출 순서가 왜 중요한지, 함수형 슬롯과 클로저는 어디서 만나는지 중분량으로 정리한다.
React 배칭은 어떻게 동작하나 — flushSync와 업데이트 큐
state를 변경하면 리렌더링이 언제, 몇 번 일어날까? React의 배칭을 업데이트 큐와 마이크로태스크 관점에서 따라가며 정리한 메모.
React 훅이 순서를 기억하는 이유 — Fiber와 연결 리스트
훅에 호출을 가리키는 포인터가 없는 이유, Fiber의 memoizedState 연결 리스트, 그리고 같은 구조가 동시성 렌더링을 가능하게 한 흐름을 정리한다.
프로토타입 체인 — 프로퍼티는 어디서 찾나
프로그램은 스코프 흐름으로 흐르고, 점·this.·new를 만나는 지점에서 프로토타입 체인이 끼어든다. this는 이번 호출의 기준 객체를 가리키는 포인터고, 없는 필드는 __proto__로 이어 찾는다.
스코프 체인 — 변수는 어디서 찾나
코드를 실행하기 전에 엔진은 식별자를 먼저 등록한다. 호이스팅과 TDZ는 그 등록의 결과고, 실행 중에 이름을 찾아 바깥으로 걷는 규칙이 스코프 체이다. 클로저가 유지하는 것도 바로 이 사슬이다.
합성(Composition) 패턴의 리렌더 최적화 원리 — JSX 변환으로 확인하기
합성으로 넘긴 children은 받는 컴포넌트 몸통에서 React.createElement로 변환되지 않는다. 그래서 참조가 유지되고 리렌더가 전파되지 않는다 — JSX 변환 결과로 확인한다.
사내 정보 Wiki를 MCP 서버로 만들기 (RAG + 로컬 임베딩)
NotebookLM으로 쓰던 사내 위키의 한계를 넘어, 코드 에이전트가 검색 도구로 바로 쓰는 사내 Wiki MCP 서버를 RAG와 로컬 임베딩(Ollama)으로 만든 과정을 정리한다.
테스트 앱 배포 방식 — Android와 iOS는 어떻게 다를까
네이티브 테스트 앱을 어떻게 설치시키는지 정리. 크게 '빌드 파일 직접 설치'와 '배포 앱을 통한 설치'로 나뉘고, Android랑 iOS가 각각 다르게 동작한다.
레이아웃 컴포넌트, Compound 패턴 vs Prop 패턴 — 언제 무엇을 쓸까
검색 필터 레이아웃을 공통 컴포넌트로 뽑으며 prop 대신 compound를 택한 이유. 두 패턴의 차이와, 레이아웃에 compound가 유리한 상황을 정리했다.
배럴 임포트란 무엇인가: 트리쉐이킹 저하부터 빌드 OOM까지
배럴 임포트가 왜 개발 서버를 느리게 만들고 빌드 메모리를 폭증시키는지, AST 분석부터 의존성 그래프 구축까지 단계별로 살펴보고 직접 경로 임포트 등 해결책을 정리했다.
트리쉐이킹이란 무엇인가: ESM과 CJS, enum과 as const, sideEffects까지
트리쉐이킹이 정적 구조(ESM)에서만 가능한 이유, enum·const enum·as const가 트랜스파일 후 어떻게 달라지는지, usedExports·sideEffects가 실제로 무엇을 지우는지까지 예제 코드로 정리했다.
모달 상태를 어디에 둘까 — Context provider 대신 모듈 스토어와 Portal
모달을 훅으로 걷어낸 다음 질문은 '그 상태를 어디에 둘까'다. 흔한 Context provider 대신, 전역에 노출되는 모달의 성격에 맞춰 모듈 스토어와 Portal 루트로 provider 없이 두는 방법과 트레이드오프를 정리한다.