warn, error, table, time, trace로 메시지 목적을 나눠 기록한다.
디버깅 지도
고급 디버깅 도구 선택
문제가 코드 흐름, 통신, 렌더링, 메모리 중 어디에서 생기는지에 따라 개발자 도구 탭을 바꿔 본다.
브레이크포인트, 조건부 중단, 워치로 실행 흐름과 변수 값을 추적한다.
상태코드, payload, header, timing으로 서버 통신 문제를 확인한다.
긴 작업, 렌더링 비용, 메모리 누수 의심 지점을 타임라인으로 본다.
중단점 위치 판단: 현상을 재현한 뒤 멈출 위치를 먼저 정하면,
console.log를 무작정 늘리지 않아도 원인 후보가 줄어든다.