다음 사항에 유의하시기 바랍니다.
- CSS 앵커 포지셔닝을 사용하면 요소를 앵커링하는 것이 그 어느 때보다 쉬워집니다.
- Compute Pressure API는 사용 가능한 컴퓨터 전력을 최적화하는 데 도움이 됩니다.
- Storage Access API가 쿠키 스토리지 외에도 확장됩니다.
- 그 밖에도 다양한 기능이 있습니다.
저는 아드리아나 자라입니다. Chrome 125에서 개발자를 위해 새로 제공되는 기능을 자세히 살펴보겠습니다.
CSS 앵커 포지셔닝
다른 요소에 고정된 요소를 표시하면 팝오버를 도움말로 사용하고 이를 호출하는 요소에 연결하는 등의 UI 패턴을 만들 수 있습니다.
CSS 앵커 배치를 사용하면 절대적으로 배치된 요소를 선언 방식으로 페이지의 하나 이상의 요소에 연결할 수 있습니다. JavaScript가 필요하지 않으며 앵커를 스크롤할 수 있을 때 성능이 우수합니다.
앵커 포지셔닝 기능은 다수의 CSS 속성으로 구성됩니다. 몇 가지 주요 속성은 다음과 같습니다.
anchor-name
: 요소를 다른 요소의 앵커로 설정합니다.position-anchor
: 고정된 요소가 앵커 위치 지정에 사용해야 하는 '기본' 앵커를 설명합니다.anchor()
함수: 고정된 요소를 배치할 때 앵커 요소의 위치를 나타냅니다.inset-area
: 일반적인 상대적 위치의 경우 배치의 약어입니다.
Compute Pressure API
Compute Pressure API는 시스템의 CPU 부하를 나타내는 대략적인 상태를 제공합니다.
컴퓨터 전력을 균형 있게 사용하도록 최적화할 때 API는 적절한 기본 하드웨어 측정항목을 사용하여 시스템이 관리할 수 없는 스트레스를 받지 않는 한 사용자가 사용 가능한 모든 처리 성능을 활용할 수 있도록 합니다.
Intel은 화상 회의 앱에서 기능과 성능의 균형을 동적으로 맞출 수 있는 이 API의 설계 및 구현 작업을 주도했습니다.
샘플과 자세한 내용은 Compute Pressure API를 참고하세요.
Storage Access API (SAA)가 쿠키 외 스토리지로 확장되었습니다.
Storage Access API는 크로스 사이트 리소스 로드에 종속된 삽입이 필요에 따라 사용자에게 액세스 권한을 요청할 수 있도록 크로스 사이트 쿠키의 대안으로 만들어진 JavaScript API입니다.
이 버전에는 쿠키 외에도 API를 사용할 수 있는 확장 프로그램이 포함되어 있습니다. 이 확장 프로그램을 사용하면 서드 파티 컨텍스트(예: indexedDB 및 localStorage)에서 파티션을 나누지 않은 쿠키 및 비쿠키 저장소에 액세스할 수 있습니다. 다음 코드는 indexedDB에 대한 액세스를 요청하는 예를 보여줍니다.
// Request a new storage handle via rSA (this may prompt the user)
let handle = await document.requestStorageAccess({indexedDB : true});
// Open or create an indexedDB that is shared with the 1P context
let messageDB = handle.indexedDB.open("messages");
그 외에도 다양한 기능 제공
물론 그 외에도 많은 기능이 있습니다.
Device Posture API 및 Viewport Segments Enumeration API의 오리진 트라이얼이 있습니다. 이러한 API는 개발자가 폴더블 기기를 타겟팅하는 데 도움이 되도록 설계되었습니다.
CSS 계단식 값 함수
round()
,mod()
,rem()
를 추가하여 이러한 기능을 기준으로 새로 사용할 수 있도록 했습니다.이제 Shared Storage API에서 iframe을 만들지 않고도 교차 출처 워크렛을 실행할 수 있습니다.
추가 자료
여기에는 일부 주요 내용만 포함되어 있습니다. Chrome 125의 추가 변경사항은 다음 링크를 확인하세요.
- Chrome DevTools의 새로운 기능 (125)
- Chrome 125의 ChromeStatus.com 업데이트
- Chromium 소스 저장소 변경사항 목록
- Chrome 출시 일정
구독
최신 소식을 확인하려면 Chrome 개발자 YouTube 채널을 구독하세요. 새 동영상이 출시될 때마다 이메일 알림을 받게 됩니다.
저는 아드리아나 자라입니다. Chrome 126이 출시되는 대로 Chrome의 새로운 기능을 바로 알려드리겠습니다.