2024년 10월에 안정화 버전 및 베타 웹브라우저에 도입된 몇 가지 흥미로운 기능을 살펴보세요.
안정적인 브라우저 출시
2024년 10월에 Firefox 131, Firefox 132, Safari 18.1, Chrome 130이 안정화되었습니다. 이 게시물에서는 웹 플랫폼에 추가된 새로운 기능을 살펴봅니다.
동기식 반복자 도우미
Firefox 131에서는 동기식 반복자 도우미 지원을 추가합니다. 예를 들어 Iterator.prototype.forEach() 및 Iterator.prototype.map()이 있습니다. 이러한 도우미를 사용하면 중간 배열 객체를 만들지 않고도 반복자에 배열과 유사한 작업을 실행할 수 있습니다. 여기에는 중간 배열을 만들 수 없는 매우 큰 데이터 세트도 포함됩니다.
텍스트 프래그먼트
Firefox 131에서는 CSS ::target-text
가상 요소와 함께 텍스트 프래그먼트도 지원됩니다.
Cookies Having Independent Partitioned State(CHIPS)
Firefox 131에는 Set-Cookie
HTTP 헤더의 partitioned
디렉티브를 사용하여 쿠키를 파티션된 저장소로 선택할 수 있는 CHIPS가 포함되어 있습니다.
미디어 업데이트
10월에 출시되는 두 번째 Firefox 버전에는 Newly 사용 가능한 기준과 결합된 일련의 미디어 기능이 포함되어 있습니다.
Firefox 132에는 HTMLVideoElement
의 requestVideoFrameCallback()
및 cancelVideoFrameCallback()
메서드가 포함되어 있습니다.
MediaStreamTrack.getCapabilities()
메서드도 포함되어 있습니다.
fetchPriority
Fetch Priority API는 브라우저에 대한 리소스의 상대적 우선순위를 나타냅니다. Firefox 132부터 지원됩니다. 즉, 이 유용한 API는 이제 Baseline Newly API입니다.
Fetch Priority API로 리소스 로드 최적화에서 자세히 알아보세요.
box-decoration-break
완전 지원
Chrome 130에는 접두사가 없는 CSS box-decoration-break
속성의 전체 지원이 포함되어 있습니다. 여기에는 블록 및 인라인 단편화의 clone
값이 포함됩니다.
이 속성에 관한 자세한 내용은 Chrome 130의box-decoration-break 속성을 참고하세요.
중첩 선언 규칙
Chrome 130 및 Firefox 132는 CSS 중첩 선언을 지원합니다. 즉, CSSNestedDeclarations
로 CSS 중첩이 개선되는 데 설명된 대로 중첩된 CSS가 올바르게 파싱됩니다.
브라우저 지원
웹 직렬 connected
속성 및 RFCOMM 연결 이벤트
Chrome 130에서는 불리언 SerialPort.connected
속성을 추가합니다.
이 속성은 직렬 포트가 논리적으로 연결된 경우 true를 반환합니다.
이 기능을 사용하면 블루투스 RFCOMM 직렬 포트는 포트가 논리적으로 연결되거나 연결 해제될 때 이러한 이벤트를 전달합니다.
이 기능은 애플리케이션이 포트를 열지 않고도 블루투스 RFCOMM 직렬 포트를 사용할 수 있는 시점을 감지할 수 있도록 지원하기 위한 것입니다.
웹 일련번호의 블루투스 RFCOMM 업데이트에서 자세히 알아보세요.
브라우저 지원
Safari의 접근성 수정사항
Safari 18.1은 Safari 18 직후에 출시되며 display: contents
와 관련된 여러 접근성 문제를 수정합니다.
베타 브라우저 출시
베타 브라우저 버전에서는 다음번 브라우저의 안정화 버전에 포함될 기능을 미리 볼 수 있습니다. 이 버전이 출시되기 전에 사이트에 영향을 미칠 수 있는 새로운 기능이나 삭제 기능을 테스트할 수 있는 좋은 시기입니다. 새로운 베타는 Firefox 133 및 Chrome 131입니다. 이러한 릴리스는 플랫폼에 많은 훌륭한 기능을 제공합니다. 자세한 내용은 출시 노트를 확인하세요. 다음은 몇 가지 중요한 사항입니다.
Firefox 133은 WebCodecs API의 ImageDecoder
, ImageTrackList
, ImageTrack
인터페이스를 지원하여 기본 스레드와 작업자 스레드에서 이미지 디코딩을 지원합니다.
Firefox 133은 WorkerNavigator.permissions
도 지원합니다.
Chrome 131에는 ::selection
및 ::highlight
와 같은 CSS 강조 표시 의사 클래스가 요소 체인이 아닌 의사 강조 표시 체인을 통해 속성을 상속하는 CSS 강조 표시 상속이 포함되어 있습니다.
그 결과 강조 표시의 속성 상속을 위한 더 직관적인 모델이 생성됩니다.
또한 Chrome 131에서는 CSS 페이지 매김 미디어 @page
여백 상자를 지원하므로 웹에서 인쇄할 때 맞춤 헤더와 바닥글을 제공할 수 있습니다.