회고캐시는 빨랐는데 첫 로딩은 왜 느렸을까: Notion 커버를 R2 CDN으로 옮긴 회고
Notion 커버의 첫 로딩 병목을 요청 경로에서 추적하고, Webhook 시점에 WebP로 변환해 Cloudflare R2 CDN으로 옮긴 설계와 운영 검증 과정을 정리했습니다.
- #Next.js
- #Cloudflare
- #Performance
- #Security
- #Kubernetes
- #Operations
Development Log
만들고 운영하며 배운 것
결과만 나열하지 않고 가설, 확인한 증거, 선택과 해결 과정을 남깁니다.
회고
개선 사례Next.js SSR V8 Heap OOM: QueryClient 생명주기와 gcTime 개선 사례
Next.js SSR에서 반복된 V8 heap OOM을 QueryClient 생명주기와 gcTime 관점에서 추적하고, 메모리 사용량을 낮춘 과정을 정리한 사례입니다.
- #Next.js
- #TanStack Query
- #SSR
- #Performance
개선 사례U+모아tv TanStack Query v5 마이그레이션과 iOS 14 WebView 호환성 대응.
U+모아tv의 React Query v3 데이터 계층을 TanStack Query v5로 전환하고, iOS 14 WebView의 최신 문법 호환 문제를 빌드 단계에서 해결한 사례입니다.
- #Next.js
- #TanStack Query
개선 사례U+모바일tv 화면 전환 반복 종료: MobX autorun 메모리 누수 개선.
U+모바일tv WebView에서 화면 전환 반복 시 종료되던 문제를 MobX autorun disposer 누락으로 좁히고 생명주기에 맞게 정리한 사례입니다.
- #Performance
- #Incident
운영 분석운영 Pod 메모리 사용률 80% 원인 분석 회고.
운영 Java Pod의 메모리가 80%까지 상승한 원인을 Datadog JVM 지표, RSS와 cgroup으로 추적해 Heap Committed 확장으로 좁힌 회고입니다.
- #Kubernetes
- #Operations
- #Performance
개선 사례U+tv모바일 홈 성능 개선 및 App Router 마이그레이션.
기존 U+모아tv 홈의 초기 렌더링 병목을 개선하고, 차세대 U+tv모바일의 App Router·SSR·Hydration 구조로 이관한 과정을 정리한 사례입니다.
- #Next.js
- #Performance
- #SSR
- #TanStack Query
회고1편. 집 밖에서 내 서버에 접속하기 — 공유기부터 HTTPS까지!
집 밖에서 홈서버에 접속하기 위해 공유기, DNS, Nginx와 HTTPS 경계를 하나씩 연결하고 검증한 기록입니다.
- #Home Server
- #Security
회고2편. Docker로 직접 운영해보니 — 장애를 계층별로 보기 시작했다.
Docker로 서비스를 직접 운영하며 네트워크, 인증서와 컨테이너 장애를 계층별로 확인하는 습관을 만든 과정입니다.
- #Home Server
- #Docker
- #Operations
회고3편. Docker에서 K3s로 — Kubernetes와 Traefik을 선택한 이유.
Docker에서 사람이 관리하던 실행 상태를 K3s의 Desired State와 Traefik 요청 경로로 옮긴 과정입니다.
- #Docker
- #Kubernetes
- #K3s
- #Traefik
회고4편. 로컬 Docker 이미지에서 GHCR과 GitOps로.
GHCR, GitHub Actions와 Argo CD를 연결해 main push가 K3s RollingUpdate로 이어지는 GitOps 흐름을 만든 기록입니다.
- #GitHub Actions
- #GitOps
- #Argo CD
- #K3s
회고5편. 자동 배포 이후 — Deployment를 운영답게 다듬기.
자동 배포 이후 probe, resource와 RollingUpdate 조건을 점검하며 Deployment를 운영 가능한 상태로 다듬은 기록입니다.
- #Kubernetes
- #K3s
- #Operations
회고6편. Argo CD Web Terminal — 검은 화면의 원인을 RBAC까지 추적하기
Argo CD Web Terminal의 검은 화면을 브라우저 이벤트부터 ServiceAccount와 RBAC 권한까지 추적한 기록입니다.
- #Argo CD
- #RBAC
- #K3s
회고7편. SSH Tunnel을 벗어나기 - Cloudflare Tunnel·Access와 Google SSO
SSH Tunnel 의존을 줄이고 Cloudflare Tunnel, Access와 Google OIDC로 홈서버 관리 화면의 인증 경계를 만든 과정입니다.
- #Cloudflare
- #OIDC
- #Security
회고8편. OOMKilled 이후 - 비정상 프로세스 추적, 보안 패치, 런타임 메모리 관측
반복 재시작의 OOMKilled 기록에서 비정상 프로세스를 찾아내고 Next.js 패치와 새 이미지 배포로 대응한 과정입니다.
- #Kubernetes
- #Next.js
- #Incident
- #Security