iOS Safari 완벽 가이드: 모든 설정 및 WebKit 기능 플래그 100가지 총정리

 

1. 기본 설정

 

1.1. Siri 및 검색

Safari와 Siri의 연동 기능을 설정합니다.

 

1.2. 기본 브라우저 앱

Safari를 기본 브라우저로 지정할 수 있습니다.

 

1.3. 언어

Safari의 기본 언어를 설정합니다.

 

1.4. 검색 엔진

Google, Bing 등 기본 검색 엔진을 선택합니다.

 

2. 개인정보 보호 및 보안

 

2.1. 개인정보 보호 브라우징

교차 사이트 추적 방지, 모든 쿠키 차단, 개인정보 보호 광고 측정 등을 설정합니다.

 

2.2. Apple Pay 확인

Apple Pay 사용 시 확인 방법을 설정합니다.

 

2.3. 사기 웹 사이트 경고

잠재적인 사기 웹사이트에 대한 경고를 설정합니다.

 

3. 사용자 경험 개선

 

3.1. JavaScript

웹페이지의 JavaScript 실행을 관리합니다.

 

3.2. 팝업 차단

원치 않는 팝업 창을 차단합니다.

 

3.3. 페이지 확대/축소

웹 페이지 확대/축소 기능을 설정합니다.

 

3.4. 자동 채우기

양식 자동 작성 기능을 설정합니다.

 

3.5. 읽기 목록

오프라인에서 읽기 목록 사용 여부를 설정합니다.

 

3.6. 다운로드

다운로드 위치와 관리 옵션을 설정합니다.

 

4. 개발자 도구

 

4.1. 웹 인스펙터

웹 페이지 검사 도구를 활성화합니다.

 

4.2. 원격 자동화

Safari의 원격 자동화 기능을 설정합니다.

 

 

 

5. WebKit 기능 플래그 100가지 총정리

5.1. CSS 관련 기능

1. ::grammar-error and ::spelling-error pseudo-elements: 문법 및 철자 오류를 시각적으로 표시합니다.
2. ::thumb and ::track pseudo-elements: 슬라이더의 썸네일과 트랙을 스타일링합니다.
3. :focus-visible pseudo-class: 키보드 포커스를 받은 요소에 스타일을 적용합니다.
4. :has() pseudo-class: 부모 선택자 기능을 제공합니다.
5. CSS @counter-style: 사용자 정의 카운터 스타일을 정의합니다.
6. CSS Cascade Layers: CSS 규칙의 우선순위를 세밀하게 제어합니다.
7. CSS Container Queries: 컨테이너의 크기에 따라 스타일을 적용합니다.
8. CSS Custom Properties and Values: CSS 변수와 사용자 정의 속성을 지원합니다.
9. CSS Grid Layout: CSS 그리드 레이아웃 기능을 제공합니다.
10. CSS Nesting Rules: CSS 규칙을 중첩할 수 있게 합니다.

 

5.2. JavaScript 및 API 관련 기능

11. AbortSignal.any() API: 여러 AbortSignal을 결합할 수 있습니다.
12. AccessHandle API: 파일 시스템 액세스를 위한 새로운 API를 제공합니다.
13. AudioSession API: 오디오 세션을 제어하는 API를 제공합니다.
14. BroadcastChannel API: 같은 출처의 다른 브라우징 컨텍스트와 통신할 수 있습니다.
15. Cookie Store API: 쿠키를 비동기적으로 관리할 수 있습니다.
16. File System Access API: 웹 애플리케이션이 로컬 파일 시스템에 접근할 수 있게 합니다.
17. Gamepad API: 게임패드 장치를 웹에서 사용할 수 있게 합니다.
18. Generic Sensor API: 다양한 센서 데이터에 접근할 수 있습니다.
19. Intersection Observer v2: 교차 관찰자 API의 개선된 버전을 제공합니다.
20. JavaScript Garbage Collection: 가비지 컬렉션 동작을 최적화합니다.

 

5.3. 미디어 관련 기능

