이 페이지는 Cloud Translation API를 통해 번역되었습니다.

타임라인 이벤트 참조

Meggin Kearney

Flavio Copes

타임라인 이벤트 모드에는 녹화 중에 트리거된 모든 이벤트가 표시됩니다. 타임라인 이벤트 참조를 사용하여 각 타임라인 이벤트 유형에 대해 자세히 알아보세요.

일반적인 타임라인 이벤트 속성

특정 세부정보는 모든 유형의 이벤트에 표시되지만 일부 세부정보는 특정 이벤트 유형에만 적용됩니다. 이 섹션에는 여러 이벤트 유형에 공통적인 속성이 나와 있습니다. 특정 이벤트 유형에 관한 속성은 다음의 해당 이벤트 유형에 관한 참조에 나와 있습니다.

속성	언제 표시되나요?
집계된 시간	중첩된 이벤트가 있는 이벤트의 경우 각 이벤트 카테고리에 걸린 시간입니다.
호출 스택	하위 이벤트가 있는 이벤트의 경우 각 이벤트 카테고리에 걸린 시간입니다.
CPU 시간	기록된 이벤트에 사용된 CPU 시간입니다.
세부정보	이벤트에 관한 기타 세부정보입니다.
기간 (타임스탬프 기준)	모든 하위 요소가 포함된 이벤트가 완료되는 데 걸린 시간입니다. 타임스탬프는 녹화가 시작된 시점과 관련하여 이벤트가 발생한 시간입니다.
자체 시간	하위 요소 없이 이벤트에 걸린 시간입니다.
사용된 힙 크기	이벤트가 기록될 때 애플리케이션에서 사용 중인 메모리 양과 마지막 샘플링 이후 사용된 힙 크기의 델타 (+/-) 변화입니다.

이 섹션에는 로드 카테고리에 속하는 이벤트와 속성이 나와 있습니다.

이벤트	설명
HTML 파싱	Chrome에서 HTML 파싱 알고리즘을 실행했습니다.
로드 완료	네트워크 요청이 완료되었습니다.
데이터 수신	요청에 대한 데이터가 수신되었습니다. Receive Data 이벤트가 하나 이상 있습니다.
응답 수신	요청의 초기 HTTP 응답입니다.
요청 보내기	네트워크 요청이 전송되었습니다.

속성	설명
리소스	요청된 리소스의 URL입니다.
미리보기	요청된 리소스의 미리보기 (이미지만 해당)
요청 메소드	요청에 사용된 HTTP 메서드입니다 (예: GET 또는 POST).
상태 코드	HTTP 응답 코드입니다.
MIME 유형	요청된 리소스의 MIME 유형입니다.
인코딩된 데이터 길이	요청된 리소스의 길이(바이트)입니다.

이 섹션에는 스크립팅 카테고리에 속하는 이벤트와 해당 이벤트의 속성이 나와 있습니다.

이벤트	설명
애니메이션 프레임 실행됨	예약된 애니메이션 프레임이 실행되고 콜백 핸들러가 호출되었습니다.
애니메이션 프레임 취소	예약된 애니메이션 프레임이 취소되었습니다.
GC 이벤트	가비지 컬렉션이 발생했습니다.
DOMContentLoaded	브라우저에서 DOMContentLoaded가 실행되었습니다. 이 이벤트는 페이지의 모든 DOM 콘텐츠가 로드되고 파싱될 때 실행됩니다.
스크립트 평가	스크립트가 평가되었습니다.
이벤트	JavaScript 이벤트(예: 'mousedown' 또는 'key')
함수 호출	최상위 JavaScript 함수 호출이 이루어졌습니다 (브라우저가 JavaScript 엔진에 진입할 때만 표시됨).
타이머 설치	setInterval() 또는 setTimeout()으로 타이머가 생성되었습니다.
애니메이션 프레임 요청	`requestAnimationFrame()` 호출이 새 프레임을 예약함
타이머 삭제	이전에 만든 타이머가 삭제되었습니다.
시간	console.time()이라는 스크립트
종료 시간	console.timeEnd()라는 스크립트
타이머 실행됨	`setInterval()` 또는 `setTimeout()`로 예약된 타이머가 실행되었습니다.
XHR 지원 상태 변경	XMLHTTPRequest의 준비 상태가 변경되었습니다.
XHR 로드	`XMLHTTPRequest` 로드가 완료되었습니다.

이 섹션에는 렌더링 카테고리에 속하는 이벤트와 속성이 나와 있습니다.

이벤트	설명
레이아웃 무효화	DOM 변경으로 인해 페이지 레이아웃이 무효화되었습니다.
레이아웃	페이지 레이아웃이 실행되었습니다.
스타일 다시 계산	Chrome에서 요소 스타일을 다시 계산했습니다.
스크롤	중첩된 뷰의 콘텐츠가 스크롤되었습니다.

속성	설명
레이아웃 무효화됨	Layout 레코드의 경우 레이아웃이 무효화된 원인이 된 코드의 스택 트레이스입니다.
레이아웃이 필요한 노드	Layout 레코드의 경우 재레이아웃이 시작되기 전에 레이아웃이 필요하다고 표시된 노드 수입니다. 일반적으로 개발자 코드에 의해 무효화된 노드와 루트를 다시 레이아웃하는 상위 경로입니다.
레이아웃 트리 크기	Layout 레코드의 경우 리레이아웃 루트 (Chrome에서 리레이아웃을 시작하는 노드) 아래의 총 노드 수입니다.
레이아웃 범위	가능한 값은 '부분적' (재레이아웃 경계가 DOM의 일부임) 또는 '전체 문서'입니다.
영향을 받는 요소	스타일 재계산 레코드의 경우 스타일 재계산의 영향을 받는 요소 수입니다.
스타일 무효화	스타일 재계산 레코드의 경우 스타일 무효화를 일으킨 코드의 스택 트레이스를 제공합니다.

이 섹션에는 그림 카테고리에 속하는 이벤트와 해당 속성이 나와 있습니다.

이벤트	설명
복합 레이어	Chrome의 렌더링 엔진이 이미지 레이어를 합성했습니다.
이미지 디코딩	이미지 리소스가 디코딩되었습니다.
이미지 크기 조절	이미지의 크기가 원래 크기에서 조절되었습니다.
페인트	합성된 레이어가 디스플레이의 영역에 페인팅되었습니다. 페인트 레코드 위로 마우스를 가져가면 업데이트된 디스플레이 영역이 강조표시됩니다.

속성	설명
위치	페인트 이벤트의 경우 페인트 직사각형의 x 및 y 좌표입니다.
측정기준	페인트 이벤트의 경우 페인트된 영역의 높이와 너비입니다.