Chrome 108의 새로운 기능

Adriana Jara

다음 사항에 유의하시기 바랍니다.

저는 아드리아나 자라입니다. 이제 Chrome 108의 개발자를 위한 새로운 기능을 살펴보겠습니다.

새로운 표시 영역 크기 단위

새 표시 영역 단위를 사용하면 적응형 UI를 만드는 데 더 많은 제어 기능을 사용할 수 있습니다.

이러한 광고 단위는 브라우저에서 펼치거나 접을 수 있는 UI 요소를 고려하므로 표시 영역 영역을 다르게 측정합니다. 예: 주소 표시줄

large 단위는 이러한 사용자 에이전트 인터페이스가 접혀 있다고 가정하고 표시 영역 크기를 제공합니다.

반면에 small 단위는 인터페이스가 확장되었다는 가정 하에 표시 영역 크기를 제공합니다.

dynamic 단위를 사용하면 브라우저 인터페이스 요소의 표시 여부에 따라 표시 영역 크기가 자동으로 조정됩니다.

값은 대형 단위 (최대) 및 작은 단위 (최소)의 한도 이내입니다.

각 표시 영역 단위 유형에 대한 표시 영역의 다양한 부분.

자세한 내용은 이 도움말을 참고하세요. Android 표시 영역 크기 조절 동작의 변경사항을 확인하여 표시 영역을 적절하게 처리합니다 .

이제 COLRv1에서 가변 글꼴이 지원됩니다.

COLRv1 컬러 벡터 글꼴은 Chrome 98부터 지원되었지만 초기 출시에서는 COLRv1 테이블의 정적 기능만 지원되었습니다.

하지만 COLRv1 사양에는 OpenType 변형도 포함되어 있습니다. 즉, 변수 축 값을 변경하여 글꼴 속성을 변경할 수 있습니다. 이제 이러한 변형이 지원됩니다.

이 출시 버전에는 CSS @supports에 대한 font-tech() 및 font-format() 조건 확장도 포함되어 있습니다 .

이러한 조건을 사용하면 개발자는 글꼴 기능을 사용할 수 있는 시점을 감지하여 사용자에게 최신 환경을 제공하고 지원을 사용할 수 없는 경우 대체를 생성할 수도 있습니다.

여기에서 데모를 실행해 보고 가변 글꼴로 말에 영향력을 더해 보세요.

이제 FileSystemSyncAccessHandle 메서드가 동기식입니다.

원본 비공개 파일 시스템은 성능에 고도로 최적화된 특별한 종류의 파일에 대한 액세스를 제공합니다. 개발자는 FileSystemFileHandle 객체에 노출되는 메서드인 createSyncAccessHandle()를 호출하여 이러한 파일에 액세스할 수 있습니다.

이 호출은 FileSystemSyncAccessHandle이 발생합니다.

이러한 액세스 핸들에 있는 메서드 truncate(newSize), getSize(), flush(), close()는 비동기식이었지만 Chrome 108부터는 동기식입니다.

이러한 변경에는 타당한 이유가 있습니다. 이는 FileSystemSyncAccessHandle가 Wasm 기반 애플리케이션이 기대하는 POSIX 형식의 동기식 파일 API와 일치하므로, API를 더 인체공학적으로 만드는 동시에 상당한 성능 향상을 가져옵니다.

이는 브레이킹 체인지일 가능성이 있습니다. 위의 메서드를 사용하는 경우 Promise.then() 사용이 중단됩니다. 이전의 비동기식이면서 지금은 동기식 메서드의 결과에 관해 then() 호출을 체이닝하는 경우 코드를 변경해야 합니다.

// ⛔️ This will break, and you need to restructure your code:
accessHandle.flush().then(/* Follow-up code */);
// ✅ Correct:
accessHandle.flush();
/* Follow-up code */

자세한 안내는 이 도움말을 참고하세요.

그 외에도 다양한 기능 제공

물론 더 많은 기능이 있습니다.

추가 자료

여기에서는 몇 가지 주요 사항만 다룹니다. 아래 링크에서 Chrome 108의 추가 변경사항을 확인하세요.

구독

최신 소식을 확인하려면 Chrome 개발자 YouTube 채널을 구독하세요. 그러면 새 동영상이 출시될 때마다 이메일 알림을 받게 됩니다.

저는 아드리아나 자라입니다. Chrome 109가 출시되면 그 즉시 Chrome의 새로운 기능을 알려드리겠습니다.