천쓰의 개발동산

상반기 REACT 패치노트 - 2024 본문

프론트엔드/REACT

상반기 REACT 패치노트 - 2024

인천쓰 2024. 6. 7. 00:00
반응형

React 18.3.1 (2024년 4월 26일)

  • react act를 내보내는 기능 추가

React 18.3.0 (2024년 4월 25일)

  • React 18.2와 동일하나, React 19를 위한 API 사용 중단 경고 및 기타 변경 사항 추가

주요 변경 사항

React

  • this.refs에 쓰기 허용
  • StrictMode 외부에서 findDOMNode 사용 시 경고
  • 테스트 유틸리티 메서드 사용 중단 경고
  • StrictMode 외부에서 레거시 컨텍스트 사용 시 경고
  • StrictMode 외부에서 문자열 참조 사용 시 경고
  • 함수형 컴포넌트의 defaultProps 사용 중단 경고
  • 키를 스프레딩할 때 경고
  • 테스트 유틸리티의 act 사용 시 경고

React DOM

  • unmountComponentAtNode 사용 중단 경고
  • renderToStaticNodeStream 사용 중단 경고

React 18.2.0 (2022년 6월 14일)

React DOM

  • onRecoverableError에 컴포넌트 스택을 두 번째 인자로 제공
  • 불일치 시 빈 페이지를 유발하는 하이드레이션 수정
  • Suspense와 관련된 하이드레이션 오류 수정
  • Safari에서 iframe 추가 시 setState 무시 오류 수정

React DOM Server

  • 서버 오류에 대한 정보 클라이언트에 전달
  • HTML 스트림 중단 시 이유 제공 가능
  • HTML에서 불필요한 텍스트 구분자 제거
  • <title> 요소 내 복잡한 자식 허용하지 않음
  • 일부 워커 환경에서 버퍼링 문제 해결

Server Components (실험적 기능)

  • Server Components 내 useId() 지원 추가

React 18.1.0 (2022년 4월 26일)

React DOM

  • UMD 번들 사용 시 react-dom/client에 대한 경고 수정
  • suppressHydrationWarning이 프로덕션에서도 작동하도록 수정
  • Suspense 내에서 componentWillUnmount가 두 번 실행되는 문제 수정
  • 전환 업데이트가 무시되는 문제 수정
  • useDeferredValue가 무한 루프를 유발하는 문제 수정
  • Suspense 폴백 표시 조절 문제 수정
  • 렌더 간 props 객체의 일관성 문제 수정
  • useEffect에서 setState 루프에 대한 경고 추가
  • 하이드레이션 오류 이유가 항상 표시되도록 수정

React DOM Server

  • bootstrapScriptContent 내용에 대한 이스케이프 문제 수정
  • renderToPipeableStream 성능 크게 개선

ESLint Plugin: React Hooks

  • 많은 브랜치가 있을 때 발생하는 오류 수정
  • 변수 재할당 시 알려진 종속성을 안정적이라고 간주하지 않음

Use Subscription

  • use-sync-external-store shim으로 구현 변경

React 18.0.0 (2022년 3월 29일)

새로운 기능

  • useId: 고유 ID 생성용 새 훅
  • startTransition 및 useTransition: 긴급하지 않은 상태 업데이트를 표시하는 훅
  • useDeferredValue: 긴급하지 않은 트리 렌더링을 지연하는 훅
  • useSyncExternalStore: 외부 스토어와 동기 읽기를 지원하는 새 훅
  • useInsertionEffect: CSS-in-JS 라이브러리 성능 문제 해결용 새 훅

React DOM Client

  • createRoot 및 hydrateRoot 새 메서드 추가

React DOM Server

  • renderToPipeableStream 및 renderToReadableStream 새 API 추가

사용 중단

  • ReactDOM.render, ReactDOM.hydrate, ReactDOM.unmountComponentAtNode, ReactDOM.renderSubtreeIntoContainer 사용 중단
  • ReactDOMServer.renderToNodeStream 사용 중단

주요 변경 사항

  • 자동 배칭
  • 더 엄격해진 Strict Mode
  • 일관된 useEffect 타이밍
  • 더 엄격해진 하이드레이션 오류 처리
  • 일관된 Suspense 트리
  • Suspense 사용 시 레이아웃 효과 처리 방식 변경
  • 새로운 JavaScript 환경 요구 사항

Scheduler (실험적 기능)

  • 불안정한 scheduler/tracing API 제거

기타 변경 사항

  • undefined를 반환하는 컴포넌트 허용
  • 테스트에서 act 경고를 선택적 기능으로 변경
  • 언마운트된 컴포넌트에서 setState 사용 경고 제거
  • 콘솔 로그 억제 제거
  • 메모리 사용 개선
  • renderToString 및 renderToStaticMarkup의 Suspense 처리 방식 변경



    출처 : https://github.com/facebook/react/blob/main/CHANGELOG.md#1820-june-14-2022
반응형