프로그램 / 렌더링 병목 진단 세션
렌더링 병목 진단 세션
INP와 메인 스레드 긴 작업을 연결해, 이벤트 핸들러와 레이아웃 스래싱을 분리합니다.
- 시간
- 1일
- 형식
- 진단 세션
- 가격
- KRW 490,000
- 난이도
- 중급
프로그램 소개
프로파일링 스냅샷을 읽는 속도를 높이고, 상태 관리·메모이제이션·리스트 가상화 중 무엇이 체감에 도움이 되는지 판별합니다.
포함 내용
- Performance 패널 타임라인 해석
- 긴 작업 분할 패턴
- 리스트 렌더링 실험
- 스케줄링 우선순위 점검
기대할 수 있는 변화
- 핫 스팟 컴포넌트를 식별합니다.
- 이벤트 처리 예산을 정의합니다.
- 회귀 테스트 시나리오를 만듭니다.
담당 코치
정민재
실서비스 트래픽 패턴을 기준으로 성능 병목을 분해하고, 측정 가능한 개선안으로 정리합니다.
FAQ
React만 지원하나요?
예제는 React 중심이나 패턴은 프레임워크 중립적으로 설명합니다.
모바일 웹도 포함되나요?
디바이스 스로틀을 걸고 동일한 방법으로 봅니다.
애니메이션 최적화까지 다루나요?
기본적인 composite 레이어 점검만 포함되며, 모션 디자인 전반은 범위 밖입니다.
후기
-
스크롤 핸들러에서 잡히던 긴 작업을 분할하니 INP가 안정됐습니다.