𝗪𝗮𝘀𝗽𝗮𝗱𝗮𝗶 𝗹𝗼𝗱𝗮𝘀𝗵.𝗺𝗲𝗺𝗼𝗶𝘇𝗲

Lodash memoize tampak seperti peningkatan performa gratis. Anda membungkus sebuah fungsi dan mendapatkan cache.

Namun, perilaku default-nya memiliki jebakan. Ia membangun kunci cache hanya dari argumen pertama. Ia mengabaikan argumen lainnya.

Jika Anda menggunakan satu argumen, Anda aman. Jika Anda menggunakan dua atau lebih, Anda menciptakan bug.

Lihat contoh ini:

const add = memoize((a, b) => a + b);

add(1, 2); // Mengembalikan 3. Ia menyimpan hasil di bawah kunci 1. add(1, 9); // Mengembalikan 3. Ini salah. Seharusnya 10.

Lodash melihat 1 lagi. Ia menemukan 1 di dalam cache. Ia mengembalikan hasil lama. Ia tidak pernah melihat angka 9 tersebut.

Format mata uang adalah jebakan yang umum terjadi.

const formatPrice = memoize((amount, currency) => new Intl.NumberFormat('en', { style: 'currency', currency }).format(amount) );

formatPrice(100, 'USD'); // Mengembalikan "$100.00". Kuncinya adalah 100. formatPrice(100, 'EUR'); // Mengembalikan "$100.00". Ini salah.

Pemanggilan kedua mengabaikan 'EUR'. Ia melihat 100 di dalam cache dan mengembalikan dolar alih-alih euro. Tidak ada error. Tidak ada peringatan. Anda hanya menampilkan uang yang salah kepada pengguna Anda.

Anda harus menyediakan argumen kedua untuk menentukan kunci cache. Kunci ini harus mencakup setiap input.

const formatPrice = memoize( (amount, currency) => new Intl.NumberFormat('en', { style: 'currency', currency }).format(amount), (amount, currency) => ${amount}|${currency} );

formatPrice(100, 'USD'); // "$100.00" formatPrice(100, 'EUR'); // "€100.00"

Kunci tersebut harus menangkap segala sesuatu yang mengubah output.

Pemikiran terakhir: memoization menambah risiko. Gunakan hanya ketika sebuah fungsi bersifat berat dan sering dijalankan dengan input yang sama. Untuk fungsi sederhana, panggil saja secara langsung. Risiko bug sering kali lebih tinggi daripada kecepatan yang Anda dapatkan.

Poin-poin penting:

Sumber: https://dev.to/figsify/beware-of-lodashmemoize-it-only-remembers-the-first-argument-4cjl