Backend
DB 성능 최적화: N+1 문제부터 데드락까지 정리
ORM 사용 시 자주 발생하는 N+1 문제, 카테시안 곱, 데드락의 원인을 진단하고 해결하는 방법을 정리합니다.
02026. 3. 28.
#performance16개
Backend
Elasticsearch 도입으로 검색 지연 시간 40배 줄이기
관계형 DB의 LIKE 검색 한계를 Elasticsearch 역색인 구조로 풀어 검색 속도를 약 2초에서 48ms로 줄인 과정을 정리합니다.
02026. 3. 28.
Frontend
Next.js 렌더링 전략 완벽 가이드: SSR, SSG, ISR부터 RSC까지
Next.js의 SSR, SSG, ISR 렌더링 전략과 서버 컴포넌트(RSC)의 동작 원리를 비교하고 상황별 선택 기준을 정리합니다.
02026. 3. 28.
Frontend
JavaScript 엔진은 어떻게 소스 코드를 기계어로 실행할까: V8 컴파일 파이프라인 분석
V8 같은 현대 JavaScript 엔진이 소스 코드를 토큰화, AST 생성, 바이트코드 변환, JIT 컴파일을 거쳐 기계어로 실행하는 과정을 단계별로 정리합니다.
02024. 11. 25.
Frontend
React 18 동시성 렌더링 핵심 가이드: 자동 배칭부터 useTransition, useId까지
React 18의 동시성 렌더링, 자동 배칭, useTransition, useId 등 핵심 기능으로 UI 응답성과 사용자 경험을 개선하는 방법을 정리합니다.
02024. 11. 24.
Frontend
React Native 새 아키텍처 이해하기: 브릿지를 대체한 JSI
React Native의 기존 브릿지 구조가 가진 성능 한계를, 새 아키텍처의 JSI와 Fabric, Turbo Modules가 어떻게 해결하는지 정리합니다.
02022. 11. 16.
Frontend
Web Worker로 무거운 로직을 다른 스레드에서 처리하기
Web Worker로 무거운 로직을 별도 스레드에서 처리해 브라우저가 멈추는 문제를 막는 방법을 정리합니다.
02022. 9. 11.
Frontend
addEventListener 심화 옵션과 효율적인 이벤트 관리: capture, once, passive, AbortController
addEventListener의 capture, once, passive 옵션과 AbortController로 이벤트를 효율적으로 관리하는 방법을 정리합니다.
02022. 9. 10.
Frontend
TypeScript groupBy로 배열을 한 번에 그룹화하기
filter를 반복 호출하는 대신 groupBy로 배열을 한 번만 순회해 그룹화하고, 키로 데이터에 바로 접근하는 방법을 정리했습니다.
02022. 7. 29.
Frontend
React 18 useTransition으로 무거운 작업 중에도 입력 응답성 유지하기
React 18 useTransition으로 업데이트 우선순위를 나눠 무거운 필터링 중에도 입력 응답성을 유지하는 방법을 정리합니다.
02022. 7. 24.
Frontend
CSS Grid에서 Text Ellipsis가 안 되는 이유와 minmax(0, 1fr) 해결법
CSS Grid 아이템에서 white-space: nowrap 말줄임이 동작하지 않는 원인을 min-width: auto 관점에서 살펴보고 minmax(0, 1fr)로 해결합니다.
02022. 5. 22.
Frontend
JavaScript 정규표현식: 생성자 함수(RegExp)로 동적 패턴 완벽하게 다루기
런타임에 결정되는 동적 패턴을 RegExp 생성자 함수로 안전하게 다루는 방법을 정리합니다.
02022. 4. 29.
Frontend
프론트엔드 성능 최적화를 시켜줄 8가지 방법!!
리소스 압축, 폰트·이미지 최적화, 지연 로딩, CDN 등 프론트엔드 성능을 높이는 8가지 방법을 소개합니다.
02022. 4. 28.
Frontend
getStaticPaths와 fallback 프로퍼티를 알아보자!!
Next.js 동적 라우팅 정적 페이지를 만드는 getStaticPaths와 fallback 프로퍼티의 동작 방식을 알아봅니다.
02022. 4. 27.
Frontend
Intersection Observer를 사용하여 lazy loading 해보기
Intersection Observer API로 무한 스크롤과 이미지 지연 로딩을 구현하는 방법을 알아봅니다.
02022. 4. 26.
Frontend
React에서 더 나은 UX를 제공하는 Skeleton 만들어보기!
로딩 중 사용자 경험을 개선하는 스켈레톤 컴포넌트를 React에서 적용하는 방법을 알아봅니다.
02022. 4. 26.