React 19 주요 변경사항

1. React 컴파일러 도입

• React 팀이 개발한 새로운 실험적 컴파일러 도입
• 자동 최적화를 통해 useCallback, useMemo 등의 수동 메모이제이션 코드 감소
• 코드 단순화 및 유지보수성 향상

2. Ref 처리 방식 개선

• forwardRef 없이도 함수형 컴포넌트에서 ref prop 직접 사용 가능
• 기존 코드의 하위 호환성 유지

// 이전 방식const MyComponent = forwardRef((props, ref) => {
  return <div ref={ref}>Hello</div>;
});

// React 19 방식const MyComponent = (props) => {
  return <div ref={props.ref}>Hello</div>;
};

3. use Hook 도입

• Promise나 Context를 직접 처리할 수 있는 새로운 Hook
• useEffect와 useContext를 대체할 수 있는 더 간단한 방식 제공

// 이전 방식
const user = useContext(UserContext);

// React 19 방식
const user = use(UserContext);

4. 하이드레이션 에러 개선

• 에러 메시지가 더 명확하고 자세해짐
• 문제 해결을 위한 구체적인 제안 포함

Next.js 15 주요 변경사항

1. React 19 지원

• App Router와 Pages Router 모두에서 React 19 완벽 지원
• Pages Router는 React 18 하위 호환성 유지