useMemo & useCallback

useMemo meng-cache hasil perhitungan mahal, sedangkan useCallback meng-cache referensi fungsi antar render.

👀 Contoh dulu

const total = useMemo(() => hitungMahal(items), [items]);

Hasilnya: hitungMahal hanya dijalankan ulang saat data items berubah.

💡 Jangan gunakan ini secara berlebihan (optimasi prematur) sebelum ada masalah performa nyata.

📝 Sekarang giliranmu

Gunakan useMemo untuk memanggil fungsi hitung(data) dan me-return hasilnya. Jadikan array berisi data sebagai dependensinya.

Preview