--- id: P-REINFORCE-AUTO-852A59 category: "10_Wiki/πŸ’‘ Topics/Graphics & Performance" confidence_score: 0.90 tags: [auto-reinforced] last_reinforced: 2026-04-20 github_commit: "[P-Reinforce] Continuous Worker - Babylonjs" --- # [[Babylonjs|Babylonjs]] ## πŸ“Œ ν•œ 쀄 톡찰 (The Karpathy Summary) > Babylon.jsλŠ” μˆ˜μ²œμ—μ„œ 수만 개의 λ©”μ‰¬λ‘œ κ΅¬μ„±λœ λŒ€κ·œλͺ¨ 3D 씬을 μ›Ή ν™˜κ²½μ—μ„œ λ Œλ”λ§ν•˜κ³  κ΄€λ¦¬ν•˜λŠ” 데 μ‚¬μš©λ˜λŠ” κ·Έλž˜ν”½ μ—”μ§„μž…λ‹ˆλ‹€. λ Œλ”λ§ μ„±λŠ₯ 및 λ©”λͺ¨λ¦¬ μ΅œμ ν™”λ₯Ό μœ„ν•΄ MergeMesh, μΈμŠ€ν„΄μŠ€ 메쉬(Instanced Meshes), 그리고 μ†”λ¦¬λ“œ νŒŒν‹°ν΄ μ‹œμŠ€ν…œ(Solid Particle System, SPS) λ“±μ˜ 기법을 μ§€μ›ν•©λ‹ˆλ‹€. λŒ€κ·œλͺ¨ μΈμŠ€ν„΄μŠ€ 처리 μ‹œ λ°œμƒν•˜λŠ” CPU 병λͺ© ν˜„μƒμ„ κ·Ήλ³΅ν•˜κΈ° μœ„ν•΄ ν•˜λ“œμ›¨μ–΄ μ œμ–΄λ ₯이 높은 WebGPU 기술의 λ„μž…μ΄ 적극적으둜 λ…Όμ˜λ˜κ³  μžˆμŠ΅λ‹ˆλ‹€. ## πŸ“– κ΅¬μ‘°ν™”λœ 지식 (Synthesized Content) * **λ Œλ”λ§ μ΅œμ ν™” 기법** λŒ€λŸ‰μ˜ 객체λ₯Ό λ Œλ”λ§ν•  λ•Œ λ°œμƒν•˜λŠ” 메쉬 생성 μ‹œκ°„, FPS μ„±λŠ₯ μ €ν•˜, λ©”λͺ¨λ¦¬ μ†ŒλΉ„ 문제λ₯Ό ν•΄κ²°ν•˜κΈ° μœ„ν•΄ `MergeMesh`, μ†”λ¦¬λ“œ νŒŒν‹°ν΄ μ‹œμŠ€ν…œ(SPS), μΈμŠ€ν„΄μŠ€ 메쉬(Instanced Meshes) 기술이 주둜 μ‚¬μš©λ©λ‹ˆλ‹€ [1, 2]. * **μΈμŠ€ν„΄μŠ€ 메쉬(Instanced Meshes)와 SPS의 νŠΉμ„± 비ꡐ** * **μΈμŠ€ν„΄μŠ€ 메쉬**: μ§€μ˜€λ©”νŠΈλ¦¬ 볡제λ₯Ό λ°©μ§€ν•˜μ—¬ λ©”λͺ¨λ¦¬ νš¨μœ¨μ„±μ΄ λ†’μ§€λ§Œ, λ§€ ν”„λ ˆμž„λ§ˆλ‹€ μ›”λ“œ 맀트릭슀(World Matrix), λ°”μš΄λ”© λ°•μŠ€, λ°”μš΄λ”© μŠ€ν”Όμ–΄ 및 μ ˆλ‘μ²΄(Frustum) 검사λ₯Ό κ³„μ‚°ν•©λ‹ˆλ‹€ [3]. μΈμŠ€ν„΄μŠ€κ°€ 수만 개둜 λŠ˜μ–΄λ‚˜κ³  κ°œλ³„ μŠ€μΌ€μΌ(Scale) 등이 적용될 경우 λ§‰λŒ€ν•œ CPU 병λͺ©μ„ μœ λ°œν•˜μ—¬ ν”„λ ˆμž„ 속도λ₯Ό κΈ‰κ²©νžˆ λ–¨μ–΄λœ¨λ¦½λ‹ˆλ‹€ [4, 5]. * **μ†”λ¦¬λ“œ νŒŒν‹°ν΄ μ‹œμŠ€ν…œ(SPS)**: `setParticles()`κ°€ 호좜될 λ•Œλ§Œ μ „μš© μ›”λ“œ 맀트릭슀λ₯Ό κ³„μ‚°ν•˜λ©° 기본적으둜 μ ˆλ‘μ²΄ 검사가 λΉ„ν™œμ„±ν™”λ˜μ–΄ μžˆμ–΄ CPU μ˜€λ²„ν—€λ“œκ°€ μ μŠ΅λ‹ˆλ‹€. λŸ°νƒ€μž„μ— κ°œλ³„ νŒŒν‹°ν΄μ˜ μƒ‰μƒμ΄λ‚˜ μž¬μ§ˆμ„ μœ μ—°ν•˜κ²Œ λ³€κ²½ν•  수 μžˆλŠ” μž₯점이 μžˆμœΌλ‚˜, μ§€μ˜€λ©”νŠΈλ¦¬μ™€ 색상 버퍼 데이터λ₯Ό λ‚΄λΆ€μ μœΌλ‘œ λͺ¨λ‘ λ³΅μ œν•˜κΈ° λ•Œλ¬Έμ— 10만 개의 싀린더λ₯Ό λ Œλ”λ§ν•  λ•Œ μ•½ 600MB의 μ—„μ²­λ‚œ λ©”λͺ¨λ¦¬λ₯Ό μ†Œλͺ¨ν•©λ‹ˆλ‹€ [1, 3, 6, 7]. * **CPU 병λͺ© ν˜„μƒ 및 μ™„ν™” μ „λž΅** Babylon.jsλŠ” 버퍼 λ‚΄μ˜ 맀트릭슀λ₯Ό μž¬λ°°μ—΄ν•˜λŠ” λ°©μ‹μœΌλ‘œ CPU λ‹¨μ—μ„œ μ •λ ¬(Sorting) 및 μ ˆλ‘μ²΄ 컬링(Frustum Culling)을 μˆ˜ν–‰ν•©λ‹ˆλ‹€ [8]. λ”°λΌμ„œ λ Œλ”λ§ μ‹œ λ§€ ν”„λ ˆμž„λ§ˆλ‹€ λ°œμƒν•˜λŠ” μ›”λ“œ 맀트릭슀 계산 λΆ€ν•˜λ₯Ό 쀄이렀면 `freezeWorldMatrix()` ν•¨μˆ˜λ₯Ό μ‚¬μš©ν•˜μ—¬ 정적 객체의 연산을 λΉ„ν™œμ„±ν™”ν•˜κ±°λ‚˜, μ‹œμ•Ό λ°–μ˜ 객체 관리λ₯Ό λ³„λ„μ˜ μ›Ή μ›Œμ»€(Web Worker)둜 λΆ„λ¦¬ν•˜λŠ” 기법이 ꢌμž₯λ©λ‹ˆλ‹€ [4, 9]. * **ν•œκ³„μ™€ WebGPU의 μ—­ν• ** ν˜„μž¬μ˜ WebGL μƒνƒœμ—μ„œλŠ” μΈμŠ€ν„΄μŠ€ 메쉬라 할지라도 수만 개의 객체λ₯Ό μ²˜λ¦¬ν•˜κΈ°μ—λŠ” 무리가 μžˆμŠ΅λ‹ˆλ‹€ [10]. 2,000개 미만의 λ©”μ‰¬μ—μ„œλŠ” μ›ν™œν•˜μ§€λ§Œ κ·Έ μ΄μƒμ˜ κ±°λŒ€ν•œ μŠ€μΌ€μΌμ„ μ²˜λ¦¬ν•˜κΈ° μœ„ν•΄μ„œλŠ” κΈˆμ†(ν•˜λ“œμ›¨μ–΄) μˆ˜μ€€μ— 더 κ°€κΉκ²Œ μ ‘κ·Όν•  수 μžˆλŠ” WebGPUλ₯Ό λŒ€μ•ˆμœΌλ‘œ μ‚¬μš©ν•΄μ•Ό ν•©λ‹ˆλ‹€ [10]. ## ⚠️ λͺ¨μˆœ 및 μ—…λ°μ΄νŠΈ (Contradictions & RL Update) - **κ³Όκ±° λ°μ΄ν„°μ™€μ˜ 좩돌:** μžλ™ν™” 엔진에 μ˜ν•΄ λ§€ν•‘λœ μ§€μ‹μœΌλ‘œ, μΆ”ν›„ μ •λ°€ 검증 ν•„μš”. - **μ •μ±… λ³€ν™”:** Graphics & Performance λΆ„μ•Όμ˜ μžλ™ μžμ‚°ν™” μˆ˜ν–‰. ## πŸ”— 지식 μ—°κ²° (Graph) - **Related Topics:** Instanced Meshes, Solid Particle System (SPS), [[Frustum Culling|Frustum Culling]], [[WebGPU|WebGPU]] - **Projects/Contexts:** λŒ€κ·œλͺ¨ 3D ν™˜κ²½ λ Œλ”λ§ μ΅œμ ν™” ν”„λ‘œμ νŠΈ - **Contradictions/Notes:** μΈμŠ€ν„΄μŠ€ λ©”μ‰¬λŠ” μ§€μ˜€λ©”νŠΈλ¦¬λ₯Ό λ³΅μ œν•˜μ§€ μ•Šμ•„ λ©”λͺ¨λ¦¬κ°€ μ ˆμ•½λ˜μ–΄μ•Ό ν•˜μ§€λ§Œ, ν•œ μ‚¬μš©μžλŠ” 10,000개의 μΈμŠ€ν„΄μŠ€λ‹Ή 100MB의 νž™ λ©”λͺ¨λ¦¬κ°€ 증가(μΈμŠ€ν„΄μŠ€λ‹Ή μ•½ 8~10KB)ν•œλ‹€λŠ” ν”„λ‘œνŒŒμΌλ§ κ²°κ³Όλ₯Ό μ œκΈ°ν–ˆμŠ΅λ‹ˆλ‹€ [7, 11]. 이에 λŒ€ν•΄ Babylon.js κ°œλ°œμ§„(Deltakosh)은 μ‹€μ œ μΈμŠ€ν„΄μŠ€ 1κ°œλ‹Ή μ°¨μ§€ν•˜λŠ” λ©”λͺ¨λ¦¬λŠ” μ•½ 400λ°”μ΄νŠΈ μˆ˜μ€€μ΄λΌκ³  ν™•μΈν•˜λ©° μ˜€ν•΄λ₯Ό μ •μ •ν–ˆμŠ΅λ‹ˆλ‹€ [12]. --- *Last updated: 2026-04-19* - Raw Source: 00_Raw/2026-04-20/Babylon.js.md ---