Chrome 151의 새로운 기능

Rachel Andrew

게시일: 2026년 7월 28일

Chrome 151이 현재 출시되고 있으며 이 게시물에서는 출시의 주요 기능을 공유합니다. Chrome 151 출시 노트를 모두 읽어보세요.

이번 출시의 주요 내용은 다음과 같습니다.

기능 요소: <usermedia> MVP

<usermedia> 요소는 <geolocation>에 이어 기능 요소 모음에서 출시되는 최신 요소입니다. PEPC 이니셔티브의 일부인 원래 <permission> 제안에서 이 전환을 통해 브라우저는 다양한 하드웨어 기능의 고유한 복잡성과 동작을 보다 효과적으로 처리할 수 있습니다. 초기 제안은 주로 허용과 거부와 같은 권한 상태 관리에 중점을 두었지만 기능 요소는 데이터 중재자 역할을 합니다.

<geolocation> 요소는 사이트에 위치 객체를 제공하고 <usermedia>는 카메라 및 마이크 액세스의 전체 흐름을 관리합니다. 사용자 의도를 캡처하고 브라우저 프롬프트를 관리하며 애플리케이션에 MediaStream 객체를 제공합니다. 이러한 전환을 통해 별도의 getUserMedia() 호출이 필요하지 않으며 구현이 간소화되고 브라우저가 사용자 의도에 대한 신뢰할 수 있는 신호를 갖게 됩니다.

<usermedia> HTML 요소 소개에서 자세히 알아보세요.

선언적 섀도우 DOM: shadowrootslotassignment 속성

Chrome 151에서는 shadowrootslotassignment 속성을 <template> 요소에 지원을 추가합니다. 이를 통해 HTML에서 직접 수동 슬롯 할당을 사용하는 선언적 섀도우 루트를 빌드할 수 있습니다.

지금까지 수동 슬롯 할당은 필수적으로만 사용할 수 있었습니다. 이 업데이트를 사용하면 섀도우 루트 템플릿에서 shadowrootslotassignment="manual"을 지정할 수 있습니다.

이 속성은 named (기본 동작) 및 manual을 허용하며 HTMLTemplateElement의 shadowRootSlotAssignment 속성에 반영됩니다. 자세한 내용은 MDN의 HTMLTemplateElement.shadowRootSlotAssignment 문서를 참고하세요.

이 속성은 이미 Firefox 및 Safari 27 베타에서 사용할 수 있으므로 곧 Baseline Newly available이 될 예정입니다.

소프트 탐색 및 상호작용 성능 측정항목

Chrome 151은 두 가지 새로운 PerformanceEntry 유형(soft-navigation 및 interaction-contentful-paint)을 도입하여 웹 성능 타임라인을 확장합니다. 이러한 항목은 개발자가 최대 콘텐츠 페인트 (LCP) 및 다음 페인트에 대한 상호작용 (INP)과 같은 기존 Core Web Vitals 측정항목을 기반으로 단일 페이지 애플리케이션 (SPA)에서 상호작용으로 인한 성능과 지연 시간을 추적하는 데 도움이 됩니다.

SPA에서 JavaScript 기반 경로 전환은 기존 브라우저 페이지 로드를 트리거하지 않습니다. soft-navigation 항목은 사용자 상호작용으로 시작된 이러한 동일한 문서 기록 상태 변경을 캡처합니다. 소프트 탐색이 발생하면 브라우저가 새 시간 원점을 설정하므로 후속 실적 데이터를 초기 문서 URL이 아닌 활성 SPA 경로에 정확하게 귀속시킬 수 있습니다.

interaction-contentful-paint 항목은 사용자 상호작용으로 수정된 DOM 영역 내에서 새로운 콘텐츠 페인트를 측정합니다. 이렇게 하면 콘텐츠 업데이트가 fetch() 요청과 같은 비동기 작업에 의존하는 경우에도 상호작용 로드 지연 시간을 파악할 수 있습니다.

PerformanceObserver를 사용하여 애플리케이션에서 이러한 새 항목을 관찰할 수 있습니다. 다음은 버퍼링된 옵션을 사용하여 이 페이지의 이전 소프트 탐색을 포함하여 소프트 탐색 항목을 콘솔에 로깅하는 코드 스니펫입니다.

const observer = new PerformanceObserver(console.log);
observer.observe({ type: "soft-navigation", buffered: true });

SPA 탐색 구현 및 측정에 관한 자세한 내용은 Chrome for Developers의 소프트 탐색 문서를 참고하세요.

추가 자료

여기에서는 몇 가지 주요 내용만 다룹니다. Chrome 151의 추가 변경사항은 다음 링크를 참고하세요.

구독

최신 소식을 확인하려면 Chrome Developers YouTube 채널을 구독하세요. 새 동영상이 출시될 때마다 이메일 알림을 받게 됩니다. 또는 X 또는 LinkedIn에서 새로운 기사와 블로그 게시물을 팔로우하세요.

Chrome 152가 출시되는 즉시 Chrome의 새로운 기능을 알려드리겠습니다.