[G1-Sync] Manual knowledge update

10_Wiki/Topics/Frontend_Mastery/리페인트(Repaint).md

@@ -1,6 +1,6 @@
 # [[리페인트(Repaint)]]
 
-## 📌 Brief Summary
+## 📌[[ brief]] Summary
 리페인트(Repaint)는 웹 페이지 요소의 레이아웃(크기나 위치)에는 영향을 주지 않지만 색상, 배경, 윤곽선, 가시성 등 시각적인 스타일(Skin)이 변경될 때 발생하는 렌더링 과정을 의미한다 [1, 2]. 요소의 시각적 변경이 일어날 때 브라우저는 DOM 트리 내 다른 노드들의 가시성까지 검증해야 하므로 상당한 성능 비용을 유발한다 [2]. 특히 CSS 애니메이션 실행 시 과도한 리페인트가 반복되면 프론트엔드 환경에서 렌더링 성능 저하를 일으키고 스크립트 실행을 느리게 할 수 있어 적절한 최적화가 필수적이다 [1, 3].
 
 ## 📖 Core Content
@@ -14,7 +14,7 @@
   - 자주 변경될 것으로 예상되는 요소에는 `will-change` 속성을 부여하여 브라우저가 미리 최적화 힌트를 얻고 렌더링을 준비할 수 있도록 돕는 것이 좋다 [11, 12].
 
 ## 🔗 Knowledge Connections
-- **Related Topics:** [[리플로우(Reflow)]], [[CSS 성능 최적화(CSS Performance Optimization)]], CSS 애니메이션(CSS Animations)
+- **Related Topics:** [[리플로우(Reflow)]], [[CSS 성능 최적화(CSS Performance [[Optimization]])]], CSS 애니메이션([[CSS Animations]])
 - **Projects/Contexts:** 대규모 프론트엔드 성능 최적화 파이프라인(Rendering Pipeline Optimization), 실무 CSS 관리 및 아키텍처
 - **Contradictions/Notes:** 소스 상에서 상충되는 주장은 발견되지 않는다. 다만 리페인트는 전체 레이아웃을 다시 계산하는 작업인 리플로우(Reflow)에 비해서는 상대적으로 적은 비용이 소모된다는 특징이 있다 [8]. 그럼에도 불구하고 불필요한 시각적 속성 변경 애니메이션이 많을 경우 결국 심각한 성능 저하의 원인이 되므로 두 과정 모두 최소화하는 방향으로 설계해야 한다 [1, 13].