Frontend

기술 기록

JSX 내부 동작과 트랜스파일 정리

JSX가 자바스크립트로 어떻게 바뀌는지 토큰화부터 코드 생성, 트랜스파일까지의 단계를 짚어봤다.

실제 DOM과 가상 DOM의 차이, 재조정과 리플로우, DocumentFragment까지 가상 DOM이 풀고 있는 문제들을 한 번에 짚어봤다.

리액트를 깊이 들여다보면서 선언적 코드, 가상 DOM, Flux 아키텍처를 학습 노트로 묶어 정리했다.

리액트가 등장하기 전, 순수 JS부터 jQuery, Backbone, Knockout, AngularJS까지 상태관리가 어떻게 진화해왔는지 정리한 학습 노트다.

Swiper v11에서 slideTo(0)이 일으킨 페이지 스크롤 부작용을 피하려고 setTranslate + updateActiveIndex 조합으로 우회한 기록.

인스타그램·카카오톡 인앱브라우저에서 무너지던 소셜 로그인·본인인증·결제 플로우를 User-Agent 분류와 듀얼 채널 통신 패턴으로 다시 세운 작업 회고.

Pages Router 기준 SSR·SSG·ISR이 매번 헷갈렸다. 셋을 한자리에 두고 동작 방식과 트레이드오프를 정리했다.

채팅 UI에 역방향 무한 스크롤을 붙이며 scrollHeight 측정 타이밍, instant 캐스팅, overflow-anchor 대안까지 짚었다.

코드 한 블록의 실행 시간을 잴 때 performance.now()를 어떻게 쓰고, Date.now()와는 무엇이 다른지 정리했다.

DNS 조회부터 Composition까지, 브라우저가 웹사이트를 띄울 때 내부에서 벌어지는 흐름을 Construction과 Operation 두 단계로 짚어봤다.