Chrome 137의 새로운 기능

Rachel Andrew

게시일: 2025년 5월 27일

Chrome 137이 출시되고 있습니다. 이 게시물에서는 이번 출시의 주요 기능을 몇 가지 소개합니다. 전체 Chrome 137 출시 노트를 읽어 보세요.

이번 출시의 하이라이트는 다음과 같습니다.

reading-flow 및 reading-order를 사용하여 복잡한 레이아웃을 통해 논리적인 탭 순서를 지정합니다. CSS if() 함수는 조건부 값을 간결하게 표현하는 방법을 제공합니다. JavaScript Promise Integration(JSPI)을 사용하면 WebAssembly 애플리케이션을 JavaScript Promise와 통합할 수 있습니다.

CSS reading-flow 및 reading-order

reading-flow CSS 속성은 플렉스, 그리드 또는 블록 레이아웃의 요소가 접근성 도구에 노출되는 순서와 선형 순차 탐색 메서드를 사용하여 포커스를 얻는 방식을 제어합니다. 이렇게 하면 탭 순서가 항목이 배치된 순서와 연결 해제될 수 있는 그리드 및 플렉스 레이아웃의 오랜 문제가 해결됩니다.

키워드 값을 하나 사용하며 기본값은 normal입니다. 이 값은 DOM 순서로 요소를 정렬하는 동작을 유지합니다. 플렉스 컨테이너 내에서 사용하려면 값을 flex-visual 또는 flex-flow로 설정하세요. 그리드 컨테이너 내에서 사용하려면 값을 grid-rows, grid-columns 또는 grid-order로 설정합니다.

reading-order CSS 속성을 사용하면 읽기 흐름 컨테이너 내 항목의 순서를 수동으로 재정의할 수 있습니다. 그리드, 플렉스 또는 블록 컨테이너 내에서 이 속성을 사용하려면 컨테이너의 reading-flow 값을 source-order로 설정하고 개별 항목의 reading-order를 정수 값으로 설정합니다.

자세한 내용은 논리적 순차 포커스 탐색에 CSS reading-flow 사용을 참고하세요.

CSS if() 함수

CSS if() 함수는 조건부 값을 간결하게 표현하는 방법을 제공합니다. 세미콜론으로 구분된 일련의 조건-값 쌍을 허용합니다. 이 함수는 각 조건을 순차적으로 평가하고 첫 번째 참 조건과 연결된 값을 반환합니다. 조건이 모두 true로 평가되지 않으면 함수는 빈 토큰 스트림을 반환합니다.

div {
  color: var(--color);
  background-color: if(style(--color: white): black; else: white);
}

.dark {
  --color: black;
}

.light {
  --color: white;
}

<div class="dark">dark</div>
<div class="light">light</div>

WebAssembly JavaScript Promise 통합 (JSPI)

JavaScript Promise Integration (JSPI)은 WebAssembly 애플리케이션을 JavaScript Promise와 통합할 수 있는 API입니다.

이를 통해 WebAssembly 프로그램이 약속 생성자로 작동하고 WebAssembly 프로그램이 약속을 포함하는 API와 상호작용할 수 있습니다.

특히 애플리케이션이 JSPI를 사용하여 약속을 보유한 (JavaScript) API를 호출하면 WebAssembly 코드가 일시중지되고 WebAssembly 프로그램의 원래 호출자에게 WebAssembly 프로그램이 최종적으로 완료될 때 실행될 약속이 제공됩니다.

그 외에도 다양한 기능 제공

물론 그 외에도 많은 기능이 있습니다.

  • 저장용량 파티셔닝의 연장으로, Chrome은 저장용량 키별로 Blob URL 액세스의 파티셔닝을 구현했습니다.
  • 이제 캔버스 부동 소수점 픽셀 형식이 구현되었습니다.
  • offset-path: shape()가 지원되므로 반응형 도형을 사용하여 애니메이션 경로를 설정할 수 있습니다.

추가 자료

여기에는 일부 주요 내용만 포함되어 있습니다. Chrome 137의 추가 변경사항은 다음 링크를 참고하세요.

구독

최신 소식을 확인하려면 Chrome 개발자 YouTube 채널을 구독하세요. 새 동영상이 출시될 때마다 이메일 알림을 받게 됩니다. 또는 X 또는 LinkedIn에서 저희를 팔로우하여 새로운 도움말과 블로그 게시물을 확인하세요.

Chrome 138이 출시되는 대로 Chrome의 새로운 기능을 알려드리겠습니다.