feat: complete wikification of War Commander batch 1&2 and final grey dot cleanup

10_Wiki/Topics/Frontend_Mastery/웹 성능 최적화(Web Performance Optimization).md

@@ -15,8 +15,8 @@
 * **React Server Components (RSC)의 도입과 자동화 도구:** 기존 렌더링 방식의 번들 크기 및 하이드레이션 문제를 근본적으로 해결하기 위해 컴포넌트를 서버에서만 실행하고 클라이언트에는 자바스크립트를 전송하지 않는 RSC 모델이 도입되었다 [48-51]. 이를 통해 클라이언트로 전송되는 JS 페이로드 크기를 대폭 줄이고 서버의 리소스를 직접 활용할 수 있다 [52-54]. 더 나아가 최신 React Compiler는 빌드 타임에 코드의 추상 구문 트리(AST)를 분석해 자동으로 세분화된 메모이제이션을 삽입해주어, 개발자가 수동으로 성능을 최적화해야 하는 부담을 대폭 감소시킨다 [55-58].
 
 ## 🔗 Knowledge Connections
-- **Related Topics:** `[[Critical Rendering Path]]`, `[[Reflow and Repaint]]`, `[[React Server Components]]`, `[[하이드레이션(Hydration)]]`, `[[동시성 렌더링(Concurrent Rendering)]]`, `[[React Compiler]]`
-- **Projects/Contexts:** `[[콘텐츠 기반의 SEO 최적화 웹사이트 및 이커머스(E-commerce) 플랫폼]]` (초기 화면의 빠른 렌더링과 검색엔진 최적화를 위해 SSR, SSG, ISR이 필수적으로 요구되는 맥락) [43, 59-62], `[[고도의 상호작용이 필요한 관리자 대시보드 및 SaaS]]` (초기 렌더링보다 실시간 상태 업데이트와 인터랙션 속도가 중시되어 CSR 또는 선택적 클라이언트 컴포넌트가 적합한 맥락) [63-67].
+- **Related Topics:** `[[Critical Rendering Path]]`, `[[Reflow and Repaint]]`, `[[React Server Components]]`, `하이드레이션(Hydration)`, `동시성 렌더링(Concurrent Rendering)`, `[[React Compiler]]`
+- **Projects/Contexts:** `콘텐츠 기반의 SEO 최적화 웹사이트 및 이커머스(E-commerce) 플랫폼` (초기 화면의 빠른 렌더링과 검색엔진 최적화를 위해 SSR, SSG, ISR이 필수적으로 요구되는 맥락) [43, 59-62], `고도의 상호작용이 필요한 관리자 대시보드 및 SaaS` (초기 렌더링보다 실시간 상태 업데이트와 인터랙션 속도가 중시되어 CSR 또는 선택적 클라이언트 컴포넌트가 적합한 맥락) [63-67].
 - **Contradictions/Notes:** 
   - **수동 메모이제이션의 유용성에 대한 관점 변화:** 기존 React 생태계에서는 불필요한 리렌더링을 막기 위해 `useMemo`나 `useCallback`과 같은 수동 메모이제이션이 권장되었으나, 얕은 비교 검사 자체의 오버헤드가 발생하거나 종속성 관리가 복잡해져 과도한 사용이 안티 패턴으로 지적되기도 했다 [68, 69]. 그러나 React 19의 React Compiler 등장 이후, 컴파일러가 정적 분석을 통해 최적의 위치에 자동으로 메모이제이션을 적용하게 되면서 개발자의 수동 개입 필요성이 크게 사라지는 패러다임 전환이 이루어지고 있다 [55, 58, 70-72].
   - **SSR의 성능 지표 딜레마:** 서버 사이드 렌더링(SSR)은 클라이언트에게 완성된 HTML을 즉시 제공하여 초기 콘텐츠 표시(FCP)와 SEO를 개선하지만, 자바스크립트를 다운로드하여 정적 요소에 상호작용을 활성화하는 하이드레이션 과정이 완료될 때까지 상호작용 시작 시간(TTI)이 크게 지연되거나 메인 스레드 차단 시간(TBT)이 증가하는 역설적인 한계가 존재한다 [43, 45, 73-75].