React 18 새로운 기능

에구마·2022년 10월 31일
0

FrontEnd

목록 보기
13/25

Transitions

https://reactjs.org/docs/react-api.html#transitions

성능저하 개선 효과

useTransition

let [isPending, startTransition] = useTransition()

startTransition으로 성능저하의 원인이 되는 state변경 감싼다! 콜백함수 형태로 감싸면됨!
isPending: startTransition이 처리중이면 True

return(
	<>
      <input onChange={(e)=> setName(e.target.value)} /> #<-- 구버전
      <input onChange={(e)=> {
        startTransition(() => {
          setName(e.target.value)
        })
      }}/>
    </>
)
profile
코딩하는 고구마 🍠 Life begins at the end of your comfort zone

0개의 댓글