21. Allow WebGL in Web Workers: Web Worker 내에서 WebGL을 사용할 수 있게 합니다.
22. Allow per media element speaker device selection: 미디어 요소별로 스피커 장치를 선택할 수 있게 합니다.
23. Alternate WebM Player: 대체 WebM 비디오 플레이어를 사용합니다.
24. Audio descriptions for video: 비디오에 대한 오디오 설명을 제공합니다.
25. Media Capture from DOM Elements: DOM 요소로부터 미디어를 캡처할 수 있게 합니다.
26. MediaRecorder API: 미디어 스트림을 녹화할 수 있는 API를 제공합니다.
27. MediaStream Image Capture: 카메라에서 이미지를 캡처할 수 있는 API를 제공합니다.
28. Media Session API: 미디어 세션을 제어할 수 있는 API를 제공합니다.
29. Picture-in-Picture API: 비디오를 별도의 창으로 분리하여 재생할 수 있게 합니다.
30. WebRTC: 실시간 통신 기능을 제공합니다.

 

5.4. 성능 및 최적화 관련 기능

31. Event Timing API: 사용자 상호작용의 지연을 측정할 수 있습니다.
32. GPU Support: GPU 가속을 활용한 고성능 그래픽 처리를 지원합니다.
33. HTML Lazy Loading: 이미지와 iframe의 지연 로딩을 지원합니다.
34. Layout Instability API: 레이아웃 변화로 인한 시각적 불안정성을 측정할 수 있습니다.
35. Memory Measurement API: 웹 애플리케이션의 메모리 사용량을 측정할 수 있게 합니다.
36. Navigation Preload: 서비스 워커 활성화 중 네트워크 요청을 미리 로드할 수 있게 합니다.
37. Offscreen Canvas: 메인 스레드 외부에서 캔버스 렌더링을 수행할 수 있게 합니다.
38. Page Lifecycle API: 페이지 생명주기 이벤트를 처리할 수 있는 API를 제공합니다.
39. Persistent Storage: 영구적인 스토리지를 사용할 수 있게 합니다.
40. Resource Timing: 리소스 로딩 성능을 측정할 수 있는 API를 제공합니다.

 

5.5. 보안 및 프라이버시 관련 기능

41. Encrypted Media Extensions: DRM으로 보호된 콘텐츠를 재생할 수 있게 합니다.
42. Private Click Measurement: 광고 클릭을 프라이버시를 보호하며 측정할 수 있게 합니다.
43. Permissions API: 웹 애플리케이션의 권한을 쿼리하고 요청할 수 있는 API를 제공합니다.
44. Push API: 푸시 알림을 구현할 수 있는 API를 제공합니다.
45. Content Security Policy Level 3: 웹 애플리케이션의 보안 정책을 더욱 세밀하게 제어할 수 있습니다.
46. Referrer Policy: 리퍼러 정보의 전송을 제어할 수 있습니다.
47. Subresource Integrity: 외부 리소스의 무결성을 검증할 수 있습니다.
48. Trusted Types: DOM XSS 취약점을 방지하는 메커니즘을 제공합니다.
49. Web Authentication API: 생체 인식 등을 이용한 강력한 인증 방식을 제공합니다.
50. Cross-Origin Opener Policy: 교차 출처 창 간의 상호작용을 제한할 수 있습니다.

 

5.6. 사용자 경험 및 접근성 관련 기능

51. Pointer Events: 다양한 입력 장치의 포인터 이벤트를 처리할 수 있게 합니다.
52. Scroll To Text Fragment: URL을 통해 특정 텍스트로 스크롤할 수 있게 합니다.
53. Screen Wake Lock API: 화면이 꺼지지 않도록 제어할 수 있는 API를 제공합니다.
54. Web Animations API: JavaScript를 사용하여 애니메이션을 제어할 수 있습니다.
55. Web Share API: 네이티브 공유 기능을 웹에서 사용할 수 있게 합니다.
56. Web Speech API: 음성 인식 및 음성 합성 기능을 제공합니다.
57. WebVTT: 비디오에 자막을 추가할 수 있는 기능을 제공합니다.
58. Fullscreen API: 웹 콘텐츠를 전체 화면으로 표시할 수 있게 합니다.
59. Resize Observer: 요소의 크기 변화를 관찰할 수 있는 API를 제공합니다.
60. Visual Viewport API: 시각적 뷰포트에 대한 정보와 이벤트를 제공합니다.

 

5.7. 웹 컴포넌트 및 모듈화 관련 기능

