feat: Wiki 지식 자산 업데이트 - UX Scenarios, Frontend, Game Design, Topics 추가 [2026-05-08]

This commit is contained in:
2026-05-08 19:52:07 +09:00
parent 9dd3d40662
commit 5ba5a55c78
3984 changed files with 334557 additions and 28839 deletions
+69 -7
View File
@@ -1,20 +1,33 @@
---
category: Unified
id: wiki-2026-0508-overdraw
title: Overdraw
category: 10_Wiki/Topics
status: needs_review
canonical_id: self
aliases: []
duplicate_of: none
source_trust_level: A
confidence_score: 0.92
tags: [auto-consolidated, technical-documentation]
title: [[Overdraw|Overdraw]]
last_updated: 2026-05-02
raw_sources: []
last_reinforced: 2026-05-08
github_commit: pending
inferred_by: Claude Opus 4.7 (auto-normalize 2026-05-08)
tech_stack:
language: unspecified
framework: unspecified
---
# [[Overdraw|Overdraw]]
## 📌 Brief Summary
## 📌 한 줄 통찰 (The Karpathy Summary)
> 오버드로우(Overdraw)는 렌더링 파이프라인의 프래그먼트 셰이딩([[Fragment Shading|Fragment Shading]]) 단계에서 동일한 픽셀 위치에 렌더링 연산 및 쓰기 작업이 여러 번 중첩되어 GPU 자원이 낭비되는 현상입니다. InstancedMesh를 사용할 때 개별 인스턴스에 대한 자동 정렬(Sorting) 기능이 부재하여 깊이 테스트([[Early-Z|Early-Z]])를 통한 최적화가 무력화되면서 막대한 오버드로우가 발생할 수 있으며, 이는 심각한 렌더링 프레임 지연의 핵심 원인이 됩니다[1, 2].
---
> 오버드로우(Overdraw)는 렌더링 파이프라인의 프래그먼트 셰이딩([[Fragment Shading|Fragment Shading]]) 단계에서 동일한 픽셀 위치에 대해 여러 번의 쓰기 작업이 중첩되어 발생하는 현상이다 [1]. 주로 겹쳐진 투명한 기하구조나 비효율적인 깊이 정렬(Depth [[Sorting|Sorting]])로 인해 보이지 않는 픽셀 연산에 GPU 자원을 낭비하게 만든다 [2]. 이는 결과적으로 불필요한 GPU 픽셀 처리 비용을 유발하여 심각한 프레임 속도 저하 및 성능 병목을 초래한다 [1, 3].
## 📖 Core Content
## 📖 구조화된 지식 (Synthesized Content)
* **오버드로우의 발생 원리:**
투명한 지오메트리가 겹쳐 있거나 객체들이 비효율적으로 정렬되어 있을 때, 가려져서 최종 화면에 보이지 않을 픽셀에 대해서까지 GPU가 계산을 수행하면서 발생합니다[1].
* **InstancedMesh의 구조적 정렬 부재:**
@@ -30,7 +43,7 @@ last_updated: 2026-05-02
- **[[InstancedMesh|InstancedMesh]]와 오버드로우:** Three.js의 `InstancedMesh`는 단일 드로우 콜로 다수의 객체를 렌더링하지만 자동 정렬(Sorting) 기능을 제공하지 않아 내부 인스턴스들이 버퍼에 저장된 순서대로 렌더링된다 [1, 5, 6]. 이로 인해 드로우 콜 감소로 얻은 CPU 이득보다, 정렬되지 않은 인스턴스들이 유발하는 막대한 오버드로우 비용이 GPU의 픽셀 처리 성능을 상회하는 역전 현상이 일어날 수 있다 [1]. 특히 복잡한 조명 연산이 포함된 `MeshStandardMaterial` 등을 사용할 경우 씬(Scene)이 프래그먼트 바운드([[Fragment-bound|Fragment-bound]]) 상태에 빠져 치명적인 프레임 드랍을 유발한다 [1, 6].
- **오버드로우 최적화 및 해결 방안:** 투명도로 인한 오버드로우를 최소화하려면 알파 테스트 투명도(Alpha-tested transparency)를 가능한 한 불투명한 기하구조로 변환하거나, 가장자리 스무딩에 Alpha-to-coverage를 사용해야 한다 [2, 7]. 또한 투명한 객체 간의 겹침이 줄어들도록 렌더링 순서를 신중하게 정렬해야 한다 [7]. `InstancedMesh`의 정렬 부재 문제를 극복하기 위해서는 각 인스턴스들이 렌더링되는 방식을 카메라 기준으로 개별 정렬(Sorting)할 수 있는 대안적 기술(`BatchedMesh` 등)을 고려할 수 있다 [6, 8].
## Trade-offs & Caveats
## 모순 및 업데이트 (Contradictions & Updates)
- **과거 데이터와의 충돌:** 자동화 엔진에 의해 매핑된 지식으로, 추후 정밀 검증 필요.
- **정책 변화:** Programming & Language 분야의 자동 자산화 수행.
@@ -39,7 +52,7 @@ last_updated: 2026-05-02
- **과거 데이터와의 충돌:** 자동화 엔진에 의해 매핑된 지식으로, 추후 정밀 검증 필요.
- **정책 변화:** Programming & Language 분야의 자동 자산화 수행.
## 🔗 Knowledge Connections
## 🔗 지식 연결 (Graph)
- **Related Topics:** [[InstancedMesh|InstancedMesh]], Fragment Shading, Early-Z, [[프래그먼트 바운드(Fragment-bound)|프래그먼트 바운드(Fragment-bound]], Draw Call, [[Sorting|Sorting]]
- **Projects/Contexts:** three.js Issue, 대규모 인스턴스 렌더링 및 투명도 처리
- **Contradictions/Notes:** CPU 부하를 유발하는 드로우 콜을 줄이기 위해 InstancedMesh를 도입하더라도, 내부 인스턴스들의 정렬 부재가 유발하는 오버드로우 비용이 더 크다면 오히려 드로우 콜이 많은 개별 메쉬 렌더링 방식보다 FPS가 떨어질 수 있다는 역설적인 결과를 보여줍니다[2, 5].
@@ -59,3 +72,52 @@ last_updated: 2026-05-02
*Last updated: 2026-04-19*
---
## 🤖 LLM 활용 힌트 (How to Use This Knowledge)
**언제 이 지식을 쓰는가:**
- *(TODO)*
**언제 쓰면 안 되는가:**
- *(TODO)*
## 🧪 검증 상태 (Validation)
- **정보 상태:** needs_review
- **출처 신뢰도:** A
- **검토 이유:** *(P-Reinforce Phase 1 자동 정규화. 본문 검증 필요.)*
## 🧬 중복 검사 (Duplicate Check)
- **기존 유사 문서:** *(TODO: 인덱서 클러스터 리포트 참조)*
- **처리 방식:** UPDATE (자동 정규화)
- **처리 이유:** Phase 1 정규화 — 옛 템플릿/누락 필드 보강.
## 🕓 변경 이력 (Changelog)
| 날짜 | 변경 내용 | 처리 방식 | 신뢰도 |
|------|-----------|-----------|--------|
| 2026-05-08 | P-Reinforce Phase 1 정규화 (frontmatter + 헤더 표준화) | UPDATE | A |
## 💻 코드 패턴 (Code Patterns)
**패턴 1:** *(TODO: 이 프로젝트 컨벤션 반영한 구조 스켈레톤)*
```text
# TODO
```
## 🤔 의사결정 기준 (Decision Criteria)
**선택 A를 써야 할 때:**
- *(TODO)*
**선택 B를 써야 할 때:**
- *(TODO)*
**기본값:**
> *(TODO)*
## ❌ 안티패턴 (Anti-Patterns)
- **[안티패턴]:** *(TODO: 무엇을 하면 안 되는가 + 이유 + 대신 무엇을)*