DocumentFragment는 언제 쓰면 좋을까요?
DocumentFragment로 여러 DOM 노드를 조립하고 문서에 삽입하는 방법을 설명합니다. 일반 요소를 사용하는 방식과 비교하고, 성능 측정 결과를 해석할 때의 주의점도 짚습니다.
느린 화면을 재고 고친 기록입니다. 렌더링 비용과 서드파티 스크립트, 메인 스레드 점유를 다룹니다.
모든 태그 보기DocumentFragment로 여러 DOM 노드를 조립하고 문서에 삽입하는 방법을 설명합니다. 일반 요소를 사용하는 방식과 비교하고, 성능 측정 결과를 해석할 때의 주의점도 짚습니다.
SVG를 img·CSS 배경·인라인·스프라이트로 사용하는 방식을 비교합니다. SVGO로 최적화하고, SVGR로 React 컴포넌트를 만들며 자산을 관리하는 방법을 정리합니다.
Web Worker로 무거운 연산을 옮기고 작업과 취소를 관리하는 방법을 설명합니다. 탭 간 통신, Service Worker의 생명 주기, 캐시와 업데이트 설계도 함께 다룹니다.
개인 블로그를 운영하며 겪은 기술 문제와 해결 경험을 정리합니다. 콘텐츠 관리, 빌드·배포, 보안과 성능 등 열 개 영역을 통해 작은 서비스에서 배울 수 있는 일을 살펴봅니다.
테이블과 키, SQL부터 정규화·트랜잭션·인덱스까지 데이터베이스의 기본 개념을 설명합니다. 간단한 쿼리 예제로 개념을 연결하고, NoSQL과 데이터 분산 방식도 살펴봅니다.
GA·Meta Pixel의 초기화가 늦어 이벤트가 유실되는 원인을 살펴봅니다. 이벤트 큐와 스크립트 로드 방식, 캐싱 등 해결책을 비교하고 적용 조건을 설명합니다.
캐시노트플러스의 페이지 이동과 가입 전환율을 개선한 사례입니다. Next.js 서버에서 이동 경로를 정하고, 클릭·스크롤 데이터를 바탕으로 UI를 바꾼 과정을 설명합니다.
JavaScript에서 Map과 Object를 비교하고, 어떤 상황에서 Map을 사용하는 것이 더 유리한지 벤치마크 테스트와 함께 알아봅니다.