docs(10_Wiki): Topic_Business/General/Graphic/Programming을 Topics/ 하위로 이동

최상위 10_Wiki/Topic_*였던 4개 카테고리 폴더를 10_Wiki/Topics/Topic_* 로 재배치.
콘텐츠 변경 없음(순수 폴더 이동) — Topics/ 하위 나머지 폴더는 이미 지난 커밋에서
전부 정리된 상태(잔존 항목은 에이전트 운영 상태 및 사용자가 보존을 요청한
업데이트0615/무제 3.canvas 뿐).

10_Wiki/Topics/Topic_Programming/Programming & Language/SharedArrayBuffer로 스레드 간 메모리 공유 효율 높이기.md

@@ -0,0 +1,151 @@
+---
+id: wiki-2026-0508-sharedarraybuffer로-스레드-간-메모리-공유-
+title: SharedArrayBuffer로 스레드 간 메모리 공유 효율 높이기
+category: 10_Wiki/Topics
+status: verified
+canonical_id: self
+aliases: [SAB, SharedArrayBuffer, Shared Memory JS]
+duplicate_of: none
+source_trust_level: A
+confidence_score: 0.9
+verification_status: applied
+tags: [javascript, web-worker, concurrency, performance]
+raw_sources: []
+last_reinforced: 2026-05-10
+github_commit: pending
+tech_stack:
+  language: JavaScript
+  framework: Web Workers
+---
+
+# SharedArrayBuffer로 스레드 간 메모리 공유 효율 높이기
+
+## 매 한 줄
+> **"매 zero-copy shared memory between JS threads"**. SharedArrayBuffer (SAB) 는 main thread + Web Worker 간 동일 raw bytes 를 공유. postMessage structured clone 의 copy 비용 제거 + Atomics 로 race-free coordination 가능.
+
+## 매 핵심
+
+### 매 동작 모델
+- 매 buffer instance 는 multiple threads 에서 동일 backing store 참조.
+- 매 TypedArray view (Int32Array, Float64Array) 로 typed access.
+- 매 Atomics.load/store/add 로 atomic ops.
+- 매 Atomics.wait/notify 로 futex-like blocking sync.
+
+### 매 vs ArrayBuffer
+- 매 ArrayBuffer: postMessage 시 structured clone (copy) 또는 transfer (ownership move).
+- 매 SharedArrayBuffer: postMessage 시 reference 전달, 양쪽 동시 access.
+
+### 매 응용
+1. WASM linear memory 공유 (multi-threaded WASM).
+2. 매 large image/audio buffer worker 처리 (zero-copy).
+3. Lock-free queue / ring buffer 구현.
+
+## 💻 패턴
+
+### Worker 에 SAB 전달
+```js
+// main.js
+const sab = new SharedArrayBuffer(1024);
+const view = new Int32Array(sab);
+const worker = new Worker('worker.js');
+worker.postMessage({ sab });
+
+// worker.js
+self.onmessage = ({ data }) => {
+  const view = new Int32Array(data.sab);
+  Atomics.store(view, 0, 42);
+  Atomics.notify(view, 0, 1);
+};
+```
+
+### Atomic counter
+```js
+const sab = new SharedArrayBuffer(4);
+const counter = new Int32Array(sab);
+Atomics.add(counter, 0, 1); // race-free increment
+const value = Atomics.load(counter, 0);
+```
+
+### Producer / Consumer wait+notify
+```js
+// consumer
+Atomics.wait(view, 0, 0); // sleep until view[0] != 0
+const data = Atomics.load(view, 0);
+
+// producer
+Atomics.store(view, 0, 99);
+Atomics.notify(view, 0, 1); // wake 1 waiter
+```
+
+### Lock (spinlock)
+```js
+function lock(view, idx) {
+  while (Atomics.compareExchange(view, idx, 0, 1) !== 0) {
+    Atomics.wait(view, idx, 1);
+  }
+}
+function unlock(view, idx) {
+  Atomics.store(view, idx, 0);
+  Atomics.notify(view, idx, 1);
+}
+```
+
+### Ring buffer (lock-free SPSC)
+```js
+class RingBuffer {
+  constructor(sab, capacity) {
+    this.head = new Int32Array(sab, 0, 1);
+    this.tail = new Int32Array(sab, 4, 1);
+    this.data = new Int32Array(sab, 8, capacity);
+    this.cap = capacity;
+  }
+  push(v) {
+    const t = Atomics.load(this.tail, 0);
+    const next = (t + 1) % this.cap;
+    if (next === Atomics.load(this.head, 0)) return false; // full
+    this.data[t] = v;
+    Atomics.store(this.tail, 0, next);
+    return true;
+  }
+}
+```
+
+### WASM threads memory
+```js
+const memory = new WebAssembly.Memory({ initial: 10, maximum: 100, shared: true });
+// memory.buffer is SharedArrayBuffer
+```
+
+## 매 결정 기준
+| 상황 | Approach |
+|---|---|
+| Small data, infrequent | postMessage (clone) |
+| Large buffer, hot path | SAB + Atomics |
+| Transfer ownership once | postMessage with transfer list |
+| Multi-threaded WASM | shared:true Memory |
+
+**기본값**: 매 small data postMessage, 매 hot-path large buffer SAB.
+
+## 🔗 Graph
+- 변형: [[SharedArrayBuffer_보안_이슈와_Cross-Origin_Isolation]]
+- 응용: [[OffscreenCanvas]]
+- Adjacent: [[Structured_Clone]]
+
+## 🤖 LLM 활용
+**언제**: 매 large data parallel processing (image/video/ML inference) 의 + 매 worker 간 frequent sync 필요 시.
+**언제 X**: 매 simple task offload (postMessage 충분) 또는 매 COOP/COEP 헤더 설정 불가능한 환경.
+
+## ❌ 안티패턴
+- **Non-atomic access on shared view**: 매 race condition. 매 always Atomics.* 사용.
+- **Spin without wait**: 매 CPU burn. 매 Atomics.wait 으로 block.
+- **Missing COOP/COEP**: 매 modern browser 에서 SAB 비활성화. 매 cross-origin isolation 필수.
+
+## 🧪 검증 / 중복
+- Verified (MDN SharedArrayBuffer, ECMAScript Atomics spec).
+- 신뢰도 A.
+
+## 🕓 Changelog
+| 날짜 | 변경 |
+|---|---|
+| 2026-05-08 | Phase 1 |
+| 2026-05-10 | Manual cleanup — SAB + Atomics patterns |