개요
에디터 WASM은 커질 수 있습니다. wasm-opt·동적 import로
로드 시점을 나누고, CRDT 병합 등 CPU 바운드 작업은 Web Worker를
검토합니다.
빌드·배포
- wasm-pack / trunk — 번들러(Vite 등)와 맞추기.
- wasm-opt — 전후 크기·속도 측정.
- 소스맵 — 개발에만, 프로덕션에서 제거 여부 검토.
번들·스플릿
에디터가 필요한 라우트에서만 WASM을 지연 로드합니다. 검증용 가벼운 모듈과 레이아웃용 무거운 모듈을 나누면 캐시 전략이 쉬워질 수 있습니다.
워커·스레드
CRDT 병합·파싱을 Worker로 옮기면 메인 스레드 반응성이 좋아집니다.
SharedArrayBuffer를 쓰려면 교차 출처 격리(COOP/COEP)가
필요합니다.
선택·IME 동기화는 여전히 메인 스레드—Worker가 입력 지연을 없애주는 마법은 아닙니다.
브라우저 제약
CSP, COEP, 서드파티 임베드는 스레드·CDN WASM 로드에 영향을 줍니다. 배포 환경에서 일찍 검증하세요.
Wasm 가이드
에디팅 방식
contenteditable + WASM: 진실 원천, 이벤트 순서, DOM↔모델 루프, 정규화, Rust 호출 시점.
IME·조합 입력
조합 이벤트, Rust 문서 모델 동기화, IME는 여전히 브라우저 영역인 이유.
JS ↔ WASM 경계
문자열·복사·배치 연산, 비동기와 입력 이벤트, 핫 패스 비용 줄이기.
클립보드·입력 라우팅
beforeinput, 붙여넣기, JS에서 라우팅할지 WASM에서 정제할지.
협업·CRDT (WASM)
Yrs·y-crdt, Yjs 연동, 스냅샷 vs 업데이트 스트림.
선택·Range·오프셋
UTF-16 vs UTF-8, JS Selection/Range, Rust 모델 매핑·getTargetRanges.
실행 취소·다시 실행 모델
브라우저 undo 스택 vs 모델 히스토리, 프로그래밍 DOM, WASM 트랜잭션.
접근성 (WASM 호스트)
편집 표면이 브라우저일 때 역할·포커스·스크린 리더.
테스트·디버깅
E2E, JS↔WASM 경계 프로파일링, IME·붙여넣기 CI 재현.
보안·배포
CSP, SRI, 모듈 무결성, contenteditable 옆 WASM 호스팅.