올리브영 메인페이지 성능 개선기
온라인몰 메인페이지의 초기 렌더링 지연과 느린 LCP 문제를 분석하고, 불필요한 지연 로직 제거와 탭 렌더링 순서 조정으로 개선했습니다. 또한 데이터 분리와 모니터링을 통해 FID, LCP, 로딩 타임을 함께 줄였습니다.
#성능#웹
3600
국내 IT 기업 기술 블로그 최신 글
새로운 기술 블로그가 추가되었어요
필터 1
새로운 컬리몰 NX를 소개합니다.
고도몰 기반 컬리몰을 Next.js 기반 NX로 전환하며 상품·주문·회원 서비스를 재구축했습니다. SSR, Lint, 빌드 캐시, PR 성능 테스트로 성능과 코드 품질을 개선했습니다.
#Next.js#React
000
새로운 컬리몰 NX를 소개합니다.
컬리몰 웹프론트팀의 NX 전환 과정을 소개한 글입니다. 레거시를 걷어내며 성능 개선, URL 통합, 코드 품질 강화를 이뤘습니다.
#Next.js#React
4100
신입 웹프론트엔드 개발자 2개월 차 후기
신입 웹프론트엔드 개발자 2개월 차 후기
2개월 온보딩에서 Next.js 렌더링, 모노레포, Storybook의 동작과 활용 방식을 학습했습니다.\n빌드·배포·협업 흐름을 경험하고 온보딩 문서화와 과제 구성 개선점을 제안했습니다.
#Next.js#SSG
3800
React 18: 리액트 서버 컴포넌트 준비하기
React Server Components가 데이터 요청 waterfall과 번들 크기를 줄이는 방식을 설명했습니다. SSR과의 차이, 컴포넌트 분류 및 제약 조건도 정리했습니다.
#React#React Server Components
1200
Transition : 쉿, 이제 안전해 나의 작은 Suspense
Suspense의 fallback 전환이 유발하는 화면 깜빡임 문제를 짚었습니다. React 18 Transition과 Recoil 지원 기능으로 이전 화면을 유지하는 방법을 소개합니다.
#React#Suspense
1900
Runtime 환경 변수 설정으로 빌드 프로세스 개선하기
Next.js 빌드 타임 환경 변수의 환경별 빌드 문제를 분석했습니다. `window.__ENV` 스크립트로 런타임 주입하는 방식을 구현했습니다.
#Next.js#환경 변수
000
Runtime 환경 변수 설정으로 빌드 프로세스 개선하기
Runtime 환경 변수 설정으로 빌드 프로세스 개선하기
Next.js의 빌드 타임 dotenv 주입으로 환경별 빌드가 필요한 문제를 분석했습니다.\npublic 스크립트와 window 객체를 활용한 런타임 환경 변수 주입 방식을 구현했습니다.
#Next.js#dotenv
3100
쿠팡 파트너스
개발자를 위한 서적을 확인해 보세요
이 게시물은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.
#개발서적#프로그래밍
사용자 경험과 성능 개선 방법 in 카카오웹툰
카카오웹툰의 SSR 캐싱, CDN, 지연 로딩 기반 성능 개선 사례를 소개했습니다.\n로딩 쉬머와 이벤트·애니메이션 최적화, 라이트 모드로 UX를 보완했습니다.
#Next.js#SSR
000
사용자 경험과 성능 개선 방법 in 카카오웹툰
사용자 경험과 성능 개선 방법 in 카카오웹툰
카카오웹툰의 SSR 캐싱, 리소스 최적화, 지연 로딩 기반 성능 개선 사례를 소개했습니다. 로딩 체감, 인터랙션, 저사양 환경까지 고려한 UX 트레이드오프를 설명합니다.
#Next.js#SSR
3000
React 18 에서 추가된 기능
React 18의 동시 렌더링, automatic batching, startTransition 등 주요 추가 기능을 소개했습니다. Suspense로 데이터 로딩 상태와 UI 표시 순서를 분리하는 방식을 설명합니다.
#React#Suspense
1900
React 리팩토링, 10년 넘은 리디북스 웹도 OK
리디북스 웹의 이기종 기술 스택을 React와 Next.js 중심으로 점진 리팩토링했습니다.\nSSR·캐싱·자동화 배포와 컴포넌트 일반화로 성능 및 유지보수성을 높였습니다.
#React#Next.js
4000
Zum Portal Core JS 소개
Zum Portal Core JS 소개
줌인터넷 프론트엔드 파트의 표준화 코어 패키지 도입과 분리 과정을 소개했습니다.\nSSR, 캐시, 설정 표준화로 유지보수와 배포 시간을 개선한 내용을 정리했습니다.
#Vue.js#node.js
1100
웹에서 다크모드 지원하기
웹 다크모드는 body 클래스와 CSS variable로 제어하는 방식을 제안했습니다. SSR·CSR 환경의 깜빡임과 웹뷰·구버전 OS 호환성도 함께 고려했습니다.
#CSS#JavaScript
000