2025년 1월에 안정화 버전 및 베타 웹브라우저에 도입된 몇 가지 흥미로운 기능을 살펴보세요.
게시일: 2025년 1월 29일
안정적인 브라우저 출시
2025년 1월에 Firefox 134, Safari 18.3, Chrome 132가 안정화되었습니다. 이 게시물에서는 웹 플랫폼에 추가된 새로운 기능을 살펴봅니다.
Promise.try
가 이제 기준점으로 새로 제공됩니다.
Promise.try
는 동기식 콜백 함수의 오류 처리를 더 쉽게 만들어 주는 편의 메서드입니다. Firefox 134부터 사용할 수 있으므로 새로운 기준으로 사용할 수 있습니다. Promise.try
에 새로운 기준이 출시됨에서 자세히 알아보세요.
절대 위치로 배치된 요소의 CSS 정렬 속성
또한 Firefox 134에서는 절대 위치 지정된 요소에 place-self
CSS 축약 속성과 함께 align-self
및 justify-self
CSS 속성이 지원됩니다.
Browser Support
CSS 측면 쓰기 모드
writing-mode
CSS 속성에 대한 sideways-rl
및 sideways-lr
키워드 지원이 Chrome 132에 추가되었습니다. sideways-rl
및 sideways-lr
는 디자인 목적으로 세로 텍스트를 표시하려는 경우 CJK 외 텍스트를 세로로 쓰는 데 유용합니다.
Browser Support
팝오버의 모바일 지원 수정
Safari 18.3은 다양한 상호 운용성 문제를 해결하는 버전입니다. 팝오버 수정이 핵심 문제입니다. 이전에는 iOS 및 iPadOS에서 팝오버 외부를 터치하거나 클릭해도 팝오버가 닫히지 않았습니다. 이제 이 문제를 해결했습니다.
Request.bytes()
및 Response.bytes()
: 새로 구매 가능 기준
Chrome 132에서는 Fetch의 Request
및 Response
인터페이스에 Uint8Array
로 확인되는 프로미스를 반환하는 bytes()
메서드를 추가합니다.
Request
및 Response
에는 arrayBuffer()
메서드가 있지만 버퍼에서 직접 읽을 수는 없습니다.
이를 읽으려면 Uint8Array
와 같은 뷰를 만들어야 합니다.
bytes()
메서드는 Request
및 Response
의 본문을 가져오는 작업의 인체공학을 개선합니다.
Device Posture API
Chrome 132에는 폴더블 화면을 설계할 때 도움이 되도록 설계된 Device Posture API가 포함되어 있습니다.
이 구현에는 기기의 현재 상태를 감지하는 데 사용할 수 있는 새로운 device-posture
CSS 미디어 기능이 포함되어 있습니다. 또한 자세의 변화를 감지하고 이에 반응하는 JavaScript 인터페이스도 포함되어 있습니다.
자세는 다음과 같이 정의됩니다.
continuous
: 평면 화면을 나타냅니다. 여기에는 폴더블 기기가 평면으로 사용되는 동안, 그리고 평면 또는 곡면 화면이 포함될 수 있습니다.folded
: 접힌 화면을 나타냅니다. 여기에는 책이나 노트북 모드에서 사용 중인 폴더블 기기가 포함될 수 있습니다.
Browser Support
WebAuthn Signal API
Chrome 132에는 WebAuthn 신뢰 당사자가 기존 사용자 인증 정보에 관한 정보를 사용자 인증 정보 저장소 제공업체에 다시 전달할 수 있는 WebAuthn Signal API도 포함되어 있습니다. 따라서 잘못되거나 취소된 사용자 인증 정보를 제공업체 및 시스템 UI에서 업데이트하거나 삭제할 수 있습니다.
Chrome 데스크톱의 패스키용 Signal API에 관해 자세히 알아보세요.
베타 브라우저 출시
베타 브라우저 버전에서는 다음번 브라우저의 안정화 버전에 포함될 기능을 미리 볼 수 있습니다. 전 세계에 출시되기 전에 사이트에 영향을 줄 수 있는 새 기능 또는 삭제를 테스트해 보세요. 새로운 베타는 Firefox 135 및 Chrome 133입니다. 이번 출시에서는 플랫폼에 여러 가지 멋진 기능이 추가되었습니다. 자세한 내용은 출시 노트를 확인하세요. 몇 가지 주요 내용을 소개합니다.
Chrome 133은 CSS에 있어 흥미로운 버전입니다. 여기에는 고급 attr()
함수, 스크롤 상태 컨테이너 쿼리, CSS text-box
, text-box-trim
, text-box-edge
가 포함됩니다.
Chrome 133에는 FileSystemObserver
인터페이스와 요소의 상태를 재설정하지 않고도 DOM 트리에서 요소를 이동할 수 있는 DOM 원시 (Node.prototype.moveBefore
)도 포함되어 있습니다.
Firefox 135에는 JavaScript 값과 JSON 텍스트 간에 큰 부동 소수점 수 및 날짜 값과 같은 값을 변환할 때 정밀도 손실과 관련된 문제를 완화하는 기능을 제공하는 것을 목표로 하는 소스 제안이 포함된 JSON 파싱이 포함되어 있습니다.