4.7 KiB
4.7 KiB
id, category, confidence_score, tags, last_reinforced, github_commit
| id | category | confidence_score | tags | last_reinforced | github_commit | |
|---|---|---|---|---|---|---|
| P-REINFORCE-AUTO-C71621 | 10_Wiki/💡 Topics/Graphics & Performance | 0.90 |
|
2026-04-20 | [P-Reinforce] Continuous Worker - WEBGL_multi_draw |
WEBGL_multi_draw
📌 한 줄 통찰 (The Karpathy Summary)
WEBGL_multi_draw는 한 번의 드로우 콜(Draw Call)로 정렬된 다수의 드로우 요청을 한꺼번에 제출할 수 있게 해주는 WebGL 확장 기능(Extension)입니다 [1, 2]. Three.js에서는BatchedMesh가 이 API를 활용하여 동일한 재질을 공유하지만 각기 다른 기하학적 구조(Geometry)를 가진 여러 객체들을 묶어 렌더링하는 데 사용됩니다 [3-5]. 다양한 고유 객체들을 처리할 때 기존의 개별 호출 방식에 비해 엄청난 성능 향상을 제공하지만, 브라우저 호환성 문제와 대규모 씬에서의 오버헤드 한계를 동시에 안고 있습니다 [6, 7].
📖 구조화된 지식 (Synthesized Content)
- BatchedMesh에서의 활용과 최적화 기능
Three.js의
BatchedMesh클래스는WEBGL_multi_draw(구체적으로multiDrawAPI)를 내부적으로 활용합니다 [1, 2]. 이를 통해 메모리에서 지오메트리를 중복시키지 않으면서도 지오메트리별 정렬(Sorting), 시야 절두체 컬링(Frustum Culling), 가시성 전환(Visibility Toggling), 인스턴싱 등의 기능을 단일 드로우 콜 내에서 수행할 수 있습니다 [2]. - InstancedDraw와의 성능 비교
수십만 개(예: 10만 개 이상)의 동일한 인스턴스를 그릴 때는
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]. 이는 매 프레임마다 드로우 "시작점(starts)"과 "카운트(counts)" 정보를 담은 약 1.6MB 규모의 버퍼 데이터를 GPU로 업로드해야 하는 통신 오버헤드나, 인디렉트 텍스처 업데이트 지연과 관련이 있을 것으로 추정됩니다 [7, 15]. 또한 인스턴스 렌더링을 적용할 때multiDrawArraysInstancedWEBGL방식으로는 셰이더 내에서 특정 행렬이나 색상에 접근하기 위한 인스턴스 ID를 직접 검색할 방법이 없어 부가적인 텍스처 우회 처리가 요구되는 한계도 있습니다 [16].
⚠️ 모순 및 업데이트 (Contradictions & RL Update)
- 과거 데이터와의 충돌: 자동화 엔진에 의해 매핑된 지식으로, 추후 정밀 검증 필요.
- 정책 변화: Graphics & Performance 분야의 자동 자산화 수행.
🔗 지식 연결 (Graph)
- Related Topics: BatchedMesh, InstancedMesh, Draw Call
- Projects/Contexts: Three.js, WebGL
- Contradictions/Notes:
WEBGL_multi_draw는 다수의 고유 객체를 그릴 때 CPU의 드로우 콜 병목을 해소하기 위해 설계되었으나 [1, 9], 역설적으로 특정 임계치(예: 수십만 단위)를 넘어서면 관련 버퍼 업로드 및 GPU 텍스처 업데이트 비용 때문에 오히려 병합된 지오메트리(Merged Geometry) 방식보다 성능이 30~50% 더 악화되는 실증적 모순이 관찰되었습니다 [7, 17, 18].
Last updated: 2026-04-19
- Raw Source: 00_Raw/2026-04-20/WEBGL_multi_draw.md