새로운 CSS 색상 유형 및 색상 공간, CSS 삼각 함수 및 View Transitions API
달리 명시되지 않는 한 다음 변경사항은 Android, ChromeOS, Linux, macOS, Windows용 최신 Chrome 베타 채널 출시에 적용됩니다. 제공된 링크 또는 ChromeStatus.com의 목록을 통해 여기에 표시된 기능에 관해 자세히 알아보세요. Chrome 111은 2023년 2월 9일 현재 베타 버전입니다. 데스크톱용 Google.com 또는 Android의 Google Play 스토어에서 최신 앱을 다운로드할 수 있습니다.
CSS
새로운 CSS 색상 유형 및 공백
이제 CSS 색상 수준 4에 설명된 모든 기능이 사용 설정되었습니다. 여기에는 기기에 독립적인 네 가지 색상 유형 (lab, Oklab, lch, Oklch), color() 함수, 그라데이션 및 애니메이션을 위한 사용자 정의 색상 공간이 포함됩니다.
고화질 CSS 색상 가이드를 읽고 새로운 색상 유형과 공간에 관해 알아보세요.
color-mix() 함수
CSS 색상 5의 매우 유용한 color-mix() 함수도 제공됩니다. 이 함수를 사용하면 지원되는 색상 공간에서 한 색상의 비율을 다른 색상에 혼합할 수 있습니다. 다음 예에서는 blue의 10% 를 SRGB의 white로 혼합합니다.
.item {
background-color: color-mix(in srgb, blue 10%, white);
}
CSS 선택자 4 유사 클래스 :nth-child(an + S의 b)
:nth-child(an + b) 및 :nth-last-child()를 확장하여 선택기를 사용합니다. 예를 들어 :nth-child(3 of .c)는 지정된 상위 요소 아래 세 번째 .c입니다. 자세한 내용은 of S 문법을 사용하여 :nth-child() 선택 항목 더 제어하기 게시물을 참고하세요.
CSS 루트 글꼴 단위
루트 글꼴 단위(rex, rch, ric, rlh)를 rem의 기존 루트 글꼴 단위에 추가합니다.
CSS 삼각 함수
삼각 함수 sin(), cos(), tan(), asin(), acos(), atan(), atan2()가 CSS 수학 표현식에 추가되었습니다.
CSS 맞춤 속성의 컨테이너 쿼리 스타일 지정
style() 함수를 @container 규칙에 추가하여 상위 요소의 맞춤 속성 계산된 값을 기반으로 스타일을 적용할 수 있도록 합니다.
baseline-source 속성
baseline-source 속성을 사용하면 웹 개발자는 인라인 수준 상자에서 라인박스 내 정렬을 위해 first 또는 last 기준을 사용해야 하는지 여부를 지정할 수 있습니다.
Web API
window-management 권한 및 권한 정책 문자열
Chrome 111에서는 window-management을 window-placement 권한 및 권한 정책 문자열의 별칭으로 추가합니다. 이는 최종적으로 window-placement를 지원 중단하고 삭제하여 문자열 이름을 바꾸려는 대규모 노력의 일환입니다. 시간이 지남에 따라 Window Management API가 발전하므로 용어를 변경하면 설명어의 수명이 향상됩니다.
Media Session API: 슬라이드 작업 표시
기존 Media Session API에 previousslide 및 nextslide 작업을 추가합니다.
크기 조절 가능한 ArrayBuffer 및 확장 가능한 SharedArrayBuffer
ArrayBuffer 생성자를 확장하여 버퍼의 인플레이스 성장 및 축소를 허용하는 최대 길이를 추가로 취합니다. 마찬가지로 SharedArrayBuffer는 인플레이스(In-Place) 성장을 허용하는 최대 길이를 추가로 취하도록 확장됩니다.
추측 규칙: 리퍼러 정책 키
이렇게 하면 예측 규칙 문법이 확장되어 개발자가 예측 규칙에 의해 트리거된 예측 요청에 사용할 리퍼러 정책을 지정할 수 있습니다. 이를 통해 '충분히 엄격한 리퍼러 정책' 요구사항이 다시 도입됩니다.
선언적 Shadow DOM 스트리밍
이렇게 하면 닫는 템플릿 태그가 아닌 여는 부분에 섀도우 루트를 연결하여 스트리밍 지원을 추가합니다.
Transitions API 보기
뷰의 스냅샷을 생성하고 DOM을 변경하면서 상태 간에 겹치지 않도록 하여 단일 페이지 애플리케이션 (SPA)에서 세련된 전환을 만들 수 있습니다. 뷰 전환을 사용하여 맞춤 전환을 빌드하거나 간단한 크로스페이드 기본값을 사용하여 사용자 환경을 개선합니다.
Chrome 개발자 도움말에서 시작하는 데 도움이 되는 자세한 정보 및 전환 예시를 확인하세요.
WebRTC 확장 가능한 동영상 코딩 확장 프로그램
이 확장 프로그램은 발신 WebRTC 동영상 트랙에서 가능한 SVC (Scalable Video Coding) 구성 중에서 선택하기 위한 표준 방법을 정의합니다.
WebXR enabledFeatures 속성
XRSessionInit에 지정된 대로 이 XRSession에 사용 설정된 기능 집합과 지정된 모드 및 기능의 사양에 필요한 암시적 특성을 반환합니다. 부여된 세션의 경우 여기에는 모든 requiredFeatures가 포함되지만 optionalFeatures의 하위 집합일 수도 있습니다. 대부분의 기능에는 부여 여부를 감지하는 다른 방법이 있습니다. 그러나 일부 기능의 경우 기능이 사용 설정되었는지에 대한 신호는 이전에 사용할 수 없는 데이터가 아니라 현재 사용할 수 없는 기능에 대한 데이터와 밀접한 관련이 있을 수 있습니다. enabledFeatures를 쿼리하여 유용한 힌트 (예: 추적 개선 또는 시작)를 표시해야 하는지 또는 현재 세션에서 기능이 지원되지 않을지 결정할 수 있습니다.
오리진 트라이얼 진행 중
Chrome 111에서는 다음과 같은 새로운 오리진 트라이얼을 선택할 수 있습니다.
Web Payment API에서 connect-src CSP 우회를 삭제하기 위한 체험판 지원 중단
Web Payment API가 매니페스트를 가져올 때 connect-src CSP 정책을 우회하는 기능을 지원 중단합니다. 지원 중단 후에는 사이트의 connect-src CSP 정책에서 PaymentRequest 호출에 지정된 결제 수단 URL과 메서드가 매니페스트를 가져오기 위해 연결하는 다른 모든 URL을 허용해야 합니다.
이 우회 기능은 일시적으로 우회를 다시 사용 설정해야 하는 개발자를 위해 Chrome 111에서 삭제되며, 오리진 트라이얼이 111에서 113으로 변경되었습니다. 이를 사용하려면 connect-src CSP 우회의 역방향 지원 중단 체험판에 등록하세요.
PIP 모드 문서
Document Picture-in-Picture API는 임의의 HTML 콘텐츠로 채울 수 있는 상시 사용 설정 창을 여는 새로운 API입니다. 이는 HTMLVideoElement만 PIP 창에 배치할 수 있게 하는 기존 PIP 모드 API를 확장한 것입니다. 이를 통해 웹 개발자는 사용자에게 더 나은 PIP 환경을 제공할 수 있습니다.
문서 PIP 모드 문서를 읽어보세요.
문서 PIP 모드 오리진 트라이얼에 등록합니다.
지원 중단 및 삭제
이 Chrome 버전에서는 아래에 나열된 지원 중단 및 삭제 기능이 도입됩니다. ChromeStatus.com을 방문하여 예정된 지원 중단, 현재 지원 중단, 이전에 삭제된 앱 목록을 확인하세요.
이번 Chrome 버전에서는 세 가지 기능이 삭제되었습니다.
PaymentInstruments 삭제
PaymentInstruments는 결제 앱의 JIT 이외의 설치를 지원하는 웹 API입니다 (https://w3c.github.io/payment-handler/ 참고). 이는 브라우저가 실제 결제 수단 세부정보를 저장한다는 가정하에 설계되었습니다. 이는 사실이 아닌 것으로 판명되었으며 개인 정보 유출이 있습니다. 또한 다른 브라우저에서는 제공되지 않으며, 다른 브라우저 공급업체에서는 관심을 보이지 않았습니다. 따라서 이 API는 지원 중단 및 삭제되었습니다.
Web Payment API에서 connect-src CSP 우회 삭제
Web Payment API에서 매니페스트를 가져올 때 connect-src CSP 정책을 우회하는 기능이 지원 중단됩니다. 이번 삭제 후 사이트의 connect-src CSP 정책에 따라 PaymentRequest 호출에 지정된 결제 수단 URL과 메서드가 매니페스트를 가져오기 위해 연결하는 다른 모든 URL을 허용해야 합니다.
지원 중단 트라이얼을 선택하여 이번 삭제로 인해 필요한 변경사항을 적용하는 데 더 많은 시간을 할애하는 방법은 오리진 트라이얼 아래의 정보를 참고하세요.
canmakepayment 이벤트의 판매자 ID
canmakepayment 서비스 워커 이벤트는 사용자의 설치된 결제 앱에 사용자의 카드가 있는지 여부를 판매자가 알립니다. 이전에는 판매자의 출처 및 임의의 데이터를 결제 앱 출처에서 서비스 워커로 자동으로 전달했습니다. 이 교차 출처 통신은 JavaScript의 PaymentRequest 생성 시 발생했으며 사용자 동작이 필요하지 않고 사용자 인터페이스를 표시하지 않았습니다. 이 자동 데이터 문구는 canmakepayment 이벤트 및 Android IS_READY_TO_PAY 인텐트에서 삭제되었습니다.