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
parent 2a4a5046b6
commit f8b21af4be
2874 changed files with 15296 additions and 27684 deletions
@@ -144,10 +144,7 @@ function applySignature(player: Player, frame: Airframe): void {
 **기본값**: 매 8-frame roster, 1-frame-per-stage unlock, final boss = continuity reveal.

 ## 🔗 Graph
- 부모: [[Boss-Design]] · [[Player-Progression]]
- 변형: [[Skybound-Skill-Concept-and-Hangar-Layout-Overlap-Fix]]
- 응용: [[Meta-Progression-Loops]]
- Adjacent: [[Skybound-Stage-Miniboss-Pattern-Differentiation]] · [[Phase-State-Machine]]
+- 부모: [[Boss-Design]]

 ## 🤖 LLM 활용
 **언제**: roster brainstorm, narrative continuity ideation, balance spreadsheet generation.
@@ -137,10 +137,8 @@ function rescaleForViewport(viewportW: number, viewportH: number) {
 **기본값**: 매 declarative slot grid + 100-unit z-tier + skill 3-kind union type.

 ## 🔗 Graph
- 부모: [[Game-UI-Layout]] · [[Skill-Tree-Design]]
- 변형: [[Skybound-Skip-Upgrade-and-Weapon-Transform-Reconfiguration]]
- 응용: [[Phaser-Container-Composition]]
- Adjacent: [[Skybound-Player-Airframe-and-8Stage-Boss-Continuity-Rework]] · [[Discriminated-Unions]]
+- 부모: [[Skill-Tree-Design]]
+- Adjacent: [[API 응답 및 상태 모델링 (State Modeling and API Responses)|Discriminated-Unions]]

 ## 🤖 LLM 활용
 **언제**: layout slot enumeration, skill taxonomy brainstorm, tooltip copy.
@@ -163,10 +163,6 @@ scene.events.on('phase:enter', (phase: Phase) => {
 **기본값**: 매 4-phase per stage, monotonic exp curve, designer-tunable JSON.

 ## 🔗 Graph
- 부모: [[Game-Loop-Design]] · [[Phaser-3]]
- 변형: [[Skybound-Stage-Miniboss-Pattern-Differentiation]] · [[Skybound-Miniboss-Treasure-Cache-Reward-Loop]]
- 응용: [[Spawner-Pattern]] · [[XP-Curve]]
- Adjacent: [[Vampire-Survivors-Genre]] · [[Bullet-Heaven]]

 ## 🤖 LLM 활용
 **언제**: stage curve tuning, balance spreadsheet 작성, spawn pattern enumeration.
@@ -153,10 +153,6 @@ function makeProjectile(scene, pos, vel) {
 **기본값**: 매 boid+seek mix, 0.4s iframe, 0.5s contact tick, 0.6s telegraph.

 ## 🔗 Graph
- 부모: [[Enemy-AI-Steering]] · [[Combat-Feel]]
- 변형: [[Skybound-Stage-Miniboss-Pattern-Differentiation]]
- 응용: [[Boid-Algorithm]] · [[Predict-Aim]]
- Adjacent: [[Skybound-Player-Sprite-Path-Warning-Fix]] · [[Phaser-3]]

 ## 🤖 LLM 활용
 **언제**: steering weight tuning, telegraph duration enumeration, VFX color spec.
@@ -146,10 +146,7 @@ function spawnPrismaticChest(scene, x: number, y: number, cache: Cache) {
 **기본값**: 매 4-tier cache + weighted drop + cascade modal + prismatic VFX.

 ## 🔗 Graph
- 부모: [[Reward-Loop-Design]] · [[Loot-Tier-System]]
- 변형: [[Skybound-Skip-Upgrade-and-Weapon-Transform-Reconfiguration]]
- 응용: [[Vampire-Survivors-Treasure]]
- Adjacent: [[Skybound-Stage-Miniboss-Pattern-Differentiation]] · [[Random-Sampling]]
+- Adjacent: [[Random-Sampling]]

 ## 🤖 LLM 활용
 **언제**: tier balance brainstorm, drop table generation, VFX spec.
@@ -137,10 +137,6 @@ this.load.on('loaderror', (file: Phaser.Loader.File) => {
 **기본값**: 매 `import.meta.env.BASE_URL` helper + manifest.

 ## 🔗 Graph
- 부모: [[Vite-Asset-Handling]] · [[Phaser-Loader]]
- 변형: [[Asset-Manifest-Pattern]]
- 응용: [[Skybound-Skill-Concept-and-Hangar-Layout-Overlap-Fix]]
- Adjacent: [[Static-Asset-Hashing]] · [[Build-Config]]

 ## 🤖 LLM 활용
 **언제**: asset path bug diagnosis, manifest generation, vite config audit.
@@ -151,10 +151,8 @@ class LevelUpModal extends Phaser.GameObjects.Container {
 **기본값**: 매 3-card + skip + 1 reroll + transform-retains-slot.

 ## 🔗 Graph
- 부모: [[Roguelike-Upgrade-Loop]] · [[Choice-Architecture]]
- 변형: [[Skybound-Skill-Concept-and-Hangar-Layout-Overlap-Fix]]
- 응용: [[Vampire-Survivors-Evolution-Graph]]
- Adjacent: [[Skybound-Miniboss-Treasure-Cache-Reward-Loop]] · [[Discriminated-Unions]]
+- 부모: [[Choice-Architecture]]
+- Adjacent: [[API 응답 및 상태 모델링 (State Modeling and API Responses)|Discriminated-Unions]]

 ## 🤖 LLM 활용
 **언제**: weapon evolution chart, prereq passive brainstorm, skip reward tuning.
@@ -125,10 +125,7 @@ telemetry.track('stage_drop', {
 **기본값**: 매 quantitative telemetry (drop rate, bomb usage) + qualitative feedback (think-aloud). 매 both 의 weight.

 ## 🔗 Graph
- 부모: [[Skybound Playtest Log]] · [[Game Balance]]
- 변형: [[Skybound Stage4-6 Playtest]]
- 응용: [[Difficulty Curve]] · [[Onboarding Design]]
- Adjacent: [[Bullet Hell Design]] · [[Audio Mixing]]
+- 부모: [[게임 밸런싱|Game Balance]]

 ## 🤖 LLM 활용
 **언제**: 매 next playtest planning, 매 balance change rationale draft.
@@ -151,10 +151,7 @@ private runNullZone(p: AttackPattern & { kind: 'null-zone' }, _dt: number, mul:
 **기본값**: 매 8-pattern enum, stage:pattern = 1:1, enrage 1.6x speed mul.

 ## 🔗 Graph
- 부모: [[Boss-Pattern-Design]] · [[Bullet-Hell-Patterns]]
- 변형: [[Skybound-Player-Airframe-and-8Stage-Boss-Continuity-Rework]]
- 응용: [[Skybound-Enemy-Motion-Damage-Pressure-and-Projectile-Visual-Pass]]
- Adjacent: [[Skybound-Miniboss-Treasure-Cache-Reward-Loop]] · [[Discriminated-Unions]]
+- Adjacent: [[API 응답 및 상태 모델링 (State Modeling and API Responses)|Discriminated-Unions]]

 ## 🤖 LLM 활용
 **언제**: pattern enumeration, counter-play brainstorm, telegraph copy.
@@ -173,8 +173,8 @@ function contrast(a: [number,number,number], b: [number,number,number]) {
 ## 🔗 Graph
 - 부모: [[Frontend]] · [[WCAG]]
 - 변형: [[ARIA]] · [[Screen Reader]]
- 응용: [[Keyboard Navigation]] · [[Focus Management]]
- Adjacent: [[Color Contrast]] · [[Semantic HTML]]
+- 응용: [[Focus Management]]
+- Adjacent: [[Semantic HTML]]

 ## 🤖 LLM 활용
 **언제**: ARIA pattern lookup, WCAG criterion explanation, accessibility audit script generation.
@@ -143,9 +143,8 @@ import { Profiler } from 'react';
 **기본값**: do nothing — automatic batching handles it.

 ## 🔗 Graph
- 부모: [[React]] · [[Concurrent Rendering]]
+- 부모: [[React]] · [[Concurrent Features|Concurrent Rendering]]
 - 변형: [[Batching]] · [[startTransition]]
- 응용: [[Form State]] · [[Async Data Fetching]]
 - Adjacent: [[flushSync]] · [[useReducer]]

 ## 🤖 LLM 활용
@@ -152,10 +152,9 @@ card(undefined, 'featured');  // 'card card--featured'
 **기본값**: 2026 신규 프로젝트 — Tailwind / CSS Modules. Legacy / framework-agnostic — BEM.

 ## 🔗 Graph
- 부모: [[CSS]] · [[CSS 구조 설계 방식]]
- 변형: [[OOCSS]] · [[SMACSS]] · [[ITCSS]]
- 응용: [[Design System]] · [[SCSS]]
- Adjacent: [[CSS Modules]] · [[Tailwind CSS]]
+- 부모: [[CSS 구조 설계 방식]]
+- 응용: [[Design System]] · [[SCSS (Sass)|SCSS]]
+- Adjacent: [[CSS Modules]] · [[CSS_Architecture_and_Styling|Tailwind CSS]]

 ## 🤖 LLM 활용
 **언제**: convert legacy CSS to BEM, generate consistent class names, BEM rule lint.
@@ -170,7 +169,7 @@ card(undefined, 'featured');  // 'card card--featured'
 ## 🧪 검증 / 중복
 - Verified (Yandex BEM official, getbem.com).
 - 신뢰도 A.
- 매 동일 wiki에 [[BEM (Block Element Modifier)]] file 존재 — both kept as alias siblings.
+- 매 동일 wiki에 [[BEM|BEM (Block Element Modifier)]] file 존재 — both kept as alias siblings.

 ## 🕓 Changelog
 | 날짜 | 변경 |
@@ -154,10 +154,9 @@ class WriteBatcher {
 **기본값**: framework default, only override when necessary.

 ## 🔗 Graph
- 부모: [[Reactive Programming]] · [[Performance]]
- 변형: [[Automatic Batching]] · [[Microtask Scheduling]]
- 응용: [[Form State]] · [[Animation Loop]]
- Adjacent: [[Debouncing]] · [[Throttling]]
+- 부모: [[Performance]]
+- 변형: [[Automatic Batching]]
+- Adjacent: [[Throttling]]

 ## 🤖 LLM 활용
 **언제**: framework batching behavior 설명, custom batcher prototyping, batching vs debouncing 구분.
@@ -156,9 +156,8 @@ export const UserId = (s: string): UserId => {
 **기본값**: external boundary (DB, API) 에 entry point 에서 brand, internal logic은 branded type만 받음.

 ## 🔗 Graph
- 부모: [[TypeScript]] · [[Type System]]
- 변형: [[Opaque Types]] · [[Phantom Types]]
- 응용: [[Domain Modeling]] · [[ID Type Safety]]
+- 부모: [[TypeScript]] · [[TypeScript 타입 시스템 (TypeScript Type System)|Type System]]
+- 변형: [[Opaque Types]]
 - Adjacent: [[Zod]] · [[Effect-TS]]

 ## 🤖 LLM 활용
@@ -164,8 +164,8 @@ let count = 0;

 ## 🔗 Graph
 - 부모: [[Memory Management]] · [[Performance]]
- 변형: [[Object Pool]] · [[Arena Allocation]]
- 응용: [[WebGPU]] · [[WebCodecs]] · [[WebSocket]]
+- 변형: [[Object Pool]]
+- 응용: [[WebGPU]]
 - Adjacent: [[SharedArrayBuffer]] · [[Typed Array]] · [[Garbage Collection]]

 ## 🤖 LLM 활용
@@ -160,9 +160,9 @@ dayjs.locale('ko');
 **기본값**: measure first → split → compress → swap heavy deps.

 ## 🔗 Graph
- 부모: [[Frontend Performance]] · [[Build Tools]]
- 변형: [[Code Splitting]] · [[Tree Shaking]]
- 응용: [[Core Web Vitals]] · [[LCP]]
+- 부모: [[Frontend Performance]]
+- 변형: [[Code Splitting]]
+- 응용: [[Core Web Vitals Optimization (INP, LCP 개선)|Core Web Vitals]] · [[LCP]]
 - Adjacent: [[Vite]] · [[Rollup]] · [[esbuild]]

 ## 🤖 LLM 활용
@@ -163,9 +163,9 @@ els.forEach((el, i) => el.style.width = widths[i] + 1 + 'px');
 **기본값**: measure → smallest fix → re-measure.

 ## 🔗 Graph
- 부모: [[Frontend Performance]] · [[Core Web Vitals]]
- 변형: [[Long Task]] · [[INP]]
- 응용: [[Web Worker]] · [[Concurrent Rendering]]
+- 부모: [[Frontend Performance]] · [[Core Web Vitals Optimization (INP, LCP 개선)|Core Web Vitals]]
+- 변형: [[INP]]
+- 응용: [[Web Worker]] · [[Concurrent Features|Concurrent Rendering]]
 - Adjacent: [[Bundle Size Optimization]] · [[Hydration]]

 ## 🤖 LLM 활용
@@ -130,9 +130,9 @@ tech_stack:
 **기본값**: 매 layout-first 결정 — Grid. 매 content-first sizing — Flex.

 ## 🔗 Graph
- 부모: [[CSS]] · [[Layout]]
- 변형: [[Flexbox]] · [[Subgrid]] · [[Container Queries]]
- 응용: [[Responsive Design]] · [[Dashboard]]
+- 부모: [[Layout]]
+- 변형: [[Flexbox]] · [[Subgrid]] · [[컨테이너 쿼리 (Container Queries)|Container Queries]]
+- 응용: [[Responsive Design]]
 - Adjacent: [[CSS Grid 및 Flexbox]]

 ## 🤖 LLM 활용
@@ -136,10 +136,10 @@ dark.addEventListener('change', (e) => {
 **기본값**: mobile-first + range syntax (`width >=`).

 ## 🔗 Graph
- 부모: [[CSS]] · [[Responsive Design]]
- 변형: [[Container Queries]] · [[matchMedia]]
- 응용: [[Dark Mode]] · [[Accessibility]]
- Adjacent: [[CSS Grid]] · [[Flexbox]] · [[CSS Variables]]
+- 부모: [[Responsive Design]]
+- 변형: [[컨테이너 쿼리 (Container Queries)|Container Queries]]
+- 응용: [[Dark Mode]] · [[Accessibility (A11y)|Accessibility]]
+- Adjacent: [[CSS Grid]] · [[Flexbox]] · [[CSS_Architecture_and_Styling|CSS Variables]]

 ## 🤖 LLM 활용
 **언제**: responsive breakpoint, dark mode, a11y motion handling 의 generation.
@@ -146,10 +146,9 @@ export default {
 **기본값**: Next.js / Vite 매 component-level styling 의 first choice 로 **CSS Modules**.

 ## 🔗 Graph
- 부모: [[CSS]] · [[Build Tool]]
- 변형: [[CSS-in-JS]] · [[Tailwind CSS]] · [[BEM]]
+- 변형: [[CSS_Architecture_and_Styling|CSS-in-JS]] · [[CSS_Architecture_and_Styling|Tailwind CSS]] · [[BEM]]
 - 응용: [[Next.js]] · [[Vite]] · [[React]]
- Adjacent: [[Vanilla-Extract]] · [[PostCSS]]
+- Adjacent: [[Vanilla-Extract]]

 ## 🤖 LLM 활용
 **언제**: component encapsulation 매 필요, runtime cost 의 회피, TypeScript-friendly typing.
@@ -24,8 +24,7 @@ github_commit: pending
 - 2026 trend: utility-first (Tailwind) + CSS Modules / vanilla-extract — methodology 없이도 scope 격리 build-time 해결.

 ## 🔗 Graph
- 부모: [[BEM]] (canonical) · [[CSS]]
- 변형: [[OOCSS]] · [[SMACSS]] · [[ITCSS]]
+- 부모: [[BEM]] (canonical)

 ## 🕓 변경 이력
 | 날짜 | 변경 |
@@ -132,9 +132,8 @@ el.animate(

 ## 🔗 Graph
 - 부모: [[DOM]] · [[Browser Rendering]]
- 변형: [[CSS Typed OM]] · [[Houdini]]
 - 응용: [[Theme Switching]] · [[Web Animations API]]
- Adjacent: [[Render Tree]] · [[Critical Rendering Path]] · [[CSS Variables]]
+- Adjacent: [[Render Tree]] · [[Critical Rendering Path (CRP)|Critical Rendering Path]] · [[CSS_Architecture_and_Styling|CSS Variables]]

 ## 🤖 LLM 활용
 **언제**: theme system, dynamic styling, JS-driven animation 코드 generation.
@@ -166,9 +166,9 @@ perf stat -e cache-references,cache-misses,L1-dcache-load-misses ./app
 **기본값**: 매 measure first (perf, CDN headers, app counter), 매 90%+ hit rate target on hot caches.

 ## 🔗 Graph
- 부모: [[Performance]] · [[Caching]]
- 변형: [[CPU Cache]] · [[HTTP Cache]] · [[CDN]] · [[Memoization]]
- 응용: [[Prompt Cache]] · [[Database Query Cache]]
+- 부모: [[Performance]]
+- 변형: [[CDN]] · [[Memoization]]
+- 응용: [[Prompt Cache]]
 - Adjacent: [[CPU Overhead]] · [[Buffer Allocation]] · [[Batching]]

 ## 🤖 LLM 활용
@@ -139,8 +139,6 @@ export const Loading = { args: { variant: 'primary', loading: true } };
 **기본값**: 매 incremental, 매 design-system-first, 매 telemetry-gated rollout.

 ## 🔗 Graph
- 부모: [[Frontend Migration]] · [[Strangler Fig Pattern]]
- 변형: [[Airbnb Migration]] · [[Shopify Hydrogen Migration]]
 - 응용: [[Design System]] · [[Turborepo]] · [[Feature Flags]]
 - Adjacent: [[Micro-frontends]] · [[Monorepo]]

@@ -173,10 +173,10 @@ export function Globe() {
 **기본값**: Viewer + Entity (90% case 의 충분).

 ## 🔗 Graph
- 부모: [[3D Visualization]] · [[Geospatial]]
- 변형: [[Three.js]] · [[deck.gl]] · [[MapLibre GL]]
- 응용: [[Digital Twin]] · [[Drone Tracking]]
- Adjacent: [[WebGL]] · [[WebGPU]] · [[3D Tiles]] · [[glTF]]
+- 부모: [[Geospatial]]
+- 변형: [[Three.js]]
+- 응용: [[Digital Twin]]
+- Adjacent: [[WebGL]] · [[WebGPU]]

 ## 🤖 LLM 활용
 **언제**: 3D globe, photogrammetry city, satellite/drone tracking 코드 generation.
@@ -165,10 +165,10 @@ await Page.navigate({ url: 'https://example.com' });
 **기본값**: Chrome stable + Lighthouse CI + Playwright.

 ## 🔗 Graph
- 부모: [[Web Browsers]] · [[Chromium]]
- 변형: [[Edge]] · [[Brave]] · [[Arc]]
- 응용: [[DevTools]] · [[Puppeteer]] · [[Lighthouse]]
- Adjacent: [[V8]] · [[Blink]] · [[CDP]] · [[Web Platform]]
+- 부모: [[Chromium]]
+- 변형: [[Arc]]
+- 응용: [[Lighthouse]]
+- Adjacent: [[V8]] · [[Blink]]

 ## 🤖 LLM 활용
 **언제**: DevTools workflow, extension scaffolding, headless automation 의 generation.
@@ -149,8 +149,8 @@ export default function Page() {
 **기본값**: 매 default Server Component — 매 boundary 를 leaf 에 push, 매 'use client' 매 minimum.

 ## 🔗 Graph
- 부모: [[React Server Components]] · [[Next.js App Router]]
- 변형: [[Server Components]] · [[Server Actions]]
+- 부모: [[React Server Components]]
+- 변형: [[Modern_Web_Rendering_and_Optimization|Server Components]] · [[Server Actions]]
 - 응용: [[Hydration]] · [[Suspense]] · [[Streaming SSR]]
 - Adjacent: [[Islands Architecture]] · [[Astro]]

@@ -143,10 +143,9 @@ npx prerender-spa-plugin --routes /,/about,/pricing
 **기본값**: 매 user-app (login wall 뒤) → CSR. 매 public content → SSR/SSG/RSC.

 ## 🔗 Graph
- 부모: [[Rendering-Strategies]] · [[Frontend-Architecture]]
- 변형: [[Server-Side-Rendering]] · [[Static-Site-Generation]] · [[React-Server-Components]]
- 응용: [[Single-Page-Apps]] · [[Progressive-Web-Apps]]
- Adjacent: [[Core-Web-Vitals]] · [[Code-Splitting]] · [[Hydration]]
+- 부모: [[Rendering-Strategies]] · [[프론트엔드_및_UIUX_표준|Frontend-Architecture]]
+- 변형: [[React-Server-Components]]
+- Adjacent: [[Core Web Vitals Optimization (INP, LCP 개선)|Core-Web-Vitals]] · [[Code-Splitting]] · [[Hydration]]

 ## 🤖 LLM 활용
 **언제**: app-like UX, auth-protected, heavy client interactivity.
@@ -173,10 +173,10 @@ const Checkout = lazy(() => import('checkout/Cart'));
 **기본값**: route-based + heavy-component lazy + vendor chunk.

 ## 🔗 Graph
- 부모: [[Bundling]] · [[Web Performance]]
- 변형: [[Tree Shaking]] · [[Module Federation]]
- 응용: [[Lazy Loading]] · [[Route-based Splitting]]
- Adjacent: [[Vite]] · [[Webpack]] · [[Next.js]] · [[Suspense]]
+- 부모: [[Web Performance]]
+- 변형: [[Module Federation]]
+- 응용: [[Lazy-Loading-Strategies|Lazy Loading]]
+- Adjacent: [[Vite]] · [[Next.js]] · [[Suspense]]

 ## 🤖 LLM 활용
 **언제**: route lazy, heavy component 의 split, vendor chunking 코드 generation.
@@ -152,10 +152,10 @@ pnpm codegen && git add src/gql src/api
 **기본값**: GraphQL → client preset; REST → `openapi-typescript` + `openapi-fetch`.

 ## 🔗 Graph
- 부모: [[Tooling]] · [[Type-Safety]]
- 변형: [[GraphQL]] · [[OpenAPI]] · [[gRPC]]
- 응용: [[React-Query]] · [[urql]] · [[Apollo-Client]]
- Adjacent: [[Schema-First-Design]] · [[Contract-Testing]]
+- 부모: [[Type-Safety]]
+- 변형: [[OpenAPI]] · [[gRPC]]
+- 응용: [[React-Query]]
+- Adjacent: [[Contract-Testing]]

 ## 🤖 LLM 활용
 **언제**: schema-driven API integration / 매 type drift 매 painful 한 monorepo.
@@ -148,10 +148,10 @@ function Stack({ gap = 8, children }: { gap?: number; children: React.ReactNode
 **기본값**: 매 children prop 으로 시작 → 복잡해지면 compound + context.

 ## 🔗 Graph
- 부모: [[React]] · [[Component-Design]]
- 변형: [[Vue-Slots]] · [[Svelte-Snippets]] · [[Web-Components]]
+- 부모: [[React]]
+- 변형: [[Web-Components]]
 - 응용: [[Radix-UI]] · [[Headless-UI]] · [[shadcn]]
- Adjacent: [[Hooks]] · [[Server-Components]] · [[Composition API]]
+- Adjacent: [[Server-Components]] · [[Composition API]]

 ## 🤖 LLM 활용
 **언제**: design system 구축, library API 설계, complex form/dialog UI.
@@ -161,9 +161,8 @@ scope.stop();

 ## 🔗 Graph
 - 부모: [[Composition API]] · [[Vue 3]]
- 변형: [[React-Hooks]] · [[Solid-Primitives]]
- 응용: [[VueUse]] · [[Pinia]] · [[Nuxt-Composables]]
- Adjacent: [[Reactivity]] · [[Component-Composition]]
+- 응용: [[Pinia]]
+- Adjacent: [[Component-Composition]]

 ## 🤖 LLM 활용
 **언제**: stateful logic 매 2+ components 에서 사용 / DOM·async 의 lifecycle wrapping.
@@ -161,8 +161,8 @@ onUnmounted(() => console.log('cleanup'));
 **기본값**: `<script setup>` + Composition API. Options API 는 legacy maintenance only.

 ## 🔗 Graph
- 부모: [[Vue 3]] · [[Reactivity]]
- 변형: [[Options-API]] · [[React-Hooks]] · [[Solid-Signals]]
+- 부모: [[Vue 3]]
+- 변형: [[Options-API]] · [[Solid-Signals]]
 - 응용: [[Composables]] · [[Pinia]] · [[Nuxt]]
 - Adjacent: [[Component-Composition]] · [[TypeScript]]

@@ -165,10 +165,9 @@ export const snapPt = (p: Pt, g: number): Pt => ({ x: snap(p.x, g), y: snap(p.y,
 **기본값**: bbox pre-filter → exact test. Spatial index 매 N>500.

 ## 🔗 Graph
- 부모: [[Algorithms]] · [[Graphics]]
 - 변형: [[Computer-Graphics]] · [[GIS]]
- 응용: [[Canvas-API]] · [[SVG]] · [[WebGL]] · [[Map-Rendering]]
- Adjacent: [[Spatial-Indexing]] · [[Collision-Detection]]
+- 응용: [[SVG]] · [[WebGL]]
+- Adjacent: [[Collision-Detection]]

 ## 🤖 LLM 활용
 **언제**: canvas editor, map UI, drag-select, snapping, boolean ops on shapes.
@@ -139,7 +139,7 @@ watch(list, () => {
 - 부모: [[Composition API]] · [[Vue_Single-File_Components_SFC]]
 - 변형: [[Composables]] · [[Options API]]
 - 응용: [[Pinia]] · [[Server_State_Management]]
- Adjacent: [[Reactive_Programming]] · [[State_Management]]
+- Adjacent: [[State_Management]]

 ## 🤖 LLM 활용
 **언제**: 매 Vue 3 component 의 derived data 정의, 매 async data fetch 의 dependency 변경 추적, 매 form-validation reactive chain.
@@ -170,8 +170,8 @@ scrollToBottom(); // 매 새 item 매 already mounted
 ## 🔗 Graph
 - 부모: [[React]] · [[Performance]]
 - 변형: [[Suspense]] · [[Server-Components]] · [[Streaming-SSR]]
- 응용: [[Next.js-App-Router]] · [[Remix]]
- Adjacent: [[Code-Splitting]] · [[React-Hooks]]
+- 응용: [[Remix]]
+- Adjacent: [[Code-Splitting]]

 ## 🤖 LLM 활용
 **언제**: 매 input lag, expensive list, async-heavy tree, SSR perf.
@@ -2,157 +2,26 @@
 id: wiki-2026-0508-critical-rendering-path-crp
 title: Critical Rendering Path (CRP)
 category: 10_Wiki/Topics
-status: verified
-canonical_id: self
-aliases: [CRP, Browser Render Pipeline]
-duplicate_of: none
+status: duplicate
+canonical_id: wiki-2026-0508-critical-rendering-path
+duplicate_of: "[[Critical Rendering Path (CRP)]]"
+aliases: []
 source_trust_level: A
 confidence_score: 0.9
-verification_status: applied
-tags: [browser, rendering, performance, web-vitals]
-raw_sources: []
-last_reinforced: 2026-05-10
+verification_status: redirected
+tags: [duplicate]
+last_reinforced: 2026-05-20
 github_commit: pending
-tech_stack:
-  language: HTML/CSS/JS
-  framework: Browser
 ---

 # Critical Rendering Path (CRP)

-## 매 한 줄
-> **"매 CRP = HTML/CSS/JS → pixel 의 매 변환 단계 sequence."**. 매 단계: DOM 구축 → CSSOM 구축 → Render Tree → Layout (reflow) → Paint → Composite. 매 단계마다 매 blocking resource 의 latency가 매 LCP / FCP 의 결정. 매 2026 perspective는 INP / Core Web Vitals + speculation rules + View Transitions API.
-
-## 매 핵심
-
-### 매 단계
-1. **DOM**: HTML parse → Document Object Model.
-2. **CSSOM**: CSS parse → CSS Object Model (매 render-blocking).
-3. **Render Tree**: DOM + CSSOM merge — 매 visible nodes only.
-4. **Layout (Reflow)**: geometry 계산 — 매 viewport relative position/size.
-5. **Paint**: 매 pixel 의 fill — layer별.
-6. **Composite**: GPU 의 layer 의 final 합성.
-
-### 매 blocking
- CSS = 매 render-blocking — `<link rel="stylesheet">` HEAD 안에서 매 parse 차단.
- JS = 매 parser-blocking — `<script>` 매 DOM build 차단 (async/defer 외).
- Font = 매 paint-blocking (FOIT) — `font-display: swap` 권장.
-
-### 매 응용
-1. Above-the-fold critical CSS inline.
-2. JS `defer` / `type="module"` — 매 default async.
-3. Preload key resources — `<link rel="preload" as="font">`.
-4. Speculation Rules API (Chrome 122+) — prerender next nav.
-
-## 💻 패턴
-
-### 1. Critical CSS inline
-```html
-<head>
-  <style>
-    /* above-the-fold only */
-    body { margin: 0; font: 16px/1.5 system-ui; }
-    .hero { min-height: 60vh; }
-  </style>
-  <link rel="preload" href="/main.css" as="style" onload="this.rel='stylesheet'">
-  <noscript><link rel="stylesheet" href="/main.css"></noscript>
-</head>
-```
-
-### 2. Defer + module scripts
-```html
-<script src="/app.js" defer></script>
-<script type="module" src="/app.mjs"></script>
-<!-- module = defer by default -->
-```
-
-### 3. Resource hints
-```html
-<link rel="preconnect" href="https://cdn.example.com">
-<link rel="dns-prefetch" href="https://api.example.com">
-<link rel="preload" href="/fonts/inter.woff2" as="font" type="font/woff2" crossorigin>
-<link rel="modulepreload" href="/chunks/router.js">
-```
-
-### 4. font-display swap
-```css
-@font-face {
-  font-family: 'Inter';
-  src: url('/fonts/inter.woff2') format('woff2');
-  font-display: swap; /* avoid FOIT */
-}
-```
-
-### 5. Speculation Rules (Chrome 122+, 2024-)
-```html
-<script type="speculationrules">
-{
-  "prerender": [{ "where": { "href_matches": "/*" }, "eagerness": "moderate" }]
-}
-</script>
-```
-
-### 6. Avoid layout thrash
-```javascript
-// BAD — read/write/read/write triggers reflow each time
-elements.forEach((el) => {
-  el.style.width = el.offsetWidth + 10 + 'px';
-});
-
-// GOOD — batch reads then writes
-const widths = elements.map((el) => el.offsetWidth);
-elements.forEach((el, i) => { el.style.width = widths[i] + 10 + 'px'; });
-```
-
-### 7. CSS containment
-```css
-.card {
-  contain: layout paint style;
-  content-visibility: auto;
-  contain-intrinsic-size: 0 200px;
-}
-```
-
-### 8. View Transitions API (2024-)
-```javascript
-document.startViewTransition(() => {
-  updateDOM();
-});
-```
-
-## 매 결정 기준
-| 상황 | Approach |
-|---|---|
-| LCP > 2.5s | Critical CSS inline + preload hero image. |
-| INP > 200ms | 매 long task 의 break — `scheduler.yield()`. |
-| CLS > 0.1 | 매 fixed dimensions, font-display swap + size-adjust. |
-| 매 deep tree | `content-visibility: auto`. |
-| Next nav predict | Speculation Rules. |
-
-**기본값**: 매 Web Vitals 측정 → 매 bottleneck 식별 → targeted optimization.
+> **이 문서는 [[Critical Rendering Path (CRP)]] 의 중복본입니다.** Canonical 문서로 redirect.

 ## 🔗 Graph
- 부모: [[Browser Rendering]] · [[Web Performance]]
- 변형: [[Server-Side Rendering]] · [[Streaming SSR]]
- 응용: [[Core Web Vitals]] · [[LCP Optimization]]
- Adjacent: [[DOM]] · [[CSSOM]] · [[Layout Thrashing]]
+- 부모: [[Critical Rendering Path (CRP)]] (canonical)

-## 🤖 LLM 활용
-**언제**: 매 resource hint 매 selection, critical CSS extraction script.
-**언제 X**: 매 actual measurement (Lighthouse, WebPageTest) — 매 LLM 추측 X.
-
-## ❌ 안티패턴
- **@import in CSS**: 매 serial download — `<link>` 사용.
- **`<script>` in head w/o defer**: 매 DOM 파싱 차단.
- **Sync XHR**: 매 deprecated — 매 fetch async.
- **Forced sync layout**: 매 read-write-read pattern — batch.
-
-## 🧪 검증 / 중복
- Verified (web.dev, Chrome DevRel docs 2024-2026).
- 신뢰도 A.
-
-## 🕓 Changelog
+## 🕓 변경 이력
 | 날짜 | 변경 |
 |---|---|
-| 2026-05-08 | Phase 1 |
-| 2026-05-10 | Manual cleanup — CRP + Speculation Rules + View Transitions |
+| 2026-05-20 | 중복 병합 — canonical 문서로 redirect |
@@ -1,25 +1,27 @@
 ---
 id: wiki-20260508-critical-rendering-path-redir
 title: Critical Rendering Path
-category: Frontend
-status: merged
-redirect_to: Critical_Rendering_Path
-canonical_id: Critical_Rendering_Path
+category: 10_Wiki/Topics
+status: duplicate
+canonical_id: wiki-2026-0508-critical-rendering-path
+duplicate_of: "[[Critical Rendering Path (CRP)]]"
 aliases: []
-duplicate_of: none
 source_trust_level: A
-confidence_score: 0.92
-tags: [redirect]
-raw_sources: []
-last_reinforced: 2026-05-08
+confidence_score: 0.9
+verification_status: redirected
+tags: [duplicate]
+last_reinforced: 2026-05-20
 github_commit: pending
-inferred_by: Claude Opus 4.7 (auto-merge 2026-05-08)
 ---

 # Critical Rendering Path

-> [!IMPORTANT]
-> 이 문서는 P-Reinforce Phase 2 자동 MERGE에 의해 **[[Critical_Rendering_Path]]**로 통합되었습니다.
+> **이 문서는 [[Critical Rendering Path (CRP)]] 의 중복본입니다.** Canonical 문서로 redirect.

---
-*Redirected to: [[Critical_Rendering_Path]]*
+## 🔗 Graph
+- 부모: [[Critical Rendering Path (CRP)]] (canonical)
+
+## 🕓 변경 이력
+| 날짜 | 변경 |
+|---|---|
+| 2026-05-20 | 중복 병합 — canonical 문서로 redirect |
@@ -192,8 +192,8 @@ function Profile({ promise }: { promise: Promise<User> }) {
 **기본값**: 매 TanStack Query / Zustand 의 use — custom hook은 매 truly specific logic 만.

 ## 🔗 Graph
- 부모: [[React]] · [[Hooks]]
- 변형: [[Vue Composables]] · [[Solid Primitives]]
+- 부모: [[React]]
+- 변형: [[Vue Composables]]
 - 응용: [[Component Library]] · [[Design System]]
 - Adjacent: [[useEffect]] · [[State Management]]

@@ -176,9 +176,8 @@ function getSession() {
 **기본값**: `web-vitals` + 매 1st-party `/collect` + sendBeacon batch + edge ingest.

 ## 🔗 Graph
- 부모: [[Web Analytics]] · [[Observability]]
- 변형: [[Server-Side Tracking]] · [[Privacy-first Analytics]]
- 응용: [[PostHog]] · [[Sentry]] · [[Segment]]
+- 부모: [[Observability]]
+- 응용: [[Sentry]]
 - Adjacent: [[Web Vitals]] · [[GDPR]] · [[ClickHouse]]

 ## 🤖 LLM 활용
@@ -141,9 +141,7 @@ curl -I https://cdn.example.com/main.js.map
 **기본값**: Repro locally → Performance flame → narrow → fix → regression test.

 ## 🔗 Graph
- 부모: [[Web Performance]] · [[Browser DevTools]]
- 변형: [[Node Debugging]] · [[Mobile Web Debugging]]
- 응용: [[React DevTools]] · [[Vue DevTools]] · [[Sentry Replay]]
+- 부모: [[Web Performance]]
 - Adjacent: [[Source Maps]] · [[Lighthouse]]

 ## 🤖 LLM 활용
@@ -184,9 +184,8 @@ declare function navigate<R extends Route>(...args: R['params'] extends undefine
 **기본값**: tsup `dts: true` + `exports` map + declarationMap.

 ## 🔗 Graph
- 부모: [[TypeScript]] · [[Type Systems]]
- 변형: [[Ambient Declarations]] · [[Module Augmentation]]
- 응용: [[Library Authoring]] · [[Monorepo TypeScript]]
+- 부모: [[TypeScript]] · [[TypeScript 타입 시스템 (TypeScript Type System)|Type Systems]]
+- 변형: [[Ambient Declarations]]
 - Adjacent: [[DefinitelyTyped]] · [[tsup]] · [[Vite]]

 ## 🤖 LLM 활용
@@ -174,9 +174,7 @@ npm test
 **기본값**: 매 `@types/*` 의 first 의 try, fallback 의 local `.d.ts`.

 ## 🔗 Graph
- 부모: [[TypeScript]] · [[npm Ecosystem]]
- 변형: [[Inline Type Declarations]] · [[JSDoc Types]]
- 응용: [[Module Augmentation]] · [[Ambient Modules]]
+- 부모: [[TypeScript]]
 - Adjacent: [[tsconfig.json]] · [[Declaration Files]]

 ## 🤖 LLM 활용
@@ -129,10 +129,9 @@ return <div>count: {count()}</div>;
 **기본값**: 매 React 19 + Suspense + Transition + 매 stable key.

 ## 🔗 Graph
- 부모: [[Virtual DOM]] · [[Reconciliation]]
- 변형: [[React Fiber]] · [[Vue Reactivity]] · [[Solid Fine-grained]]
- 응용: [[List Rendering]] · [[Animation]]
- Adjacent: [[Tree Edit Distance]] · [[LIS Algorithm]]
+- 부모: [[Virtual_DOM과_Reconciliation|Virtual DOM]] · [[Reconciliation]]
+- 변형: [[React Fiber]] · [[Vue Reactivity]]
+- 응용: [[Animation]]

 ## 🤖 LLM 활용
 **언제**: 매 keyed-list bug 의 explain, 매 type-swap unmount 의 진단.
@@ -172,10 +172,10 @@ const fetchUserSafe = (id: string): ResultAsync<User, FetchUserError> =>
 **기본값**: domain error 의 tagged union, infrastructure error 의 throw.

 ## 🔗 Graph
- 부모: [[TypeScript]] · [[Type System]]
- 변형: [[Effect TS 및 ts-brand 라이브러리 활용]] · [[Either Monad]]
- 응용: [[Error Boundaries]] · [[Form Validation]] · [[API Client Design]]
- Adjacent: [[Zod]] · [[Pattern Matching]] · [[Exhaustive Checking]]
+- 부모: [[TypeScript]] · [[TypeScript 타입 시스템 (TypeScript Type System)|Type System]]
+- 변형: [[Effect TS 및 ts-brand 라이브러리 활용]]
+- 응용: [[Error Boundaries]]
+- Adjacent: [[Zod]] · [[Pattern Matching]]

 ## 🤖 LLM 활용
 **언제**: domain error 의 modeling, exhaustive switch 의 enforce, async error path 의 explicit.
@@ -157,8 +157,8 @@ const failure = <T,>(error: Error): AsyncState<T> => ({ status: 'error', error }

 ## 🔗 Graph
 - 부모: [[TypeScript]] · [[Type-Driven-Design]]
- 변형: [[State-Machines]] · [[Algebraic-Data-Types]] · [[Sum-Types]]
- 응용: [[XState]] · [[ts-pattern]] · [[React-Query]]
+- 변형: [[Algebraic-Data-Types]] · [[Sum-Types]]
+- 응용: [[XState]] · [[React-Query]]
 - Adjacent: [[Exhaustiveness-Checking]] · [[Pattern-Matching]]

 ## 🤖 LLM 활용
@@ -183,7 +183,6 @@ fn cullCS(@builtin(global_invocation_id) gid: vec3u) {
 ## 🔗 Graph
 - 부모: [[GPU Pipeline]] · [[Real-Time Rendering]]
 - 변형: [[Instancing]] · [[Batching]] · [[Indirect Draw]]
- 응용: [[Particle Systems]] · [[Tilemap Rendering]] · [[UI Rendering]]
 - Adjacent: [[Texture Atlas]] · [[GPU Driven Rendering]] · [[Frustum Culling]]

 ## 🤖 LLM 활용
@@ -173,10 +173,10 @@ function toggleTheme() {
 **기본값**: CSS custom properties + `data-theme` attribute + inline FOUC script.

 ## 🔗 Graph
- 부모: [[CSS Architecture]] · [[Design Tokens]]
- 변형: [[Tailwind CSS 4]] · [[CSS-in-JS]]
- 응용: [[Dark Mode]] · [[Accessibility (a11y)]] · [[White Labeling]]
- Adjacent: [[CSS Custom Properties]] · [[View Transitions API]]
+- 부모: [[CSS_Architecture_and_Styling|CSS Architecture]] · [[Design Tokens]]
+- 변형: [[Tailwind CSS 4]] · [[CSS_Architecture_and_Styling|CSS-in-JS]]
+- 응용: [[Dark Mode]] · [[Accessibility (a11y)]]
+- Adjacent: [[View Transitions API]]

 ## 🤖 LLM 활용
 **언제**: design token system 의 설계, dark mode 구현, multi-brand theming.
@@ -197,8 +197,7 @@ create(context) {

 ## 🔗 Graph
 - 부모: [[ESLint]] · [[AST]]
- 변형: [[Stylelint Plugin]] · [[Biome]]
- 응용: [[Code Review Automation]] · [[Monorepo Tooling]]
+- 변형: [[Biome]]
 - Adjacent: [[Prettier]] · [[TypeScript]]

 ## 🤖 LLM 활용
@@ -203,7 +203,7 @@ function UserProfile() {

 ## 🔗 Graph
 - 부모: [[TypeScript]] · [[Functional Programming]]
- 변형: [[fp-ts]] · [[ZIO]] · [[neverthrow]]
+- 변형: [[fp-ts]]
 - 응용: [[Discriminated Unions for Error Handling]] · [[Dependency Injection]]
 - Adjacent: [[Zod]] · [[Branded Types]] · [[Schema Validation]]

@@ -204,10 +204,6 @@ function ProbabilityBar({ pools }: { pools: AffixPool[] }) {
 **기본값**: data-driven recipe + server-rolled affix + reactive preview UI.

 ## 🔗 Graph
- 부모: [[Game UI Architecture]] · [[Inventory System]]
- 변형: [[Gacha System]] · [[Auto-Battler Merge]]
- 응용: [[Loot System]] · [[Affix Generation]] · [[Item Rarity]]
- Adjacent: [[Server Authority]] · [[Seeded RNG]] · [[Drag-and-Drop UI]]

 ## 🤖 LLM 활용
 **언제**: crafting recipe schema 설계, affix pool weighting, preview reactive UI.
@@ -189,9 +189,8 @@ const SentryBoundary = Sentry.withErrorBoundary(MyApp, {

 ## 🔗 Graph
 - 부모: [[React]] · [[Error Handling]]
- 변형: [[Suspense]] · [[Next.js error.tsx]] · [[react-error-boundary]]
- 응용: [[Sentry Integration]] · [[Crash Reporting]] · [[Resilient UI]]
- Adjacent: [[Discriminated Unions for Error Handling]] · [[TanStack Query]]
+- 변형: [[Suspense]] · [[react-error-boundary]]
+- Adjacent: [[Discriminated Unions for Error Handling]]

 ## 🤖 LLM 활용
 **언제**: production crash protection, third-party widget isolation, Suspense + error 의 combo.
@@ -169,9 +169,9 @@ app.config.errorHandler = (err, instance, info) => {
 **기본값**: Sentry + Replay + per-route ErrorBoundary + global handlers.

 ## 🔗 Graph
- 부모: [[Observability]] · [[Web Reliability]]
- 변형: [[Server Error Handling]] · [[Circuit Breaker]]
- 응용: [[Sentry]] · [[Datadog RUM]] · [[Logrocket]]
+- 부모: [[Observability]]
+- 변형: [[Circuit Breaker]]
+- 응용: [[Sentry]] · [[Logrocket]]
 - Adjacent: [[Source Maps]] · [[Feature Flags]]

 ## 🤖 LLM 활용
@@ -186,9 +186,9 @@ export default [

 ## 🔗 Graph
 - 부모: [[ESLint]] · [[Code Quality]]
- 변형: [[typescript-eslint]] · [[Biome]] (alternative) · [[oxlint]] (alternative)
- 응용: [[Pre-commit Hooks]] · [[CI Linting]]
- Adjacent: [[Prettier]] · [[TSConfig]] · [[Husky]]
+- 변형: [[Biome]] (alternative) · [[oxlint]] (alternative)
+- 응용: [[153_pre-commit과_품질_게이트|Pre-commit Hooks]]
+- Adjacent: [[Prettier]] · [[Husky]]

 ## 🤖 LLM 활용
 **언제**: ESLint setup, rule conflict 의 debug, flat config migration.
@@ -159,9 +159,8 @@ input.addEventListener('input', debounce(search, 300));

 ## 🔗 Graph
 - 부모: [[DOM]] · [[JavaScript]]
- 변형: [[Pointer Events]] · [[Custom Events]] · [[React SyntheticEvent]]
- 응용: [[Event Delegation]] · [[Drag and Drop]] · [[Keyboard Shortcuts]]
- Adjacent: [[Accessibility]] · [[Performance]]
+- 응용: [[Drag and Drop]]
+- Adjacent: [[Accessibility (A11y)|Accessibility]] · [[Performance]]

 ## 🤖 LLM 활용
 **언제**: event listener pattern 의 question, propagation 의 debug, delegation 의 implement.
@@ -147,9 +147,8 @@ function buildHeatmap(fixations, w, h, sigma = 30) {

 ## 🔗 Graph
 - 부모: [[Human Computer Interaction]] · [[XR]]
- 변형: [[Foveated Rendering]] · [[Gaze Interaction]]
- 응용: [[Accessibility]] · [[UX Research]] · [[VR Optimization]]
- Adjacent: [[Apple Vision Pro]] · [[WebXR]] · [[MediaPipe]]
+- 응용: [[Accessibility (A11y)|Accessibility]]
+- Adjacent: [[WebXR]] · [[MediaPipe]]

 ## 🤖 LLM 활용
 **언제**: gaze-based UI 의 design, foveated rendering question, accessibility input.
@@ -146,8 +146,8 @@ function App() {
 ## 🔗 Graph
 - 부모: [[React Native]] · [[React]]
 - 변형: [[TurboModules]] · [[Hermes]] · [[JSI]]
- 응용: [[Reanimated]] · [[React Native Skia]]
- Adjacent: [[Yoga Layout]] · [[Bridge (Legacy)]] · [[Concurrent React]]
+- 응용: [[React Native Skia]]
+- Adjacent: [[Concurrent React]]

 ## 🤖 LLM 활용
 **언제**: RN new architecture migration, TurboModule/Fabric component authoring, JSI binding.
@@ -178,9 +178,9 @@ v.setValueForMode(collection.modes[0].modeId, { r: 0.2, g: 0.4, b: 1, a: 1 });

 ## 🔗 Graph
 - 부모: [[Design Tokens]] · [[Design System]]
- 변형: [[Figma Variables]] · [[Specify]] · [[Supernova]]
- 응용: [[Style Dictionary]] · [[Tailwind Theme]] · [[Component Library]]
- Adjacent: [[DTCG]] · [[CSS Variables]]
+- 변형: [[Figma Variables]]
+- 응용: [[Style Dictionary Pipelines|Style Dictionary]] · [[Component Library]]
+- Adjacent: [[CSS_Architecture_and_Styling|CSS Variables]]

 ## 🤖 LLM 활용
 **언제**: 매 token JSON 의 scaffolding, Style Dictionary config, 매 alias 검증.
@@ -194,10 +194,10 @@ export default [{
 **기본값**: feature-based + shared layer + ESLint boundary enforcement.

 ## 🔗 Graph
- 부모: [[Software Architecture]] · [[Frontend Architecture]]
- 변형: [[Feature-Sliced Design]] · [[Atomic Design]] · [[Screaming Architecture]]
+- 부모: [[Software Architecture]] · [[Large_Frontend_Projects|Frontend Architecture]]
+- 변형: [[Feature-Sliced Design]] · [[Atomic Design]]
 - 응용: [[Monorepo]] · [[Design System]]
- Adjacent: [[Next.js]] · [[Turborepo]] · [[Module Boundaries]]
+- Adjacent: [[Next.js]] · [[Turborepo]]

 ## 🤖 LLM 활용
 **언제**: project structure 의 design, refactor folder layout, boundary rule 의 setup.
@@ -234,8 +234,6 @@ export { Card }   from "./Card";
 ## 🔗 Graph
 - 부모: [[Software Architecture]] · [[Project Structure]]
 - 변형: [[Feature-Sliced Design]] · [[Atomic Design]] · [[Clean Architecture]]
- 응용: [[Monorepo with Turbo]] · [[Next.js App Router]]
- Adjacent: [[ESLint Boundaries]] · [[TypeScript Path Aliases]] · [[Barrel Exports]]

 ## 🤖 LLM 활용
 **언제**: new project 의 scaffold, legacy reorg, monorepo migration, dependency direction 의 enforce.
@@ -141,10 +141,8 @@ async function process(items) {
 **기본값**: Vite + React 19 + TS strict + ESLint + Vitest. 매 SSR 필요 시 매 Next 15.

 ## 🔗 Graph
- 부모: [[Web Development]] · [[Software Engineering]]
- 변형: [[Mobile App]] · [[Desktop App]]
- 응용: [[E-commerce]] · [[Dashboard]] · [[Content Site]]
- Adjacent: [[React]] · [[Performance]] · [[Accessibility]] · [[CSS]]
+- 응용: [[E-commerce]]
+- Adjacent: [[React]] · [[Performance]] · [[Accessibility (A11y)|Accessibility]]

 ## 🤖 LLM 활용
 **언제**: 매 stack 선택, 매 perf 진단, 매 pattern (RSC, Suspense, View Transitions) 적용.
@@ -164,9 +164,9 @@ const area = (sh: Shape): number => {

 ## 🔗 Graph
 - 부모: [[TypeScript]] · [[Functional Programming]]
- 변형: [[Effect-TS]] · [[fp-ts]] · [[Rambda]]
+- 변형: [[Effect-TS]] · [[fp-ts]]
 - 응용: [[Validation]] · [[API Client]] · [[State Management]]
- Adjacent: [[Zod]] · [[Lenses]] · [[Algebraic Effects]]
+- Adjacent: [[Zod]]

 ## 🤖 LLM 활용
 **언제**: 매 typed error model 설계, 매 schema-first API, 매 effect-heavy domain code.
@@ -181,9 +181,7 @@ texture.destroy();

 ## 🔗 Graph
 - 부모: [[WebGPU]] · [[Computer Graphics]]
- 변형: [[Vulkan Resources]] · [[Metal Resources]] · [[D3D12 Resources]]
- 응용: [[PBR Pipeline]] · [[Post Processing]] · [[Compute Shader]]
- Adjacent: [[Shader Language]] · [[Framebuffer]] · [[Sampler]]
+- 응용: [[Post Processing]] · [[Compute Shader]]

 ## 🤖 LLM 활용
 **언제**: 매 GPU pipeline 설계, 매 memory budget, 매 binding layout debug.
@@ -159,8 +159,8 @@ function record(ms) {
 ## 🔗 Graph
 - 부모: [[WebGL]] · [[GPU]]
 - 변형: [[WebGPU]] · [[Vulkan]]
- 응용: [[Web-Game-Performance]] · [[Three.js]]
- Adjacent: [[Frame-Pacing]] · [[Browser-Compositor]]
+- 응용: [[Three.js]]
+- Adjacent: [[Browser-Compositor]]

 ## 🤖 LLM 활용
 **언제**: WebGL/WebGPU 앱 의 frame budget 초과 진단, 60→120Hz 마이그레이션, mobile thermal 분석.
@@ -167,10 +167,8 @@ config: {
 **기본값**: client-preset + fragmentMasking, CI 의 codegen drift check.

 ## 🔗 Graph
- 부모: [[GraphQL]] · [[TypeScript]]
- 변형: [[urql]] · [[Apollo-Client]] · [[Relay]]
- 응용: [[Type-Safe-API-Client]] · [[Persisted-Queries]]
- Adjacent: [[OpenAPI-Codegen]] · [[tRPC]]
+- 부모: [[TypeScript]]
+- Adjacent: [[OpenAPI-Codegen]]

 ## 🤖 LLM 활용
 **언제**: GraphQL schema 가 있는 TS project, multi-team 의 schema drift 방지, persisted query 도입.
@@ -129,10 +129,7 @@ float3 spec    = pow(saturate(dot(N, H)), _Power) * specMask * _SpecColor;
 **기본값**: ramp + inverted hull + face light override. 매 modern (Unreal/Unity) 모두 매 stable.

 ## 🔗 Graph
- 부모: [[Computer Graphics]] · [[NPR]]
- 변형: [[Cel Shading]] · [[Genshin Impact Rendering]] · [[Borderlands Outline]]
- 응용: [[VTuber Rendering]] · [[Anime Game]]
- Adjacent: [[Toon Shader]] · [[Outline Shader]] · [[Ramp Texture]]
+- 부모: [[Computer Graphics]]

 ## 🤖 LLM 활용
 **언제**: 매 anime / cel-shading 재현, 매 NPR 학습, 매 outline / shadow 의 매 trick 분석.
@@ -138,10 +138,9 @@ react-native bundle \
 **기본값**: Hermes ON. 매 RN 0.70+ 자동.

 ## 🔗 Graph
- 부모: [[JavaScript Engine]] · [[React Native]]
- 변형: [[V8]] · [[JavaScriptCore]] · [[QuickJS]]
- 응용: [[Mobile App Performance]] · [[Cold Start Optimization]]
- Adjacent: [[Bytecode]] · [[AOT Compilation]] · [[GC]]
+- 부모: [[React Native]]
+- 변형: [[V8]] · [[JavaScriptCore]]
+- Adjacent: [[Bytecode]] · [[GC]]

 ## 🤖 LLM 활용
 **언제**: 매 RN startup 분석, 매 bundle size 최적화, 매 JS engine trade-off.
@@ -149,8 +149,8 @@ hydrateRoot(document, <App />, {
 ## 🔗 Graph
 - 부모: [[Hydration]] · [[SSR]]
 - 변형: [[Selective Hydration]] · [[Streaming SSR]]
- 응용: [[Next.js App Router]] · [[Remix]] · [[Astro]]
- Adjacent: [[useId]] · [[useEffect]] · [[React 19]]
+- 응용: [[Remix]] · [[Astro]]
+- Adjacent: [[useEffect]]

 ## 🤖 LLM 활용
 **언제**: 매 hydration error stack 분석, 매 SSR 코드 review, 매 timezone bug 진단.
@@ -123,10 +123,9 @@ code --disable-gpu
 **기본값**: settings.json 의 watcherExclude + maxTsServerMemory 부터 시작.

 ## 🔗 Graph
- 부모: [[VSCode]] · [[Cursor IDE]]
- 변형: [[Electron Crash]] · [[Memory Leak Prevention]]
- 응용: [[Monorepo Setup]] · [[Large-scale Application Refactoring]]
- Adjacent: [[TypeScript Performance]] · [[Node Memory Tuning]]
+- 부모: [[Cursor IDE]]
+- 응용: [[Monorepo|Monorepo Setup]] · [[Large-scale Application Refactoring]]
+- Adjacent: [[TypeScript Performance]]

 ## 🤖 LLM 활용
 **언제**: IDE crash log 분석, settings.json tuning, extension 충돌 진단.
@@ -135,10 +135,8 @@ BackdropFilter(
 **기본값**: 매 Impeller 활성화 유지 (Flutter 3.27+).

 ## 🔗 Graph
- 부모: [[Flutter]] · [[Rendering-Engines]]
+- 부모: [[Flutter]]
 - 변형: [[Skia]] · [[Metal]] · [[Vulkan]]
- 응용: [[Flutter-Performance]] · [[Custom-Painter]]
- Adjacent: [[Shader-Precompilation]] · [[Tessellation]]

 ## 🤖 LLM 활용
 **언제**: Flutter 앱 의 jank 진단, custom shader 작성, iOS/Android rendering 차이 디버깅.
@@ -153,9 +153,9 @@ fn occluded(bsphere: vec4<f32>) -> bool {
 **기본값**: large dynamic scene 의 GPU-driven indirect pipeline. Small scene 의 direct draw.

 ## 🔗 Graph
- 부모: [[GPU Rendering]] · [[Graphics Pipeline]]
- 변형: [[Multi-Draw Indirect]] · [[GPU-Driven Rendering]]
- 응용: [[Frustum Culling]] · [[Occlusion Culling]] · [[Nanite]]
+- 부모: [[Graphics Pipeline]]
+- 변형: [[GPU-Driven Rendering]]
+- 응용: [[Frustum Culling]] · [[Nanite]]
 - Adjacent: [[WebGPU]] · [[Vulkan]] · [[Compute Shader]]

 ## 🤖 LLM 활용
@@ -153,9 +153,9 @@ void main() {
 **기본값**: ≥100 copies of same mesh → InstancedMesh.

 ## 🔗 Graph
- 부모: [[GPU Rendering]] · [[Draw Call Optimization]]
- 변형: [[BatchedMesh]] · [[Indirect Drawing]] · [[Mesh Shader]]
- 응용: [[Three.js]] · [[WebGPU]] · [[Unity GPU Instancer]]
+- 부모: [[Draw Call Optimization]]
+- 변형: [[BatchedMesh]] · [[Indirect Drawing]]
+- 응용: [[Three.js]] · [[WebGPU]]
 - Adjacent: [[Frustum Culling]] · [[LOD]]

 ## 🤖 LLM 활용
@@ -175,9 +175,9 @@ export default codegenNativeComponent<NativeProps>('MyView');

 ## 🔗 Graph
 - 부모: [[React-Native]] · [[Hermes]]
- 변형: [[Old-Bridge]] · [[Fabric]] · [[TurboModules]]
- 응용: [[Reanimated]] · [[MMKV]] · [[VisionCamera]]
- Adjacent: [[Hermes-Bytecode]] · [[New-Architecture]]
+- 변형: [[Fabric]] · [[TurboModules]]
+- 응용: [[MMKV]]
+- Adjacent: [[New-Architecture]]

 ## 🤖 LLM 활용
 **언제**: RN 의 native module 작성, performance bottleneck 진단, sync API 필요.
@@ -171,9 +171,8 @@ declare global {

 ## 🔗 Graph
 - 부모: [[React]] · [[TypeScript]]
- 변형: [[TSX]] · [[MDX]] · [[Vue-Template]]
- 응용: [[React-Components]] · [[Polymorphic-Components]]
- Adjacent: [[Babel]] · [[SWC]] · [[esbuild]]
+- 변형: [[TSX]] · [[MDX]]
+- Adjacent: [[SWC]] · [[esbuild]]

 ## 🤖 LLM 활용
 **언제**: React/Preact/Solid component 작성, TS JSX 설정 디버깅, polymorphic API 설계.
@@ -161,9 +161,9 @@ export default config;

 ## 🔗 Graph
 - 부모: [[JavaScript]] · [[Concurrency]]
- 변형: [[Node.js Event Loop]] · [[Browser Rendering]]
- 응용: [[React Concurrent Mode]] · [[Web Workers]]
- Adjacent: [[Promises]] · [[AbortController]] · [[Streams]]
+- 변형: [[Browser Rendering]]
+- 응용: [[React Concurrent Mode]] · [[Web Worker (웹 워커)|Web Workers]]
+- Adjacent: [[AbortController]] · [[Streams]]

 ## 🤖 LLM 활용
 **언제**: 매 race / ordering bug 분석, 매 long-task profiling, 매 SSR streaming 설계.
@@ -199,9 +199,9 @@ for (const v of filter(map(range(0, 1e9), x => x * 2), x => x % 3 === 0)) {

 ## 🔗 Graph
 - 부모: [[JavaScript]] · [[V8]]
- 변형: [[Hermes-Optimization]] · [[JSC]]
- 응용: [[Web-Workers]] · [[Animation-Performance]]
- Adjacent: [[Garbage-Collection]] · [[Hidden-Classes]]
+- 변형: [[JSC]]
+- 응용: [[Web Worker (웹 워커)|Web-Workers]] · [[Animation-Performance]]
+- Adjacent: [[Garbage-Collection]]

 ## 🤖 LLM 활용
 **언제**: 매 measurable bottleneck 진단 후, hot loop 작성, large data transform.
@@ -114,10 +114,10 @@ if (ref) { /* still alive */ }
 **기본값**: server는 V8/Node, mobile WebView는 JSC, fast CLI는 Bun.

 ## 🔗 Graph
- 부모: [[JavaScript Engine]] · [[WebKit]]
- 변형: [[V8]] · [[Hermes]] · [[SpiderMonkey]]
- 응용: [[Bun Runtime]] · [[Safari]] · [[React Native]]
- Adjacent: [[JIT Compiler]] · [[Garbage Collection]]
+- 부모: [[WebKit]]
+- 변형: [[V8]] · [[Hermes]]
+- 응용: [[React Native]]
+- Adjacent: [[Garbage Collection]]

 ## 🤖 LLM 활용
 **언제**: iOS WebView 성능 분석, Bun 코드 최적화, JSC-specific bug 진단.
@@ -129,10 +129,9 @@ function Page() {
 **기본값**: 매 measure → matrix → smallest reversible step.

 ## 🔗 Graph
- 부모: [[Software Engineering]] · [[Architecture Decision]]
- 변형: [[Trade-off Analysis]] · [[ADR]]
- 응용: [[Frontend Architecture]] · [[Performance Budget]]
- Adjacent: [[Core Web Vitals]] · [[Accessibility]] · [[DX]]
+- 변형: [[ADR]]
+- 응용: [[Large_Frontend_Projects|Frontend Architecture]]
+- Adjacent: [[Core Web Vitals Optimization (INP, LCP 개선)|Core Web Vitals]] · [[Accessibility (A11y)|Accessibility]] · [[DX]]

 ## 🤖 LLM 활용
 **언제**: 매 framework / library 선택 시, 매 RFC 작성, 매 trade-off 명시화.
@@ -142,10 +142,7 @@ function renderProgress(state: HolySiteState, serverTime: number) {
 **기본값**: server-authoritative state, viewport-based delta, Redis-cached leaderboard.

 ## 🔗 Graph
- 부모: [[MMO Game Architecture]] · [[Cross-Shard Event]]
- 변형: [[SvS]] · [[GvG (Guild vs Guild)]] · [[Lost Kingdom]]
- 응용: [[Rise of Kingdoms]] · [[Lords Mobile]] · [[Evony]]
- Adjacent: [[Game Server Sharding]] · [[Real-time Multiplayer Sync]]
+- 응용: [[Rise of Kingdoms]]

 ## 🤖 LLM 활용
 **언제**: KvK frontend 설계, cross-shard matchmaking, leaderboard cache 설계.
@@ -145,9 +145,9 @@ console.log(unstable_getCurrentPriorityLevel());

 ## 🔗 Graph
 - 부모: [[React]] · [[React Fiber]]
- 변형: [[Expiration Time Model]] (legacy) · [[Scheduler]]
+- 변형:  (legacy) · [[Scheduler]]
 - 응용: [[startTransition]] · [[useDeferredValue]] · [[Suspense]]
- Adjacent: [[Concurrent Rendering]] · [[Time Slicing]] · [[OffscreenComponent]]
+- Adjacent: [[Concurrent Features|Concurrent Rendering]] · [[Time_Slicing|Time Slicing]]

 ## 🤖 LLM 활용
 **언제**: 매 React internal 분석, 매 perf debug, 매 transition 설계.
@@ -159,10 +159,10 @@ Goal: Move auth from monolith to service
 **기본값**: incremental + feature flag + CI invariant. Big-bang rewrite 의 X.

 ## 🔗 Graph
- 부모: [[Software Architecture]] · [[Refactoring]]
- 변형: [[Strangler Fig Pattern]] · [[Codemod]] · [[Feature Flag]]
- 응용: [[Monorepo Setup]] · [[TS Migration]] · [[Next.js App Router Migration]]
- Adjacent: [[Dependency Cruiser]] · [[Mikado Method]]
+- 부모: [[Software Architecture]] · [[Refactoring_Best_Practices|Refactoring]]
+- 변형: [[Feature Flag]]
+- 응용: [[Monorepo|Monorepo Setup]]
+- Adjacent: [[Dependency Cruiser]]

 ## 🤖 LLM 활용
 **언제**: refactor 전략 설계, codemod 작성, dependency rule 작성.
@@ -118,10 +118,9 @@ L4 → L5: Source code 읽기 + 매 design doc 작성
 **기본값**: 매 production code 매 책임지려면 매 L3 minimum, 매 L4 권장.

 ## 🔗 Graph
- 부모: [[Learning-Theory]] · [[Mental-Models]]
- 변형: [[Bloom-Taxonomy]] · [[Dreyfus-Model]] · [[Feynman-Technique]]
- 응용: [[Code-Review]] · [[Onboarding]] · [[Self-Assessment]]
- Adjacent: [[Deliberate-Practice]] · [[Knowledge-Transfer]]
+- 부모: [[Mental_Models|Mental-Models]]
+- 응용: [[Code-Review]] · [[Onboarding]]
+- Adjacent: [[Deliberate-Practice]]

 ## 🤖 LLM 활용
 **언제**: 매 self-assessment, 매 학습 priorities 결정, 매 team capability mapping, 매 documentation target audience 명시.
@@ -186,9 +186,8 @@ function onCloseStandalone() { console.log("closed", Date.now()); }

 ## 🔗 Graph
 - 부모: [[Garbage Collection]] · [[Performance Optimization]]
- 변형: [[Detached DOM]] · [[Closure Capture]] · [[Timer Leak]]
- 응용: [[React useEffect]] · [[Three.js Dispose]] · [[WebGL Cleanup]]
- Adjacent: [[WeakRef]] · [[AbortController]] · [[OffscreenCanvas와 Web Worker]]
+- 변형: [[Detached DOM]]
+- Adjacent: [[WeakRef]] · [[AbortController]]

 ## 🤖 LLM 활용
 **언제**: SPA leak 진단, useEffect cleanup 작성, dispose chain 설계.
@@ -184,10 +184,8 @@ console.log(`Snapshot: ${path}`);
 **기본값**: 매 Heap Snapshot 3-snapshot diff — 매 retainer chain 매 따라 root 매 식별.

 ## 🔗 Graph
- 부모: [[JavaScript-Performance]] · [[Garbage-Collection]]
- 변형: [[Node-js-Memory-Profiling]] · [[V8-Heap-Analysis]]
- 응용: [[SPA-Performance]] · [[Long-Running-Apps]]
- Adjacent: [[Chrome-DevTools]] · [[WeakMap]] · [[AbortController]] · [[FinalizationRegistry]]
+- 부모: [[Garbage-Collection]]
+- Adjacent: [[Chrome-DevTools]] · [[AbortController]]

 ## 🤖 LLM 활용
 **언제**: 매 SPA/long-running app 의 메모리 증가, 매 unmount 후 referent 잔존, 매 production memory metrics 의 anomaly.
@@ -142,9 +142,7 @@ cloudStorage.Save("save.dat", saveBytes); // 매 cross-device sync
 **기본값**: OpenXR + Quest 3 (90Hz, hand tracking, MR passthrough).

 ## 🔗 Graph
- 부모: [[Virtual-Reality]] · [[XR-Distribution]]
- 변형: [[SideQuest]] · [[Steam-VR]] · [[PSVR2-Store]]
- 응용: [[Unity-XR]] · [[Unreal-VR]] · [[OpenXR]]
+- 부모: [[Virtual-Reality]]
 - Adjacent: [[WebXR]] · [[Mixed-Reality]]

 ## 🤖 LLM 활용
@@ -236,10 +236,9 @@ channel.onmessage = ({ data }) => {
 **기본값**: 매 React/Vue 균일 stack 매 Module Federation, 매 framework 혼재 매 Single-SPA + Web Components.

 ## 🔗 Graph
- 부모: [[Frontend-Architecture]] · [[Microservices]]
- 변형: [[Module-Federation]] · [[Single-SPA]] · [[Web-Components]] · [[Bit]]
- 응용: [[Strangler-Fig-Pattern]] · [[Multi-Team-Frontend]]
- Adjacent: [[Monorepo]] · [[Vite]] · [[Webpack]] · [[Edge-Side-Includes]]
+- 부모: [[프론트엔드_및_UIUX_표준|Frontend-Architecture]] · [[Microservices]]
+- 변형: [[Module-Federation]] · [[Web-Components]]
+- Adjacent: [[Monorepo]] · [[Vite]]

 ## 🤖 LLM 활용
 **언제**: 매 large team (50+ FE devs), 매 independent deploy 필요, 매 legacy modernization, 매 multi-tenant white-label.
@@ -201,9 +201,8 @@ func session(_ session: ARSession, didAdd anchors: [ARAnchor]) {
 **기본값**: 매 cross-platform 매 Unity AR Foundation, 매 native 매 ARKit/ARCore 직접.

 ## 🔗 Graph
- 부모: [[Augmented-Reality]] · [[Computer-Vision]]
- 변형: [[ARKit]] · [[ARCore]] · [[WebXR]] · [[Unity-AR-Foundation]]
- 응용: [[Geospatial-AR]] · [[Face-Tracking]] · [[Object-Capture]]
+- 부모: [[Computer Vision|Computer-Vision]]
+- 변형: [[ARKit]] · [[ARCore]] · [[WebXR]]
 - Adjacent: [[SLAM]] · [[OpenGL ES]] · [[Metal]] · [[Vulkan]] · [[Vision-Pro]]

 ## 🤖 LLM 활용
@@ -220,10 +220,9 @@ GET  /api/user_list          ← snake — 매 X (web convention)
 **기본값**: 매 language idiom 매 따라 매 + 매 boolean 매 predicate prefix + 매 verb-first function.

 ## 🔗 Graph
- 부모: [[Code-Style]] · [[Readability]]
- 변형: [[BEM]] (CSS) · [[Hungarian-Notation]] (legacy)
- 응용: [[ESLint]] · [[Linter-Configuration]] · [[API-Design]]
- Adjacent: [[Clean-Code]] · [[Self-Documenting-Code]]
+- 변형: [[BEM]] (CSS) ·  (legacy)
+- 응용: [[ESLint]] · [[API-Design]]
+- Adjacent: [[Clean-Code]]

 ## 🤖 LLM 활용
 **언제**: 매 새 codebase setup, 매 cross-language API design, 매 linter config, 매 code review checklist.
@@ -175,9 +175,8 @@ import Image from "next/image";
 **기본값**: App Router + RSC + PPR. Pages Router 는 매 legacy.

 ## 🔗 Graph
- 부모: [[React]] · [[SSR Framework]]
+- 부모: [[React]]
 - 변형: [[Remix]] · [[Astro]] · [[SvelteKit]]
- 응용: [[Vercel Deployment]] · [[Shopify Hydrogen]]
 - Adjacent: [[React Server Components]] · [[Turbopack]] · [[Edge Runtime]]

 ## 🤖 LLM 활용
@@ -153,10 +153,6 @@ export const env = envSchema.parse(process.env);
 **기본값**: 매 globalThis + `declare global { var ... }` (top-level export 로 module 화).

 ## 🔗 Graph
- 부모: [[TypeScript-Declaration-Merging]] · [[Node.js-Globals]]
- 변형: [[ProcessEnv-Typing]] · [[Module-Augmentation]]
- 응용: [[Prisma-Singleton]] · [[Test-Setup]] · [[Env-Validation]]
- Adjacent: [[ESM-vs-CJS]] · [[tsconfig-types]]

 ## 🤖 LLM 활용
 **언제**: dev singleton, typed env, test global mock, runtime polyfill.
@@ -212,8 +212,8 @@ function fromJson(j: UserJson): User {
 **기본값**: 매 `Brand<T, 'Name'>` intersection — 매 zero runtime cost + 매 sufficient nominal effect.

 ## 🔗 Graph
- 부모: [[TypeScript]] · [[Type-System]]
- 변형: [[Branded-Types]] · [[Opaque-Types]] · [[Phantom-Types]]
+- 부모: [[TypeScript]] · [[TypeScript 타입 시스템 (TypeScript Type System)|Type-System]]
+- 변형: [[Branded-Types]] · [[Opaque-Types]]
 - 응용: [[Domain-Driven-Design]] · [[Value-Object]] · [[Refinement-Type]]
 - Adjacent: [[Effect-TS]] · [[Zod]] · [[Type-Safety]] · [[Smart-Constructor]]

@@ -147,10 +147,10 @@ async function processInChunks(blob: Blob, chunkSize = 1024) {
 **기본값**: feature-detect + 매 main-thread fallback path 매 항상 유지.

 ## 🔗 Graph
- 부모: [[Web-Workers]] · [[Canvas-API]]
- 변형: [[OffscreenCanvas]] · [[ImageBitmap]]
- 응용: [[Image-Processing]] · [[Chart-Rendering]] · [[WebGL]]
- Adjacent: [[Browser-Compatibility]] · [[Safari-Quirks]] · [[WebGPU]]
+- 부모: [[Web Worker (웹 워커)|Web-Workers]]
+- 변형: [[OffscreenCanvas]]
+- 응용: [[WebGL]]
+- Adjacent: [[WebGPU]]

 ## 🤖 LLM 활용
 **언제**: heavy canvas 작업의 worker 위임 + Safari/iOS target.
@@ -180,8 +180,8 @@ worker.postMessage({ state: sab });
 ## 🔗 Graph
 - 부모: [[Web Worker]] · [[Performance Optimization]]
 - 변형: [[SharedWorker]] · [[Service Worker]] · [[WebGPU Compute]]
- 응용: [[Three.js]] · [[Game Canvas]] · [[Image Editor]]
- Adjacent: [[SharedArrayBuffer]] · [[Transferable Objects]] · [[Memory Leak Prevention]]
+- 응용: [[Three.js]]
+- Adjacent: [[SharedArrayBuffer]]

 ## 🤖 LLM 활용
 **언제**: canvas-heavy app 설계, main thread jank 진단, worker 통신 설계.
@@ -175,10 +175,10 @@ function BadChild({ obj }: { obj: { count: number } }) {
 **기본값**: state 매 highest common ancestor 또는 매 store. 매 props down + callback up.

 ## 🔗 Graph
- 부모: [[React]] · [[Flux-Architecture]]
- 변형: [[Redux]] · [[Zustand]] · [[Pinia]]
- 응용: [[Lifting-State-Up]] · [[useReducer]] · [[Event-Sourcing]]
- Adjacent: [[Two-way-Binding]] · [[Reactive-Streams]] · [[Signals]]
+- 부모: [[React]]
+- 변형: [[프론트엔드_및_UIUX_표준|Redux]] · [[Zustand]] · [[Pinia]]
+- 응용: [[useReducer]] · [[Event-Sourcing]]
+- Adjacent: [[Reactive-Streams]] · [[Signals]]

 ## 🤖 LLM 활용
 **언제**: React/Vue/Solid component design, form lifting, store architecture.
@@ -132,10 +132,10 @@ const parsed = EmailSchema.parse(input); // Email
 **기본값**: unique-symbol brand + smart constructor — 매 boundary 의 cast, 매 internal 은 type-safe propagation.

 ## 🔗 Graph
- 부모: [[TypeScript-Type-System]] · [[Nominal-Typing]]
- 변형: [[Branded-Types]] · [[Phantom-Types]]
- 응용: [[Domain-Modeling]] · [[Parse-Dont-Validate]] · [[Zod-Schemas]]
- Adjacent: [[Discriminated-Unions]] · [[Type-Guards]]
+- 부모: [[TypeScript-Type-System]]
+- 변형: [[Branded-Types]]
+- 응용: [[Parse-Dont-Validate]]
+- Adjacent: [[API 응답 및 상태 모델링 (State Modeling and API Responses)|Discriminated-Unions]]

 ## 🤖 LLM 활용
 **언제**: ID 매 mix 위험 / unit 매 confusion / validated string 의 boundary protection.
@@ -162,9 +162,9 @@ const app = compose<{ req: Request; res?: Response }>([

 ## 🔗 Graph
 - 부모: [[SOLID-Principles]] · [[Design-Principles]]
- 변형: [[Strategy-Pattern]] · [[Visitor-Pattern]] · [[Plugin-Architecture]]
- 응용: [[Middleware]] · [[Discriminated-Unions]] · [[Dependency-Injection]]
- Adjacent: [[LSP]] · [[DIP]] · [[Composition-over-Inheritance]]
+- 변형: [[Visitor-Pattern]]
+- 응용: [[Middleware]] · [[API 응답 및 상태 모델링 (State Modeling and API Responses)|Discriminated-Unions]] · [[Dependency_Injection_(DI)|Dependency-Injection]]
+- Adjacent: [[DIP]] · [[Composition-over-Inheritance]]

 ## 🤖 LLM 활용
 **언제**: 매 add-only domain (payment processor, plugin, parser AST), variant 매 자주 추가.
@@ -179,10 +179,10 @@ glFramebufferRenderbuffer(GL_FRAMEBUFFER, GL_DEPTH_ATTACHMENT, GL_RENDERBUFFER,
 **기본값**: 매 new code 매 Vulkan, 매 legacy support 매 GLES 3.0.

 ## 🔗 Graph
- 부모: [[Graphics-API]] · [[GPU-Programming]]
+- 부모: [[GPU-Programming]]
 - 변형: [[Vulkan]] · [[Metal]] · [[WebGL]] · [[WebGPU]]
- 응용: [[Mobile-Game-Development]] · [[Mobile-Augmented-Reality]] · [[Map-Rendering]]
- Adjacent: [[GLSL]] · [[EGL]] · [[Shader-Programming]]
+- 응용: [[Mobile-Augmented-Reality]]
+- Adjacent: [[GLSL]]

 ## 🤖 LLM 활용
 **언제**: 매 cross-platform mobile graphics, 매 WebGL/embedded targeting, 매 legacy Android (API < 24) 매 support 필요.
@@ -113,9 +113,8 @@ await page.goto('https://example.com');

 ## 🔗 Graph
 - 부모: [[Browser]] · [[Chromium]]
- 변형: [[Opera_GX]] · [[Opera_Mini]] · [[Opera_Crypto_Browser]]
- 응용: [[Cross_Browser_Testing]] · [[Browserslist]]
- Adjacent: [[Chrome]] · [[Edge]] · [[Brave]] · [[Vivaldi]]
+- 변형: [[Opera_GX]]
+- Adjacent: [[Chrome]] · [[Vivaldi]]

 ## 🤖 LLM 활용
 **언제**: cross-browser bug investigation, mobile emerging market QA, Web3 dApp test matrix.
@@ -189,10 +189,10 @@ const inc = () => count.value++;
 **기본값**: 매 new code 매 Composition. Options 매 maintenance / specific reason 만.

 ## 🔗 Graph
- 부모: [[Vue]] · [[Vue-3]]
- 변형: [[Composition-API]] · [[Class-Component-API]]
- 응용: [[Vuex]] · [[Pinia]] · [[Vue-Router]]
- Adjacent: [[Mixins]] · [[Composables]] · [[defineComponent]]
+- 부모: [[Vue-3]]
+- 변형: [[Composition-API]]
+- 응용: [[Vuex]] · [[Pinia]]
+- Adjacent: [[Mixins]] · [[Composables]]

 ## 🤖 LLM 활용
 **언제**: Vue 2 maintenance, simple component, OOP-trained team onboarding.
@@ -142,10 +142,10 @@ export default {
 **기본값**: oxc 또는 SWC — 2026 매 Babel 의 production 사용 비추.

 ## 🔗 Graph
- 부모: [[Compiler]] · [[AST]]
- 변형: [[Babel]] · [[SWC]] · [[oxc]] · [[esbuild]]
- 응용: [[Vite]] · [[Webpack]] · [[Turbopack]] · [[ESLint]] · [[Biome]]
- Adjacent: [[TypeScript_Compiler]] · [[Source_Maps]]
+- 부모: [[AST]]
+- 변형: [[SWC]] · [[esbuild]]
+- 응용: [[Vite]] · [[Turbopack]] · [[ESLint]] · [[Biome]]
+- Adjacent: [[Source_Maps]]

 ## 🤖 LLM 활용
 **언제**: codemod 작성, 매 lint rule, custom transformer (CSS-in-JS extraction, dead code elimination).
--- a/Show More
+++ b/Show More