DevTools 출시 노트의 첫 번째 버전에 오신 것을 환영합니다. 이제부터 새 버전의 Chrome을 처음 열면 DevTools가 해당 버전의 출시 노트 링크와 함께 새로운 기능 창을 엽니다.
하이라이트
- 타임라인 패널의 이름이 성능 패널로 변경되었습니다.
- 프로필 패널 이름이 메모리 패널로 변경되었습니다.
- 이제 쿠키 값을 수정할 수 있습니다.
- 이제 메모리 부족 오류가 발생하기 전에 DevTools가 자동으로 일시중지됩니다.
새로운 기능
수정 가능한 쿠키
쿠키 탭의 셀을 더블클릭하여 해당 값을 수정합니다.
도움을 주신 kdzwinel님께 감사드립니다.
Styles 창에서 검사 및 수정 가능한 CSS 변수
이제 Styles 창에서 CSS 변수를 검사하고 수정할 수 있습니다. CSS 변수 데모를 참고하여 직접 사용해 보세요.
메모리 부족 중단점
앱이 짧은 시간에 많은 메모리를 할당하면 이제 DevTools가 자동으로 일시중지하고 힙 한도를 늘립니다. 이를 통해 힙을 검사하고, 콘솔에서 명령어를 실행하여 메모리를 확보하고, 문제를 계속 디버깅할 수 있습니다. 자세한 내용은 Chrome을 위한 하나의 작은 단계, V8을 위한 하나의 거대한 힙을 참고하세요.
캔버스 만들기 중단점
이제 새 캔버스 컨텍스트가 생성될 때마다 트리거되는 이벤트 리스너 중단점을 만들 수 있습니다.
시간 탭의 시작 시간 통계
이제 타이밍 탭 상단에서 요청이 대기열에 추가되고 시작된 시간을 확인할 수 있습니다.
시간 탭의 서버 통계
이제 시간 탭에 맞춤 서버 통계를 삽입할 수 있습니다. 예는 서버 타이밍 값의 데모를 참고하세요.
참여해 주신 sroussey님에게 감사드립니다.
변경사항
타임라인 패널이 성능 패널로 변경되었습니다.
목적을 더 잘 반영하기 위해 타임라인 패널의 이름이 성능 패널로 변경되었습니다.
프로필 패널이 '메모리' 패널로 변경되었습니다.
그 목적을 더 잘 반영하기 위해 프로필 패널 이름이 메모리 패널로 변경되었습니다.
CPU 프로파일러가 숨겨진 패널 뒤에 있음
이제 프로필 패널을 메모리 패널이라고 하므로 CPU 프로파일러를 더 이상 이 패널에 포함하는 것은 의미가 없습니다. 또한 장기적인 목표는 성능 패널에서 모든 사용자 프로파일링을 가져오는 것입니다. 그때까지는 설정 > 도구 더보기 > 자바스크립트 프로파일러에서 이전 CPU 프로파일러에 계속 액세스할 수 있습니다.
성능 패널에서 CPU를 프로파일링하는 방법은 Chrome DevTools: Chrome 58에서 자바스크립트 CPU 프로파일링을 참고하세요.
새 콘솔 UI
Console 패널과 창의 UI가 변경되었습니다. 일부 인기 없는 기능은 더 숨겨진 위치로 이동했으며, 인기 있는 기능에 더 쉽게 액세스할 수 있습니다.
- Console 설정
을 클릭하여 Console의 동작을 맞춤설정하는 설정에 액세스합니다. - 이제 콘솔 설정에서 로그 보존이 숨겨집니다.
- Filters 버튼과 창이 사라졌습니다. 대신 드롭다운 메뉴를 사용하세요.
- 이제 로그 필터링을 위한 텍스트 상자가 항상 표시됩니다. 이전에는 필터 창에서 숨겨졌습니다.
- 필터링 텍스트 상자에서 정규식을 자동으로 허용하므로 Regex 체크박스가 사라집니다.
- 위반사항 숨기기 체크박스가 사라졌습니다. 위반을 확인하려면 로깅 수준 드롭다운을 상세로 설정합니다.
- 이전 UI에서 모든 메시지 표시 체크박스를 선택 해제하는 것은 새 UI의 콘솔 설정에서 선택된 컨텍스트만 체크박스를 선택하는 것과 같습니다.
WebGL 이벤트 리스너 중단점 이동
WebGL 이벤트 리스너 중단점이 WebGL 카테고리에서 Canvas 카테고리로 이동했습니다. WebGL 카테고리가 삭제되었습니다.