Request Deduplication dengan React cache()

Next.js otomatis melakukan deduplikasi pada panggilan fetch() yang identik di dalam 1 pohon render. Untuk fungsi non-fetch, gunakan cache() dari React.

👀 Contoh dulu

import { cache } from "react";
const getUser = cache(async (id) => db.user.findUnique({ id }));

Hasilnya: Panggilan getUser(id) berulang hanya dieksekusi 1x per render.

💡 Mencegah query database ganda dalam satu request halaman.

📝 Sekarang giliranmu

Kamu memiliki fungsi pembacaan database getUser. Bungkus fungsi async tersebut dengan fungsi cache dari React yang sudah diimpor, sehingga panggilannya di-deduplikasi dalam satu request.

Preview