Skip to content

Commit a717a9e

Browse files
committed
fix: 문서 제목 및 섹션 제목 형식 수정
1 parent 0a8403c commit a717a9e

1 file changed

Lines changed: 13 additions & 9 deletions

File tree

src/features/post/contents/react-compiler.mdx

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -40,39 +40,43 @@ React Compiler의 가장 핵심적인 기능은 **'자동 메모이제이션(Aut
4040

4141
이로 인해 개발자는 더 이상 성능 최적화를 위해 `useMemo`, `useCallback`, `React.memo` 등을 수동으로 작성할 필요가 없어진다. 컴파일러가 코드의 의미를 분석하여 어떤 부분을 메모이제이션해야 할지 스스로 판단하고 적용한다.
4242

43-
# 주요 장점 및 특징
43+
## 주요 장점 및 특징
4444

45-
## 개발자 경험 (DX) 향상
45+
### 개발자 경험 (DX) 향상
4646

4747
성능 최적화에 대한 고민과 수동 작업(의존성 배열 관리 등) 에서 해방되어, 개발자가 비즈니스 로직에 더 집중할 수 있게 해준다.
4848

49-
## 광범위한 호환성
49+
### 광범위한 호환성
5050

5151
React 19뿐만 아니라 17, 18 버전과도 호환되며, Vite, Next.js, Expo 등 대부분의 개발 환경을 지원한다.
5252

5353
### 시각적 확인
5454

5555
최신 React 개발자 도구(DevTools)에서는 컴파일러에 의해 자동으로 최적화된 컴포넌트에 "Memo" 라벨이 붙어, 최적화 여부를 시각적으로 확인할 수 있습니다.
5656

57-
# 적용 방법 (점진적 도입)
57+
## 적용 방법 (점진적 도입)
5858

5959
Vite, Next.js 등을 사용한 신규 프로젝트에서는 컴파일러가 기본 활성화되도록 옵션이 제공된다.
6060

6161
하지만 기존에 운영중인 프로젝트에 적용할 때는 안정성을 위해 **'점진적 채택(Incremental Adoption)'** 방식이 강력하게 권장된다.
6262

63-
1. 설정 파일 수정: 컴파일러 설정에서 compilationMode: `annotation` 옵션을 추가한다.
63+
### 1. 설정 파일 수정
6464

65-
2. 컴포넌트 파일 수정: 컴파일러를 적용하고 싶은 파일 최상단에 `"use memo"` 라는 지시어를 추가한다.
65+
컴파일러 설정에서 compilationMode: `annotation` 옵션을 추가한다.
66+
67+
### 2. 컴포넌트 파일 수정
68+
69+
컴파일러를 적용하고 싶은 파일 최상단에 `"use memo"` 라는 지시어를 추가한다.
6670

6771
이렇게 하면 `"use memo"` 지시어가 있는 파일에만 컴파일러가 작동하므로, 컴포넌트 단위로 안정성을 테스트하며 점진적으로 도입할 수 있다.
6872

69-
# 주의사항 및 권장 사항
73+
## 주의사항 및 권장 사항
7074

71-
## '리액트의 규칙(Rules of React)' 준수
75+
### '리액트의 규칙(Rules of React)' 준수
7276

7377
리액트 컴파일러는 리액트의 규칙을 철저히 지킨 코드를 기반으로 작동한다. 따라서, ESLint 규칙을 잘 지키는 것이 그 어느 때보다 중요해졌다.
7478

75-
## 기존 useMemo의 활용
79+
### 기존 useMemo의 활용
7680

7781
컴파일러의 자동 최적화를 기본으로 사용하되, 개발자가 특별히 '정밀한 제어'를 원하는 경우에만 useMemo나 useCallback을 보조적으로 사용할 수 있다.
7882

0 commit comments

Comments
 (0)