---
id: [[P-Reinforce|P-Reinforce]]-AUTO-C71621
category: Unified
confidence_score: 0.90
tags: [auto-reinforced]
last_reinforced: 2026-04-20
github_commit: "[P-Reinforce] Continuous Worker - [[WebGL|WebGL]]_multi_draw"
---

# [[WEBGL_multi_draw|WEBGL_multi_draw]]

## 📌 한 줄 통찰 (The Karpathy Summary)
> `WEBGL_multi_draw`는 한 번의 드로우 콜([[Draw Call|Draw Call]])로 정렬된 다수의 드로우 요청을 한꺼번에 제출할 수 있게 해주는 WebGL 확장 기능(Extension)입니다 [1, 2]. Three.js에서는 `BatchedMesh`가 이 API를 활용하여 동일한 재질을 공유하지만 각기 다른 기하학적 구조(Geometry)를 가진 여러 객체들을 묶어 렌더링하는 데 사용됩니다 [3-5]. 다양한 고유 객체들을 처리할 때 기존의 개별 호출 방식에 비해 엄청난 성능 향상을 제공하지만, 브라우저 호환성 문제와 대규모 씬에서의 오버헤드 한계를 동시에 안고 있습니다 [6, 7].

## 📖 구조화된 지식 (Synthesized Content)
* **BatchedMesh에서의 활용과 최적화 기능**
  Three.js의 `BatchedMesh` 클래스는 `WEBGL_multi_draw` (구체적으로 `multiDraw` API)를 내부적으로 활용합니다 [1, 2]. 이를 통해 메모리에서 지오메트리를 중복시키지 않으면서도 지오메트리별 정렬([[Sorting|Sorting]]), 시야 절두체 컬링([[Frustum Culling|Frustum Culling]]), 가시성 전환(Visibility Toggling), 인스턴싱 등의 기능을 단일 드로우 콜 내에서 수행할 수 있습니다 [2].
* **InstancedDraw와의 성능 비교**
  수십만 개(예: 10만 개 이상)의 동일한 인스턴스를 그릴 때는 `[[InstancedMesh|InstancedMesh]]`가 사용하는 `instancedDraw`가 더 우수한 성능을 발휘합니다 [3]. 반면, 1,000개 이상의 각기 다른 '고유한(unique)' 지오메트리 객체들을 그려야 할 때는 `multiDrawElementsWEBGL`이 매우 유용합니다 [8]. 10만 개의 고유 지오메트리를 기존의 바인딩 및 렌더링 호출(`bindVertexArray` + `drawElements`)로 처리하는 것과 비교하면, `multiDraw` 방식이 수천 배 더 빠른 속도를 제공합니다 [9].
* **인스턴싱 지원 변형 (Instanced Variants)**
  이 확장 기능에는 `multiDrawArraysInstancedWEBGL` 및 `multiDrawElementsInstancedWEBGL`과 같은 인스턴싱 지원 변형 함수도 포함되어 있습니다 [10]. 이들은 수천 개의 고유 객체와 다수의 인스턴스가 혼합된 복잡한 환경에서 객체들을 하나의 드로우 콜로 묶어 렌더링할 수 있게 해줍니다 [8].
* **브라우저 호환성 제약**
  Firefox 브라우저에서는 현재 `WEBGL_multi_draw` 확장을 지원하지 않습니다 [6, 11]. 이로 인해 Three.js 환경에서는 Firefox 지원을 위해 `gl_DrawID`를 에뮬레이트하는 속성을 추가하고, 지원되지 않을 경우 각 메쉬마다 새로운 드로우 콜을 생성하도록 하는 대체 수단(Fallback)이 필요합니다 [12].
* **성능 병목 현상 및 기술적 한계**
  지오메트리 수가 20만 개에 달할 정도로 규모가 커지면 `BatchedMesh` 사용 시 오히려 CPU 점유율이 치솟고 프레임이 심각하게 떨어지는 문제가 보고되었습니다 [13, 14]. 이는 매 프레임마다 드로우 "시작점(st[[Arts|Arts]])"과 "카운트(counts)" 정보를 담은 약 1.6MB 규모의 버퍼 데이터를 GPU로 업로드해야 하는 통신 오버헤드나, 인디렉트 텍스처 업데이트 지연과 관련이 있을 것으로 추정됩니다 [7, 15]. 또한 인스턴스 렌더링을 적용할 때 `multiDrawArraysInstancedWEBGL` 방식으로는 셰이더 내에서 특정 행렬이나 색상에 접근하기 위한 인스턴스 ID를 직접 검색할 방법이 없어 부가적인 텍스처 우회 처리가 요구되는 한계도 있습니다 [16].

## ⚠️ 모순 및 업데이트 (Contradictions & RL Update)
- **과거 데이터와의 충돌:** 자동화 엔진에 의해 매핑된 지식으로, 추후 정밀 검증 필요.
- **정책 변화:** Graphics & Performance 분야의 자동 자산화 수행.

## 🔗 지식 연결 (Graph)
- **Related Topics:** BatchedMesh, [[InstancedMesh|InstancedMesh]], [[Draw Call|Draw Call]]
- **Projects/Contexts:** Three.js, [[WebGL|WebGL]]
- **Contradictions/Notes:** `WEBGL_multi_draw`는 다수의 고유 객체를 그릴 때 CPU의 드로우 콜 병목을 해소하기 위해 설계되었으나 [1, 9], 역설적으로 특정 임계치(예: 수십만 단위)를 넘어서면 관련 버퍼 업로드 및 GPU 텍스처 업데이트 비용 때문에 오히려 병합된 지오메트리(Merged Geometry) 방식보다 성능이 30~50% 더 악화되는 실증적 모순이 관찰되었습니다 [7, 17, 18].

---
*Last updated: 2026-04-19*

---