useCallback

박광민·2023년 3월 2일
0

useCallback

  • useMemo 기반으로 만들어졌기 때문에 비슷하지만
    useMemo -> 특정 결과값을 재사용 할 때 씀
    useCallback -> 특정 함수를 재사용 할 때 씀

  • useCallback 사용할 때 함수 안에서 사용하는 state, props가 있다면 반드시 []안에 포함시켜야함

  • 함수를 자식 컴포넌트로 넘겨 줄 때 반드시 useCallback을 써야함
    if) 그렇게 하지않는다면 -> 자식컴포넌트가 계속 새로운 함수를 생성한다고 받아들이기 때문에 렌더링이 계속됨

  • useCallback을 사용하지 않은 함수들은 컴포넌트가 리랜더링 될 때마다 새로 만들어짐
    -> 함수가 새로 만들어지는 것 때문애 성능이 떨어지진 않지만, 최적화를 위해 함수 재사용이 필요함

  • useCallback을 사용하면 해당 컴포넌트가 랜더링 되더라도 그 함수가 의존하는 값이 바뀌지 않는 이상 기존 함수를 계속해서 반환함
profile
developer(Frontend)

0개의 댓글