2024년 9월에 안정화 버전 및 베타 웹브라우저에 도입된 몇 가지 흥미로운 기능을 살펴보세요.
안정적인 브라우저 출시
2024년 9월에 Firefox 130, Safari 18, Chrome 129가 안정화되었습니다. 이 게시물에서는 웹 플랫폼에 추가된 새로운 기능을 살펴봅니다.
<details>
의 name
속성이 있는 전용 아코디언
Firefox 130은 <details>
요소의 name
속성을 지원합니다. <details>
요소를 그룹화하며, 한 번에 그룹 내 요소를 하나만 열 수 있습니다. 이렇게 하면 JavaScript를 사용하지 않고도 전용 아코디언을 만들 수 있습니다.
Browser Support
자동으로 애니메이션 처리 등
Chrome 129에서는 CSS interpolate-size
속성과 calc-size()
함수를 추가합니다.
CSS interpolate-size
속성을 사용하면 페이지에서 auto
, min-content
, fit-content
와 같은 CSS 고유 크기 조정 키워드의 애니메이션과 전환을 선택할 수 있습니다(해당 키워드에 애니메이션을 적용할 수 있는 경우).
CSS calc-size()
함수는 calc()
와 유사한 CSS 함수이지만 지원되는 크기 조절 키워드 하나에 대한 작업도 지원합니다.
지원되는 크기 조정 키워드는 auto
, min-content
, max-content
, fit-content
입니다.
CSS의 height: auto; 및 기타 고유 크기 키워드에 애니메이션 적용에서 자세히 알아보세요.
JavaScript에서 시간 형식 지정
Chrome 129에는 Intl.DurationFormat
도 있습니다. Intl.DurationFormat
는 '1시간 40분 30초'와 같이 여러 언어를 지원하는 길이 형식 지정 메서드를 제공합니다.
WebCodecs API
이제 Web Codecs API가 Firefox 130의 데스크톱에서 지원되므로 웹 개발자는 동영상 스트림의 개별 프레임과 오디오 청크에 대한 낮은 수준의 액세스 권한을 가질 수 있습니다. 새로운 인터페이스에는 VideoEncoder
, VideoDecoder
, EncodedVideoChunk
, VideoFrame
, VideoColorSpace
가 포함됩니다. 이 API는 아직 Firefox Android에서 지원되지 않으므로 Baseline을 새로 사용할 수 있게 하지는 않지만 Android용 Firefox Nightly는 지원됩니다.
맞춤 속성에 대한 CSS 스타일 쿼리
Safari 18에서는 CSS 스타일 쿼리 등 몇 가지 새로운 기능을 지원합니다. 스타일 쿼리는 재사용 가능한 스타일을 만들고 그룹으로 적용하는 방법을 제공합니다. 예를 들어 여러 변형이 있는 재사용 가능한 구성요소가 있는 경우
CSS 스타일 쿼리에 대해 자세히 알아보세요.
동일한 문서 보기 전환
Safari 18은 SPA의 동일한 문서 뷰 전환도 지원하므로 앱의 여러 상태 간에 시각적 전환을 만들 수 있습니다.
동일한 문서 보기 전환에 대해 자세히 알아보기
베타 브라우저 출시
베타 브라우저 버전에서는 다음번 브라우저의 안정화 버전에 포함될 기능을 미리 볼 수 있습니다. 전 세계에 출시되기 전에 사이트에 영향을 줄 수 있는 새 기능이나 삭제를 테스트해 보세요. 새로운 베타는 Firefox 131, Chrome 130, Safari 18.1입니다. 이번 출시에서는 플랫폼에 여러 가지 멋진 기능이 추가되었습니다. 자세한 내용은 출시 노트를 확인하세요. 몇 가지 주요 내용을 소개합니다.
Firefox 131에는 새로운 JavaScript 반복자 도우미가 포함되어 있으며 이제 Cookies Having Independent Partitioned State (CHIPS)가 사용 설정됩니다.
Chrome 130에는 인라인 단편화 (줄 레이아웃)와 블록 단편화 (인쇄 및 멀티컬럼용으로 생성된 프래그먼트) 모두에 관한 box-decoration-break: clone
지원이 포함되어 있습니다. IndexedDB의 오류 보고도 개선되었으며 웹 시리얼 SerialPort
인터페이스의 새로운 connected
속성도 추가되었습니다.
Safari 18.1은 기존 기능의 버그 수정사항이 포함된 버전입니다.