안정화 버전 출시일: 2025년 5월 27일
달리 명시되지 않는 한 다음 변경사항은 Android, ChromeOS, Linux, macOS, Windows용 Chrome 137 안정화 버전 채널 출시에 적용됩니다.
CSS 및 UI
CSS if()
함수
CSS if()
함수는 조건부 값을 간결하게 표현하는 방법을 제공합니다. 세미콜론으로 구분된 일련의 조건-값 쌍을 허용합니다. 이 함수는 각 조건을 순차적으로 평가하고 첫 번째 참 조건과 연결된 값을 반환합니다. 조건이 모두 true로 평가되지 않으면 함수는 빈 토큰 스트림을 반환합니다. 이를 통해 복잡한 조건부 로직을 간단하고 간결하게 표현할 수 있습니다.
예:
div {
color: var(--color);
background-color: if(style(--color: white): black; else: white);
}
.dark {
--color: black;
}
.light {
--color: white;
}
<div class="dark">dark</div>
<div class="light">light</div>
버그 추적 #346977961 | ChromeStatus.com 항목 | 사양
CSS reading-flow
, reading-order
속성
reading-flow
CSS 속성은 플렉스, 그리드 또는 블록 레이아웃의 요소가 접근성 도구에 노출되고 탭 키보드 포커스 탐색을 사용하여 포커스가 설정되는 순서를 제어합니다.
reading-order
CSS 속성을 사용하면 작성자가 읽기 흐름 컨테이너 내에서 순서를 수동으로 재정의할 수 있습니다. 기본값이 0
인 정수입니다.
논리적 순차 포커스 탐색에 CSS 읽기 흐름 사용에서 이러한 속성에 대해 자세히 알아보고 예시를 사용해 보세요.
버그 추적 #40932006 | ChromeStatus.com 항목 | 사양
필기체 스크립트의 문자 간격 무시
이 기능은 개발자가 지정한 필기체 스크립트의 글자 간격 설정을 사양에 따라 무시하는 로직을 추가하여 글자 간격이 단어 구조를 방해하지 않도록 하고 필기체 스크립트를 사용하는 사용자에게 더 나은 사용자 환경을 제공하는 것을 목표로 합니다.
이 기능을 사용하면 Chrome에서 글꼴에 고급 서체 기능이 없어도 스크립트가 읽기 쉽고 간격이 적절하게 유지됩니다.
Chromium에서 이 속성이 적용되는 스크립트는 아랍어, Hanifi Rohingya, Mandaic, Mongolian, N'Ko, Phags Pa, Syriac입니다. 이러한 스크립트는 사양에 따라 굴림으로 간주되기 때문입니다.
버그 추적 #40618336 | ChromeStatus.com 항목 | 사양
선택 API getComposedRanges
및 direction
이 기능은 Selection API용 두 가지 새로운 API 메서드를 제공합니다.
Selection.direction
: 선택의 방향을none
,forward
또는backward
로 반환합니다.Selection.getComposedRanges()
: 0 또는 1의 구성된 목록을 반환합니다.StaticRange
컴포지션된 StaticRange
는 그림자 경계를 넘을 수 있지만 일반 Range
는 이를 할 수 없습니다.
예를 들면 다음과 같습니다.
const range = getSelection().getComposedRanges({ shadowRoots: [root] });
선택사항이 shadowRoots
목록에 제공되지 않은 그림자 루트 경계를 지나면 StaticRange
의 엔드포인트가 해당 트리 외부로 범위가 조정됩니다. 이렇게 하면 Chrome에서 알 수 없는 그림자 트리를 노출하지 않습니다.
버그 추적 #40286116 | ChromeStatus.com 항목 | 사양
offset-path: shape()
후원
반응형 도형을 사용하여 애니메이션 경로를 설정할 수 있도록 offset-path: shape()
를 지원합니다.
버그 추적 #389713717 | ChromeStatus.com 항목 | 사양
SVGSVGElement
에서 transform
속성 지원
이 기능을 사용하면 transform
속성을 사용하여 <svg>
루트 요소에 직접 크기 조절, 회전, 변환, 기울이기와 같은 변환 속성을 적용할 수 있습니다. 이 개선사항을 사용하면 전체 SVG 좌표 시스템 또는 콘텐츠를 전체적으로 조작할 수 있으므로 동적, 반응형, 양방향 벡터 그래픽을 더 유연하게 만들 수 있습니다. 이 속성을 지원하면 추가 래퍼 요소나 복잡한 CSS 해결 방법 없이 <svg>
요소를 변환할 수 있으므로 확장 가능하고 애니메이션이 적용된 웹 그래픽을 빌드하는 프로세스를 간소화할 수 있습니다.
버그 추적 #40313130 | ChromeStatus.com 항목 | 사양
accent-color
속성의 시스템 강조 색상
이렇게 하면 양식 요소에 운영체제의 강조 색상을 사용할 수 있습니다. accent-color
CSS 속성을 사용하면 체크박스, 라디오 버튼, 진행률 표시줄과 같은 양식 요소가 사용자의 운영체제에서 정의한 강조 색상을 자동으로 채택하도록 할 수 있습니다. 이 기능은 2021년부터 macOS에서 지원되었으며 이제 Windows 및 ChromeOS에서도 지원됩니다.
버그 추적 #40764875 | ChromeStatus.com 항목 | 사양
<use>
가 프래그먼트를 생략하여 외부 문서의 루트 요소를 참조하도록 허용합니다.
이 기능은 참조 요구사항을 완화하여 SVG <use>
요소를 간소화합니다. Chrome 137 이전에는 SVG 문서 내에서 프래그먼트를 명시적으로 참조해야 했습니다. 프래그먼트 ID가 제공되지 않으면 <use>
가 타겟을 확인할 수 없으며 렌더링되거나 참조되는 항목이 없습니다.
예: 프래그먼트 식별자로 외부 파일을 참조하는 <use>
요소
<svg>
<use xlink:href="myshape.svg#icon"></use>
</svg>
이 예에서 #icon
는 myshape.svg
내에 id="icon"
가 있는 요소를 가리키는 프래그먼트 식별자입니다.
프래그먼트 식별자가 없는 경우:
<svg>
<use xlink:href="myshape.svg"></use>
</svg>
이 기능을 사용하면 프래그먼트를 생략하거나 외부 svg 파일 이름만 지정하면 루트 요소가 자동으로 참조되므로 루트에 ID를 할당하기 위해 참조된 문서를 수정할 필요가 없습니다. 이 개선사항을 통해 수동 수정 프로세스가 간소화되고 효율성이 향상됩니다.
버그 추적 #40362369 | ChromeStatus.com 항목 | 사양
캔버스 부동 소수점 색상 유형
CanvasRenderingContext2D
, OffscreenCanvasRenderingContext2D
, ImageData
에서 8비트 고정 소수점 대신 부동 소수점 픽셀 형식을 사용할 수 있는 기능을 도입합니다.
이는 고정밀 애플리케이션 (예: 의료 시각화), HDR 콘텐츠, 선형 작업 색상 공간에 필요합니다.
버그 추적 #40245602 | ChromeStatus.com 항목 | 사양
view-transition-name: match-element
match-element
값은 요소의 ID를 기반으로 고유 ID를 생성하고 이 요소의 이름을 동일하게 바꿉니다. 이는 요소가 이동 중이고 뷰 전환으로 애니메이션을 적용하려는 단일 페이지 앱 사례에 사용됩니다.
버그 추적 #365997248 | ChromeStatus.com 항목 | 사양
결제
payment
WebAuthn 사용자 인증 정보 생성 시 발생하는 오류 유형 정렬: SecurityError
가 NotAllowedError
로 변경됨
payment
사용자 인증 정보의 WebAuthn 사용자 인증 정보 생성 중에 발생하는 오류 유형을 수정합니다. 이전 사양 불일치로 인해 사용자 활성화 없이 교차 출처 iframe에서 payment
사용자 인증 정보를 만들면 비결제 사용자 인증 정보에 대해 발생하는 NotAllowedError
대신 SecurityError
이 발생합니다.
이는 틈새 변경사항이지만 브레이킹 체인지입니다. 이전에 발생한 오류 유형 (예: e instanceof SecurityError
)을 감지한 코드가 영향을 받습니다.
사용자 인증 정보 생성 중에 일반적으로 오류를 처리하는 코드 (예: catch (e)
)는 계속 올바르게 작동합니다.
버그 추적 #41484826 | ChromeStatus.com 항목 | 사양
Web API
Blob URL 파티셔닝: 가져오기/탐색
저장용량 파티셔닝의 연장으로, Chrome에서는 저장용량 키 (최상위 사이트, 프레임 출처, has-cross-site-ancestor 불리언)별로 Blob URL 액세스의 파티셔닝을 구현합니다. 단, 프레임 출처로만 파티셔닝된 상태로 유지되는 최상위 탐색은 예외입니다. 이 동작은 현재 Firefox와 Safari에서 구현한 것과 유사하며 Blob URL 사용을 저장용량 파티셔닝의 일부로 다른 저장용량 API에서 사용하는 파티셔닝 스키마와 일치시킵니다. 또한 Chrome은 상응하는 사이트가 탐색을 실행하는 최상위 사이트와 크로스 사이트인 Blob URL에 대해 렌더러에서 시작한 최상위 탐색에 noopener를 적용합니다. 이를 통해 Chrome이 Safari의 유사한 동작과 일치하게 됩니다. 관련 사양은 이러한 변경사항을 반영하도록 업데이트되었습니다.
버그 추적 #40057646 | ChromeStatus.com 항목
응답하지 않는 웹페이지의 비정상 종료 보고서에 있는 호출 스택
이 기능은 JavaScript 코드가 무한 루프 또는 기타 매우 긴 계산을 실행하여 웹페이지가 응답하지 않게 되었을 때 JavaScript 호출 스택을 캡처합니다. 이를 통해 개발자는 응답하지 않는 원인을 파악하고 더 쉽게 해결할 수 있습니다. 이유가 응답 없음인 경우 JavaScript 호출 스택이 비정상 종료 보고 API에 포함됩니다.
버그 추적 #1445539 | ChromeStatus.com 항목 | 사양
Document-Isolation-Policy
Document-Isolation-Policy
를 사용하면 문서가 COOP 또는 COEP를 배포하지 않고도 페이지의 crossOriginIsolation
상태와 관계없이 자체적으로 crossOriginIsolation
를 사용 설정할 수 있습니다. 이 정책은 프로세스 격리가 지원합니다. 또한 CORS가 아닌 교차 출처 하위 리소스는 사용자 인증 정보 없이 로드되거나 CORP 헤더가 있어야 합니다.
버그 추적 #333029146 | ChromeStatus.com 항목 | 사양
웹 암호화의 Ed25519
이 기능은 웹 암호화 API에 Curve25519
알고리즘(서명 알고리즘 Ed25519
)에 대한 지원을 추가합니다.
버그 추적 #1370697 | ChromeStatus.com 항목 | 사양
HSTS 추적 방지
HSTS 캐시를 사용하는 서드 파티의 사용자 추적을 완화합니다.
이 기능은 최상위 탐색의 HSTS 업그레이드만 허용하고 하위 리소스 요청의 HSTS 업그레이드는 차단합니다. 이렇게 하면 서드 파티 사이트에서 HSTS 캐시를 사용하여 웹에서 사용자를 추적하는 것이 불가능해집니다.
버그 추적 #40725781 | ChromeStatus.com 항목
WebAssembly
JavaScript Promise 통합
JavaScript Promise Integration (JSPI)은 WebAssembly 애플리케이션이 JavaScript Promises와 통합할 수 있는 API입니다.
이를 통해 WebAssembly 프로그램이 Promise 생성자로 작동하고 WebAssembly 프로그램이 Promise를 포함하는 API와 상호작용할 수 있습니다.
특히 애플리케이션이 JSPI를 사용하여 Promise를 포함하는 (JavaScript) API를 호출하면 WebAssembly 코드가 일시중지되고 WebAssembly 프로그램의 원래 호출자에게 WebAssembly 프로그램이 최종적으로 완료될 때 처리될 Promise가 제공됩니다.
WebAssembly 브랜치 힌트
엔진에 특정 분기 명령이 특정 경로를 사용할 가능성이 매우 높다고 알림으로써 컴파일된 WebAssembly 코드의 성능을 개선합니다.
이를 통해 엔진은 코드 레이아웃 (명령어 캐시 적중 개선) 및 레지스터 할당에 관해 더 나은 결정을 내릴 수 있습니다.
WebGPU
externalTexture
결합의 GPUTextureView
이제 GPUBindGroup
를 만들 때 GPUTextureView
를 externalTexture
바인딩에 사용할 수 있습니다.
버그 추적 #398752857 | ChromeStatus.com 항목 | 사양
copyBufferToBuffer
오버로드
이제 GPUCommandEncoder
copyBufferToBuffer()
메서드에 선택적 오프셋 및 크기 매개변수가 있는 새 오버로드를 사용하여 전체 버퍼를 복사하는 더 간단한 방법이 포함되어 있습니다.
Enterprise
IP 주소 로깅 및 보고
Chrome Enterprise는 보안 모니터링 및 사고 대응 기능을 개선하기 위해 로컬 및 원격 IP 주소를 수집 및 보고하며, 해당 IP 주소를 보안 조사 로그 (SIT)로 전송합니다. 또한 Chrome Enterprise에서는 관리자가 원하는 경우 Chrome Enterprise 보고 커넥터를 통해 퍼스트 파티 및 서드 파티 SIEM 공급업체에 IP 주소를 전송할 수 있습니다.
이 기능은 Chrome Enterprise Core 고객에게 제공됩니다.
오리진 트라이얼
전체 프레임 속도 렌더링 차단 속성
차단 속성에 새 렌더링 차단 토큰 full-frame-rate
를 추가합니다.
full-frame-rate
토큰으로 렌더러가 차단되면 렌더러는 로드에 더 많은 리소스를 예약하기 위해 더 낮은 프레임 속도로 작동합니다.
버그 추적 #397832388 | ChromeStatus.com 항목
렌더링되지 않은 iframe에서 미디어 재생 일시중지
삽입자 웹사이트가 렌더링되지 않은 삽입된 iframe(display
속성이 none
로 설정됨)의 미디어 재생을 일시중지할 수 있도록 하는 media-playback-while-not-rendered
권한 정책을 추가합니다. 이를 통해 개발자는 더 사용자 친화적인 환경을 구축하고 브라우저가 사용자에게 표시되지 않는 콘텐츠 재생을 처리하도록 하여 성능을 개선할 수 있습니다.
시작 버전 체험판 | 버그 추적 #351354996 | ChromeStatus.com 항목
Rewriter API
Rewriter API는 기기 내 AI 언어 모델을 기반으로 요청된 방식으로 입력 텍스트를 변환하고 문구를 바꿉니다. 개발자는 이 API를 사용하여 단어 수 제한에 맞추기 위해 텍스트 내 중복을 삭제하거나, 의도한 대상층에 맞게 메시지를 재구성하거나, 메시지에서 유해한 표현이 발견된 경우 더 건설적인 표현으로 바꾸거나, 게시물이나 기사의 표현을 바꿔 더 간단한 단어와 개념을 사용하도록 할 수 있습니다.
시작 트라이얼 | 버그 추적 #358214322 | ChromeStatus.com 항목 | 사양
Writer API
Writer API는 기기 내 AI 언어 모델을 기반으로 작성 작업 프롬프트를 제공하여 새 자료 작성에 사용할 수 있습니다. 개발자는 이 API를 사용하여 구조화된 데이터에 대한 텍스트 설명을 생성하고, 리뷰 또는 제품 설명을 기반으로 제품에 관한 게시물을 작성하고, 장단점 목록을 전체 보기로 확장하는 등의 작업을 할 수 있습니다.