다음 사항에 유의하시기 바랍니다.
- 새로운 표시 영역 크기 단위를 사용하면 적응형 UI를 더 쉽게 만들 수 있습니다.
- 이제 색상 벡터 글꼴에 가변 글꼴 지원이 포함됩니다.
- File System Access API의 일부인
FileSystemSyncAccessHandle
인터페이스의 메서드는 이제 동기식입니다. - 그 밖에도 다양한 기능이 있습니다.
저는 아드리아나 자라입니다. 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 */
자세한 내용은 이 도움말을 참고하세요.
그 외에도 다양한 기능 제공
물론 그 외에도 많은 기능이 있습니다.
- 교체된 요소의
overflow
동작 변경사항이 출시됩니다. - ID 제공업체인 경우 Federated Credential Management API를 확인하세요.
- 이제 워커 컨텍스트에서 Media Source Extensions API를 사용할 수 있습니다.
추가 자료
여기에는 일부 주요 내용만 포함되어 있습니다. Chrome 108의 추가 변경사항은 아래 링크를 확인하세요.
- Chrome DevTools의 새로운 기능 (108)
- Chrome 108 지원 중단 및 삭제
- Chrome 108의 ChromeStatus.com 업데이트
- Chromium 소스 저장소 변경사항 목록
- Chrome 출시 일정
구독
최신 소식을 확인하려면 Chrome 개발자 YouTube 채널을 구독하세요. 새 동영상이 출시될 때마다 이메일 알림을 받게 됩니다.
저는 아드리아나 자라입니다. Chrome 109가 출시되는 대로 Chrome의 새로운 기능을 바로 알려드리겠습니다.