61. Custom Elements: 사용자 정의 HTML 요소를 만들 수 있게 합니다.
62. Shadow DOM: 캡슐화된 DOM 트리를 생성할 수 있게 합니다.
63. HTML Templates: 재사용 가능한 HTML 마크업을 정의할 수 있게 합니다.
64. ES Modules: JavaScript 모듈을 사용할 수 있게 합니다.
65. Import Maps: JavaScript 모듈의 import 경로를 재매핑할 수 있게 합니다.
66. Constructable Stylesheets: JavaScript로 스타일시트를 생성하고 조작할 수 있게 합니다.
67. Worklet: 렌더링 파이프라인의 특정 부분을 확장할 수 있게 합니다.
68. Web Components: 재사용 가능한 사용자 정의 요소를 만들 수 있게 합니다.
69. Scoped Custom Element Registries: 범위가 지정된 사용자 정의 요소 레지스트리를 제공합니다.
70. Declarative Shadow DOM: 선언적 방식으로 Shadow DOM을 생성할 수 있게 합니다.

 

5.8. 네트워크 및 스토리지 관련 기능

71. Service Worker: 오프라인 기능과 백그라운드 동기화를 지원하는 스크립트를 실행할 수 있게 합니다.
72. Cache API: 네트워크 요청과 응답을 캐시할 수 있는 API를 제공합니다.
73. Background Sync: 네트워크 연결이 불안정할 때 데이터 동기화를 보장합니다.
74. Periodic Background Sync: 주기적인 백그라운드 동기화를 수행할 수 있게 합니다.
75. Network Information API: 네트워크 연결 정보에 접근할 수 있는 API를 제공합니다.
76. Web Storage API: 클라이언트 측 데이터 저장을 위한 API를 제공합니다.
77. IndexedDB: 구조화된 데이터를 저장하고 검색할 수 있는 API를 제공합니다.
78. WebSockets: 실시간 양방향 통신을 지원합니다.
79. Fetch API: 네트워크 리소스를 가져오는 인터페이스를 제공합니다.
80. Streams API: 스트리밍 데이터를 처리할 수 있는 API를 제공합니다.

 

5.9. 그래픽 및 멀티미디어 관련 기능

81. WebGL: 하드웨어 가속 3D 그래픽을 제공합니다.
82. WebGL 2: 향상된 3D 그래픽 기능을 제공합니다.
83. WebGPU: 최신 그래픽 API에 대한 액세스를 제공합니다.
84. Web Audio API: 고급 오디오 처리 기능을 제공합니다.
85. WebXR Device API: 가상 현실 및 증강 현실 경험을 제공합니다.
86. WebCodecs: 저수준 미디어 처리 기능을 제공합니다.
87. Media Source Extensions: 동적 스트리밍을 위한 API를 제공합니다.
88. Web MIDI API: MIDI 장치와의 상호 작용을 위한 API를 제공합니다.
89. ImageBitmap Rendering Context: 고성능 2D 렌더링을 위한 컨텍스트를 제공합니다.
90. CSS Houdini: CSS 엔진에 대한 저수준 액세스를 제공합니다.

 

5.10. 기타 실험적 기능

91. Web Bluetooth: 블루투스 장치와의 통신을 위한 API를 제공합니다.
92. Web USB: USB 장치와의 통신을 위한 API를 제공합니다.
93. Web Serial: 시리얼 포트와의 통신을 위한 API를 제공합니다.
94. Web NFC: NFC 기능을 사용할 수 있는 API를 제공합니다.
95. Geolocation API: 사용자의 위치 정보를 얻을 수 있는 API를 제공합니다.
96. Ambient Light Sensor: 주변 조명 센서에 접근할 수 있는 API를 제공합니다.
97. Battery Status API: 기기의 배터리 상태 정보를 제공합니다.
98. Web Locks API: 리소스에 대한 독점적 액세스를 조정할 수 있는 API를 제공합니다.
99. Reporting API: 다양한 브라우저 및 웹 애플리케이션 이벤트를 보고할 수 있는 API를 제공합니다.
100. Performance API: 웹 애플리케이션의 성능을 측정하고 분석할 수 있는 API를 제공합니다.

 

이상으로 iOS Safari의 모든 설정과 100가지 WebKit 기능 플래그에 대해 상세히 알아보았습니다. 이 기능들을 잘 활용하면 더 안전하고 효율적인 웹 브라우징은 물론, 최신 웹 기술을 미리 경험해볼 수 있습니다. 특히 웹 개발자들에게는 이러한 실험적 기능들이 미래의 웹 표준을 예측하고 준비하는 데 큰 도움이 될 것입니다. 하지만 이러한 기능들은 실험적인 단계에 있으므로, 프로덕션 환경에서 사용할 때는 주의가 필요합니다. 항상 최신 웹 표준과 브라우저 지원 상황을 확인하며 사용하는 것이 중요합니다.