--- id: P-REINFORCE-AUTO-600505 category: "10_Wiki/πŸ’‘ Topics/Graphics & Performance" confidence_score: 0.90 tags: [auto-reinforced] last_reinforced: 2026-04-20 github_commit: "[P-Reinforce] Continuous Worker - OffscreenCanvas Safari μ œμ•½ 사항" --- # [[OffscreenCanvas Safari α„Œα…¦α„‹α…£α†¨ ᄉᅑᄒᅑᆼ|OffscreenCanvas Safari μ œμ•½ 사항]] ## πŸ“Œ ν•œ 쀄 톡찰 (The Karpathy Summary) > Safari λΈŒλΌμš°μ €μ—μ„œλŠ” `OffscreenCanvas`와 WebGL의 κ²°ν•© μ‚¬μš©μ΄ 아직 μ™„μ „νžˆ μ§€μ›λ˜μ§€ μ•Šμ•„, μ›Œμ»€ μŠ€λ ˆλ“œμ™€ 메인 μŠ€λ ˆλ“œμš© λ Œλ”λ§ μ½”λ“œλ₯Ό λ³„λ„λ‘œ μœ μ§€λ³΄μˆ˜ν•˜κ±°λ‚˜ 폴백(Fallback)을 κ΅¬ν˜„ν•΄μ•Ό ν•˜λŠ” 치λͺ…적인 μ œμ•½μ΄ μžˆμŠ΅λ‹ˆλ‹€. ## πŸ“– κ΅¬μ‘°ν™”λœ 지식 (Synthesized Content) **1. OffscreenCanvas와 WebGL 지원 λΆ€μ‘±** Safari λΈŒλΌμš°μ €μ—μ„œλŠ” μ˜€ν”„μŠ€ν¬λ¦° μΊ”λ²„μŠ€μ™€ WebGL을 ν•¨κ»˜ μ‚¬μš©ν•˜λŠ” ν™˜κ²½(`offscreen canvas + webgl`)이 아직 μ œλŒ€λ‘œ μ§€μ›λ˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€. μ΄λŸ¬ν•œ ν•œκ³„ λ•Œλ¬Έμ— μ›Œμ»€ λ‚΄λΆ€μ—μ„œ DOMκ³Ό 톡신(`postMessage`)ν•΄μ•Ό ν•˜λŠ” λ³΅μž‘ν•œ ꡬ쑰λ₯Ό κ΅¬ν˜„ν•  λ•Œ 큰 μ œμ•½μ΄ λ”°λ¦…λ‹ˆλ‹€. **2. μ½”λ“œ λΆ„κΈ°(Fork)의 κ°•μ œ 및 μœ μ§€λ³΄μˆ˜ λΆ€λ‹΄** Safari의 지원 λΆ€μ‘± 문제둜 인해, κ°œλ°œμžλ“€μ€ 앱을 μ›Ή μ›Œμ»€μ—μ„œ μ‹€ν–‰λ˜λŠ” 버전과 메인 μŠ€λ ˆλ“œμ—μ„œ μ‹€ν–‰λ˜λŠ” 폴백(Fallback) λ²„μ „μ˜ 두 갈래(two forks)둜 λ‚˜λˆ„μ–΄ μœ μ§€λ³΄μˆ˜ν•΄μ•Όλ§Œ ν–ˆμŠ΅λ‹ˆλ‹€. μ΄λŸ¬ν•œ ν˜Έν™˜μ„± μ΄μŠˆμ™€ 개발의 λ²ˆκ±°λ‘œμ›€μ€ Three.js μƒνƒœκ³„μ—μ„œ OffscreenCanvas 기술이 μ˜€λž«λ™μ•ˆ λŒ€μ€‘ν™”λ˜μ§€ λͺ»ν–ˆλ˜ κ°€μž₯ 큰 원인 쀑 ν•˜λ‚˜μ˜€μŠ΅λ‹ˆλ‹€. **3. ν•΄κ²°μ±… 및 우회 μ „λž΅ (Fallback & Broadcast API)** μ΅œκ·Όμ—λŠ” `@react-three/offscreen`κ³Ό 같은 라이브러리λ₯Ό 톡해 이 문제λ₯Ό 비ꡐ적 μ‰½κ²Œ ν•΄κ²°ν•  수 μžˆμŠ΅λ‹ˆλ‹€. ν•΄λ‹Ή λΌμ΄λΈŒλŸ¬λ¦¬λŠ” `fallback` ν”„λ‘­(Prop)을 μ œκ³΅ν•˜μ—¬, Safari처럼 OffscreenCanvasλ₯Ό μ§€μ›ν•˜μ§€ μ•ŠλŠ” ν™˜κ²½μ—μ„œλŠ” μžλ™μœΌλ‘œ 기쑴처럼 메인 μŠ€λ ˆλ“œμ—μ„œ 씬(Scene)이 λ Œλ”λ§λ˜λ„λ‘ μš°νšŒν•΄ μ€λ‹ˆλ‹€. λ˜ν•œ, Safari ν™˜κ²½μ˜ ν•œκ³„λ₯Ό κ³ λ €ν•˜μ—¬ 3D 씬을 μ² μ €νžˆ λ…λ¦½μ μœΌλ‘œ(Self-contained) κ΅¬μ„±ν•˜λŠ” 것이 μ’‹μœΌλ©°, λΆ€λ“μ΄ν•˜κ²Œ DOMκ³Ό 톡신해야 ν•  경우 `postMessage` λŒ€μ‹  μ›Ή λΈŒλ‘œλ“œμΊμŠ€νŠΈ API(Web Broadcast API)λ₯Ό μ‚¬μš©ν•˜λŠ” 것이 ꢌμž₯λ©λ‹ˆλ‹€. ## ⚠️ λͺ¨μˆœ 및 μ—…λ°μ΄νŠΈ (Contradictions & RL Update) - **κ³Όκ±° λ°μ΄ν„°μ™€μ˜ 좩돌:** μžλ™ν™” 엔진에 μ˜ν•΄ λ§€ν•‘λœ μ§€μ‹μœΌλ‘œ, μΆ”ν›„ μ •λ°€ 검증 ν•„μš”. - **μ •μ±… λ³€ν™”:** Graphics & Performance λΆ„μ•Όμ˜ μžλ™ μžμ‚°ν™” μˆ˜ν–‰. ## πŸ”— 지식 μ—°κ²° (Graph) - **Related Topics:** [[OffscreenCanvas|OffscreenCanvas]], [[Web Worker (α„‹α…°α†Έ 워ᄏα…₯)|Web Worker (μ›Ή μ›Œμ»€)]], [[React Three Fiber (R3F)|React Three Fiber (R3F)]], Cross-browser Compatibility (크둜슀 λΈŒλΌμš°μ € ν˜Έν™˜μ„±) - **Projects/Contexts:** [[고ᄉα…₯α†Όα„‚α…³α†Ό ᄆα…₯ᆯ타스레드 React α„‹α…’α†Έ α„‹α…‘α„α…΅α„α…¦α†¨α„Žα…₯|κ³ μ„±λŠ₯ λ©€ν‹°μŠ€λ ˆλ“œ React μ•± μ•„ν‚€ν…μ²˜]], μ‹€μ‹œκ°„ 3D μ›Ή κ²Œμž„ λ Œλ”λ§ ν™˜κ²½ - **Contradictions/Notes:** Safari λΈŒλΌμš°μ €κ°€ 2025λ…„ 9μ›”(v26)λΆ€ν„° WebGPU 지원을 μ‹œμž‘ν•˜λŠ” λ“± κ·Έλž˜ν”½ 지원 λ²”μœ„λ₯Ό λ„“ν˜€κ°€κ³  μžˆμœΌλ‚˜, `OffscreenCanvas`λ₯Ό ν™œμš©ν•œ WebGL λ©€ν‹°μŠ€λ ˆλ“œ λ Œλ”λ§μ— λŒ€ν•΄μ„œλŠ” μ—¬μ „νžˆ μ œμ•½μ΄ 보고되고 μžˆμœΌλ―€λ‘œ ν”„λ‘œλ•μ…˜ ν™˜κ²½μ—μ„œλŠ” λ°˜λ“œμ‹œ 메인 μŠ€λ ˆλ“œμš© `fallback` μ»΄ν¬λ„ŒνŠΈλ₯Ό μ œκ³΅ν•΄μ•Ό μ•ˆμ •μ„±μ„ 보μž₯ν•  수 μžˆμŠ΅λ‹ˆλ‹€. --- _Last updated: 2026-04-15_ - Raw Source: 00_Raw/2026-04-20/OffscreenCanvas Safari μ œμ•½ 사항.md ---