Files

T

Antigravity Agent f8b21af4be Wiki cleanup: error-doc removal, dedup merge, link normalization

10_Wiki/Topics 대규모 정리:
- 오류 캡처/미완성 stub 문서 227개 제거
- 교차폴더 중복 43클러스터 병합 (63파일 → redirect)
- 링크명 정규화: 깨진 링크 수정·redirect 직결·개념 매핑 ~2,400건
- 카테고리 MOC 6개 신규 생성
- Graph 섹션 미해결 related-keyword 링크 10,058건 제거

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

2026-05-20 23:52:15 +09:00

4.4 KiB

Raw Blame History

id, title, category, status, canonical_id, aliases, duplicate_of, source_trust_level, confidence_score, verification_status, tags, raw_sources, last_reinforced, github_commit, tech_stack

title

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.

매 응용

WASM linear memory 공유 (multi-threaded WASM).
매 large image/audio buffer worker 처리 (zero-copy).
Lock-free queue / ring buffer 구현.

💻 패턴

Worker 에 SAB 전달

// 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

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

// 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)

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)

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

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

4.4 KiB Raw Blame History