terapkan pada menu "transaksi", spy tampilan tabelnya tidak lemot, saat datanya ratusan ribu : dengan fitur berikut ini 
# Optimasi Menu Transaksi agar Tetap Cepat Saat Data Banyak

Agar tampilan menu **Transaksi** tetap ringan meskipun jumlah datanya sangat besar, gunakan beberapa teknik berikut:

---

#### 1. **Pagination (Wajib)**

Gunakan **pagination** untuk membatasi jumlah data yang diambil tiap kali query.

**a. Offset–Limit Pagination (klasik):**
Menggunakan `LIMIT` dan `OFFSET`.

```sql
SELECT * FROM vw_transactions_report
ORDER BY created_at DESC
LIMIT 50 OFFSET 100;

b. Keyset Pagination (Cursor): Lebih cepat untuk dataset besar karena menghindari OFFSET besar.

SELECT * FROM vw_transactions_report
WHERE created_at < '2025-10-31T10:00:00'
ORDER BY created_at DESC
LIMIT 50;

Catatan: Supabase menyediakan range() untuk pagination, namun cursor pagination lebih disarankan untuk performa tinggi.

2. Lazy Load / Infinite Scroll

Ambil data secara bertahap ketika user melakukan scroll ke bawah. Contohnya:

• Ambil 50 baris pertama.
• Saat user hampir sampai di bawah, ambil 50 baris berikutnya.

Gunakan kolom created_at atau id sebagai cursor untuk menentukan titik lanjutan data.

Keuntungan: Mengurangi beban query besar sekaligus dan membuat tampilan lebih halus.

3. Virtual Scrolling (Super Cepat)

Render hanya elemen yang terlihat di layar (visible area). Teknik ini cocok bila jumlah data mencapai ratusan ribu baris.

4. Caching & Local State

Simpan hasil query terakhir di state management seperti:

• React Query
• SWR
• Pinia (Vue)

Saat user membuka halaman kembali:

• Tampilkan data dari cache terlebih dahulu.
• Lalu lakukan refresh di background untuk update terbaru.

Dengan kombinasi pagination, lazy load, virtual scrolling, dan caching, performa menu transaksi akan tetap cepat meskipun jumlah datanya sangat besar.