다음 사항에 유의하시기 바랍니다.
hwb()색상 표기법을 사용하면 색조, 흰색, 검은색에 따라 색상을 지정하는 새로운 방법을 사용할 수 있습니다.- 가져오기 우선순위를 사용하면 리소스를 다운로드해야 하는 순서를 브라우저에 힌트로 제공할 수 있습니다.
- 이 외에도 다양한 기능이 있습니다.
Chrome 101에서 사용할 수 있는 기능을 살펴보겠습니다.
hwb() 색상 표기법
스테판 주디스의 도움말에서 '사람을 위한 색상 표기법'으로 설명된 hwb()은 색조, 흰색, 검은색에 따라 색상을 지정합니다. 다른 색상 표기법과 마찬가지로 선택적 알파 구성요소는 불투명도를 지정합니다.
h1 {
color: hwb(194 0% 0% / .5) /* #00c3ff with 50% opacity */
}
이제 이 색상 지정 방법이 잘 지원되며, Firefox는 버전 96부터, Safari는 버전 15부터 지원합니다.
가져오기 우선순위
가져오기 우선순위를 사용하면 fetchpriority 속성을 사용하여 리소스를 다운로드해야 하는 순서를 브라우저에 힌트로 제공할 수 있습니다. "high", "low", "auto" 값을 허용합니다.
"high": 리소스가 우선순위가 높다고 생각하며 브라우저의 휴리스틱이 이를 방해하지 않는 한 브라우저가 리소스에 우선순위를 지정하기를 원합니다."low": 리소스의 우선순위가 낮다고 생각하며 휴리스틱이 허용하는 경우 브라우저가 리소스의 우선순위를 낮추기를 원합니다."auto": 브라우저가 적절한 우선순위를 결정하도록 하는 기본값입니다.
아래 예시에서 우선순위가 낮은 이미지는 fetchpriority="low"로 표시됩니다.
<img src="/images/in_viewport_but_not_important.svg" fetchpriority="low" alt="I'm an unimportant image!">
Fetch Priority API로 리소스 로드 최적화에서 다양한 사용 사례에 대해 자세히 알아보세요.
이번 출시에도 포함됨
USBDevice 객체에 새로운 forget() 메서드가 있습니다. 이렇게 하면 이전에 권한이 부여된 기기를 잊을 수 있습니다. 예를 들어 여러 기기가 있는 공유 컴퓨터에서 사용되는 애플리케이션인 경우입니다.
또한 Web USB의 경우 USBDevice 내 관련 속성에 [SameObject] 를 지원하도록 수정했습니다. 사양 변경사항은 초안 사양의 PR에서 확인할 수 있습니다.
보안 (HTTPS) 출처에서 로드되었지만 안전하지 않은 (비HTTPS) 컨텍스트에 의해 인스턴스화된 전용 작업자는 더 이상 안전한 것으로 간주되지 않습니다. 즉, 이러한 작업자 컨텍스트 내에서 다음이 적용됩니다.
- self.isSecureContext가 이제 false입니다.
- self.caches 및 self.storageFoundation을 더 이상 사용할 수 없습니다.
이제 window.open()의 popup 인수가 true로 평가됩니다. 이는 최근에 이 인수를 파싱하는 사양이 변경되었기 때문입니다. 이전에는 popup가 true로 설정된 경우 window.open()가 false를 의미하는 것으로 해석되었습니다. 이번 변경으로 불리언 기능을 더 쉽게 사용하고 이해할 수 있습니다.
추가 자료
여기서는 몇 가지 주요 사항만 다룹니다. 아래 링크에서 Chrome 101의 추가 변경사항을 확인하세요.