docs: finalized wiki integrity maintenance (v3.0 standard) - pruned 1400+ stubs and fixed 11k+ ghost links

10_Wiki/Topics_Blog/React.lazy().md

@@ -1,4 +1,4 @@
-# [[React.lazy()]]
+# [[React.lazy()|React.lazy()]]
 
 ## 📌 Brief Summary
 `React.lazy()`는 리액트(React)에서 컴포넌트를 필요한 시점에 동적으로 불러올 수 있게 해주는 내장 함수입니다 [1]. 이 기능을 동적 임포트(Dynamic Imports)와 결합하면 거대한 자바스크립트 번들을 더 작은 청크(Chunk)로 나눌 수 있습니다 [2, 3]. 결과적으로 사용자가 앱에 처음 접근할 때 다운로드해야 하는 초기 자바스크립트 페이로드 크기를 대폭 줄여 앱의 초기 로드 속도와 전반적인 성능을 크게 향상시킵니다 [2-4].
@@ -24,23 +24,23 @@
 ### Related Concepts
 
 #### [아키텍처/기반 기술]
-- [[Code Splitting]]
+- [[Code Splitting|Code Splitting]]
   - 연결 이유: `React.lazy()`의 존재 목적이자 근본적인 성능 최적화 기법입니다 [6].
   - 이 개념을 통해 더 깊게 이해할 수 있는 부분: 초기 렌더링 시 불필요한 자바스크립트 번들 크기를 줄여 로딩 성능을 최적화하는 애플리케이션 구조 원리.
-- [[Dynamic Imports]]
+- Dynamic Imports
   - 연결 이유: `React.lazy()` 함수 내부에서 비동기적으로 모듈을 로드하기 위해 사용하는 표준 자바스크립트 문법(`import()`)입니다 [2, 3, 8].
   - 이 개념을 통해 더 깊게 이해할 수 있는 부분: 브라우저가 특정 코드가 실행되어야 할 시점에 네트워크 요청을 생성하여 모듈을 가져오는 메커니즘.
 
 #### [구현/활용 도구]
-- [[Suspense]]
+- Suspense
   - 연결 이유: `React.lazy()`로 분리된 코드가 백그라운드에서 다운로드되는 동안 앱이 멈추지 않도록 로딩 UI를 처리하기 위해 필수적으로 결합되는 리액트 기능입니다 [1, 3].
   - 이 개념을 통해 더 깊게 이해할 수 있는 부분: 비동기 렌더링 흐름에서 로딩 상태(Loading State)를 컴포넌트 트리 상단에서 선언적으로 처리하는 방법.
-- [[Vite/Rollup]]
+- Vite/Rollup
   - 연결 이유: 소스 코드에 작성된 `React.lazy()` 구문을 분석하여 빌드 타임에 물리적으로 개별 자바스크립트 파일(청크)로 분할해 내는 도구들입니다 [2, 8].
   - 이 개념을 통해 더 깊게 이해할 수 있는 부분: 모듈 번들러가 코드 스플리팅을 인식하고 프로덕션 환경의 정적 에셋으로 변환하여 캐싱 효율을 높이는 과정.
 
 ### Deeper Research Questions
-- `React.lazy()`를 활용한 클라이언트 사이드 코드 스플리팅과 서버 사이드에서 이루어지는 [[React Server Components]]의 성능 최적화 방식은 어떻게 다르며 서로 어떻게 보완될 수 있는가?
+- `React.lazy()`를 활용한 클라이언트 사이드 코드 스플리팅과 서버 사이드에서 이루어지는 [[React Server Components|React Server Components]]의 성능 최적화 방식은 어떻게 다르며 서로 어떻게 보완될 수 있는가?
 - `<Suspense>`로 감싸진 지연 로딩 컴포넌트가 로드될 때 발생하는 Cumulative Layout Shift (CLS)를 최소화하기 위한 구체적인 UI 패턴과 전략은 무엇인가?
 - 모바일 환경 등 네트워크 속도가 느린 곳에서 `React.lazy()`로 분리된 청크를 불러올 때, 에러가 발생한 경우(예: 배포 후 이전 해시 청크 삭제됨) 이를 Error Boundary로 어떻게 우아하게 복구할 수 있는가?
 - 사용자가 컴포넌트를 요청하기 전(예: 링크에 마우스를 올리는 시점)에 `React.lazy()`로 분리된 청크를 미리 가져오는 프리패치(Prefetching/Preloading) 전략은 어떻게 구현하는가?
@@ -54,11 +54,11 @@
 - **My Project Relevance:** 현재 유지보수 중인 프로젝트에 모달, 어드민 설정 패널 등 즉시 보이지 않는 컴포넌트들이 메인 번들에 포함되어 있다면, 이를 `React.lazy()`로 리팩토링하여 Time To Interactive (TTI) 지표를 당장 개선하는 데 적용할 수 있습니다.
 
 ### Adjacent Topics
-- [[Core Web Vitals]]
+- [[Core Web Vitals|Core Web Vitals]]
   - 확장 방향: `React.lazy()`를 적용했을 때 First Contentful Paint (FCP)와 Interaction to Next Paint (INP) 같은 구글의 웹 성능 지표가 어떻게 개선되는지 확인하는 방향으로 연구 확장 [1, 5].
-- [[manualChunks]]
+- manualChunks
   - 확장 방향: `React.lazy()`에 의한 스플리팅 외에, React 코어나 서드파티 라이브러리들(vendor)을 별도 분리해 브라우저 캐싱을 고도화하는 빌드 도구 수준의 수동 제어 기법 파악 [8, 14].
-- [[React Server Components (RSC)]]
+- [[React Server Components (RSC)|React Server Components (RSC)]]
   - 확장 방향: 자바스크립트를 클라이언트로 아예 보내지 않고 서버에서 렌더링하여 성능을 극대화하는 최신 Next.js 패러다임과 클라이언트 단의 `React.lazy`를 비교 [9, 15].
 
 ---