# Safari 18 베타에 포함된 WebKit 신기능들

> Clean Markdown view of GeekNews topic #15368. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=15368](https://news.hada.io/topic?id=15368)
- GeekNews Markdown: [https://news.hada.io/topic/15368.md](https://news.hada.io/topic/15368.md)
- Type: news
- Author: [xguru](https://news.hada.io/@xguru)
- Published: 2024-06-16T10:02:02+09:00
- Updated: 2024-06-16T10:02:02+09:00
- Original source: [webkit.org](https://webkit.org/blog/15443/news-from-wwdc24-webkit-in-safari-18-beta/)
- Points: 4
- Comments: 0

## Topic Body

#### WebXR 지원 추가  
- visionOS 2 beta의 Safari 18에서 WebXR을 지원함. Apple Vision Pro를 사용하는 사람들에게 몰입형 경험 제공 가능함.  
- `immersive-vr` 세션 지원  
- WebGL을 통한 하드웨어 가속 그래픽 사용  
- 자연 입력을 활용한 `transient-pointer` 모드 지원  
- 손 추적 기능 추가, 사용자 프라이버시 보호를 위한 권한 요청 필요  
  
#### CSS  
- **뷰 전환 (View Transitions)**:  
  - 뷰 전환 API 지원 추가  
  - 요소의 상태 전환 애니메이션 가능  
  - `document.startViewTransition()` 메서드로 전환 시작  
  - 상태 캡처 후 CSS로 애니메이션 수정 가능  
- **스타일 쿼리 (Style Queries)**:  
  - CSS 커스텀 프로퍼티 테스트 시 스타일 쿼리 지원  
  - 특정 조건에 따라 스타일 적용 가능  
- **상대적 색상 구문 (Relative Color Syntax)**:  
  - 기존 색상으로부터 새로운 색상을 동적으로 정의  
  - `currentcolor` 및 시스템 색상 키워드 참조 가능  
- **디스플레이 애니메이션**: `display` 속성의 전환 애니메이션 지원  
- **visionOS에서의 인터랙션 영역**: `clip-path`를 사용하여 링크의 터치 가능한 영역 변경 가능  
- **백드롭 필터**: 요소 뒤의 콘텐츠에 그래픽 효과 적용. 이제 -webkit- 접두사 없이 사용 가능  
- **Flexbox의 안전 키워드**: `safe` 키워드를 사용하여 플렉스 아이템의 오버플로우 처리  
- **콘텐츠 가시성**: `content-visibility` 속성으로 성능 최적화  
  
#### 웹 앱 (Web Apps for Mac)  
- 웹 앱에서 링크 열기 지원  
- Safari 웹 확장 및 콘텐츠 차단기를 통한 개인 맞춤화 가능  
  
#### Safari 확장 프로그램 (Safari Extensions)  
- **모바일 장치 관리**: 확장 프로그램 활성 상태, 비공개 브라우징 상태, 웹사이트 접근을 관리 가능  
  
#### 공간 미디어 (Spatial Media)  
  
- **사진 및 파노라마**:  
  - 공간 사진 및 파노라마를 웹에서 전체 화면으로 볼 수 있음  
  - Fullscreen API를 통해 몰입형 경험 제공  
  
#### HTML  
- **글쓰기 제안**:  
  - 인라인 예측 텍스트 지원  
  - `writingsuggestions` 속성을 통해 예측 텍스트 사용 제어 가능  
  
- **스위치 입력**:  
  - `&lt;input type=checkbox switch&gt;`에서 햅틱 피드백 지원  
  
- **날짜 및 시간 입력**:  
  - 날짜 및 시간 입력 필드의 접근성 향상  
  
- **ARIA 속성**:  
  - `aria-braillelabel` 및 `aria-brailleroledescription` 지원  
  
#### 미디어 (Media)  
  
- **비디오 뷰어**:  
  - 비디오를 방해 없이 시청할 수 있는 Viewer 기능 추가  
  - 탭 전환 시 자동으로 Picture-in-Picture 모드로 전환  
  
#### WebRTC  
  
- **지원 추가**:  
  - HEVC RFC 7789 RTP 페이로드 형식 지원  
  - 전용 워커에서 MediaStreamTrack 처리 지원  
  
#### 패스키 (Passkeys)  
  
- `mediation=conditional`로 패스키 업그레이드 가능  
- 관련 도메인 간 패스키 사용 지원  
- WebAuthn `prf` 확장 지원  
  
#### HTTPS  
  
- 혼합 콘텐츠 설정에서 모든 이미지, 비디오, 오디오를 HTTPS로 자동 업그레이드  
  
#### 자바스크립트 (JavaScript)  
  
- Unicode 15.1.0 문자 지원  
- `v` 플래그와 `RegExp.prototype[Symbol.matchAll]` 지원  
  
#### 웹 API (Web API)  
  
- `URL.parse()` 메서드 지원  
- `shadowRootDelegatesFocus`, `shadowRootClonable`, `shadowRootSerializable` 속성 지원  
- `PopStateEvent`의 `hasUAVisualTransition` 속성 지원  
- 모듈 스크립트의 서브리소스 무결성 지원  
- `bytes()` 메서드 지원  
- 텍스트 프래그먼트 감지 지원  
  
#### 캔버스 (Canvas)  
  
- `willReadFrequently` 컨텍스트 속성 지원  
- 2D 캔버스에서 `currentcolor` 지원 확장  
  
#### WebGL  
  
- `EXT_texture_mirror_clamp_to_edge` 등 6가지 WebGL 확장 지원  
  
#### Web Inspector  
  
-  CSS 소스 편집기에서 퍼지 검색 자동 완성 지원  
  
#### WKWebView  
  
- **새로운 API**: Writing Tools API 및 적응형 이미지 글리프 삽입 API 지원  
  
#### Apple Pay  
  
- **지원 추가**: Apple Pay 현금 이체 지원  
  
#### 폐기 (Deprecations)  
  
- `OffscreenCanvasRenderingContext2D`의 `commit()` 메서드  
- 여러 `-webkit` 접두사 속성 및 가상 클래스  
- JPEG2000 이미지 형식  
- `AppCache` 지원 완전 종료  
- `SVGAnimateColorElement` 인터페이스  
- 몇 가지 비표준 Web API

## Comments



_No public comments on this page._
