useMemo

useMemo 1. useMemo - React의 훅 중 하나로, 성능 최적화를 위해 사용 - 계산 비용이 높은 함수 결과를 이전 계산 결과와 비교해, 이전 결과와 동일하다면 이를 재사용하여, 렌더링 성능 향상 2. useMemo 구문 - dependency 들은 이 함수가 의존하는 값들을 나타냄. → 의존성 값들이 변경되었을 때만 다시 실행되고, 그렇지 않으면 계산한 결과를 재사용 const memoizedValue = useMemo(() => { // 계산 비용이 높은 작업 수행 return result; }, [dependency1, dependency2, ...]); 3, 예시 - App.js import React, { useState, useMemo } from "react"; import "..

• format_list_bulleted Front-End Study/React
• · 2023. 8. 11.
• textsms

useMemo

useMemo 1. useMemo - 복잡한 연산 or 계산이 필요한 값을 Memoization하여, 성능을 최적화하는 데 사용 ※ Memoization : 이전에 계산한 값을 저장하여, 동일한 입력이 주어질 때, 다시 계산하는 대신, 저장된 값을 반환 - 특정 값이변경될 때만, 해당 값을 다시 계산하고, 그렇지 않은 경우, 이전에 계산된 값을 재사용할 수 있음 2. 사용방법 const a = useMemo(() => { // 계산하고자 하는 값 or 연산 }, [b]); - [b] : 의존성 목록으로, 이 목록에 포함된 값들이 변경될 때에만 useMemo의 콜백 함수를 실행 ※ 의존성 목록이 변경되지 않으면, 이전에 계산된 값을 재사용함 ※ 의존성 목록 생략 시, useMemo의 콜백 함수는 한 번만 ..

• format_list_bulleted Front-End Study/React
• · 2023. 7. 10.
• textsms