CodeShot
Midسختی 3 از ۵· در 30٪ مصاحبه‌های این حوزه پرسیده شده

تفاوت useMemo و useCallback چیست؟

نشان کردن

پاسخ کوتاه

useMemo نتیجهٔ محاسبه‌شدهٔ یک مقدار را بین رندرها Cache می‌کند؛ useCallback خودِ یک تابع را Cache می‌کند تا Reference آن بین رندرها ثابت بماند.

پاسخ کامل

هر دو برای جلوگیری از محاسبات یا Render های غیرضروری استفاده می‌شوند؛ useCallback در واقع معادل useMemo است که مقدار Cache‌شده‌اش خودِ تابع است، نه نتیجهٔ اجرای آن.

مثال کد

jsx\nconst memoizedValue = useMemo(() => computeExpensive(a, b), [a, b]);\nconst memoizedFn = useCallback(() => doSomething(a), [a]);\n

اشتباه رایج

استفادهٔ بیش‌ازحد از این دو Hook برای محاسبات ساده و ارزان، که خودش سربار اضافه ایجاد می‌کند بدون فایدهٔ واقعی.