Blog

기술 기록

React.lazy로 모달 떼어내고 사전 로딩으로 지연 메우기

이미지 클릭 시 크게 보는 상세 모달을 만들면서, 평소엔 안 열리는 화면이라 React.lazy로 분리하고 사전 로딩으로 클릭 지연을 메웠다.

transform이 왜 빠른지 매번 헷갈려서 렌더링 파이프라인의 어디서 갈리는지 정리해뒀다.

모바일에서 카메라로 찍은 사진을 업로드할 때 브라우저가 죽는 일이 있어 browser-image-compression으로 리사이즈해 우회했다.

문서 사이트를 만들면서 Docusaurus와 Mintlify를 나란히 놓고 본 차이. 둘 다 OpenAPI 명세로 API 문서를 만들 수 있는 점은 같았다.

카드 플립 같은 3D UI를 만들며 perspective, transform-style, backface-visibility가 어떻게 맞물려 돌아가는지 정리했다.

검색 플랫폼 등록부터 메타데이터·사이트맵·canonical까지, SEO 작업에서 챙겨야 할 항목을 한 번에 정리했다.

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

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

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

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