Optimasi Data Table dengan Laravel: Dari Client-Side ke Server-Side Rendering

Halo sobat developer! Apa kabar? Qisthi di sini, dan kali ini saya punya cerita seru sekaligus kabar gembira buat kalian semua. Yuk, simak bareng-bareng pengalaman menarik saya dalam mengoptimalkan data table dengan Laravel!

Optimasi Data Table: Perjalanan dari Client-Side ke Server-Side Rendering

Jadi begini, dalam buku saya yang berjudul "Modern Monolith", awalnya saya menggunakan pendekatan client-side rendering untuk halaman data table. Simpel banget, backend cuma ngelempar hasil Author::query()->get() langsung ke frontend. Keren kan? Awalnya sih iya, tapi ternyata ada cerita di balik layar yang bikin kita harus mikir ulang nih.

Ketika Data Mulai Membengkak

Bayangkan nih, ketika data masih di bawah 1.000 entries, semuanya berjalan mulus. Response time masih oke, sekitar 100-200 ms. Tapi namanya juga aplikasi, pasti berkembang dong ya. Eh tau-tau data udah nambah jadi 5.000 sampai 50.000 entries! Waduh, response backend jadi lambat, bisa sampai 5-10 detik. Gak enak banget kan ya?

Ini jadi masalah serius nih. Bayangkan pengguna kita harus nunggu 5-10 detik setiap kali mereka mau lihat atau cari data. Bisa-bisa mereka kabur ke kompetitor kita! Nah, di sinilah kita mulai petualangan optimasi.

Langkah Pertama: Refactoring ke Server-Side Rendering

Setelah mikir-mikir dan riset, akhirnya saya memutuskan untuk refactor kode yang ada menjadi server-side rendering. Keren kan? Sekarang, logic di backend jadi begini:

Author::query()->where('name', 'LIKE', '%Andrea%')->paginate(15)

Dengan pendekatan ini, kita bisa mengontrol jumlah data yang dikirim ke frontend. Alih-alih mengirim semua data sekaligus, kita hanya mengirim 15 data per request. Hasilnya? Berapa pun jumlah datanya, response aplikasi jadi lebih konsisten. Mantap!

Optimasi Lanjutan: Laravel Query Builder by Spatie

Tapi tunggu dulu, masih ada lagi nih! Untuk optimasi lebih lanjut, saya pakai package Laravel Query Builder buatan Spatie. Package ini keren banget lho! Bisa dengan mudah bikin Eloquent queries dari API requests. Jadi, kita bisa filter, sort, dan include eloquent relations berdasarkan request.

Dengan package ini, kode kita jadi lebih ringkas. Coba lihat nih:

QueryBuilder::for(Author::class)
    ->allowedFilters('name')
    ->allowedSorts('name')
    ->paginate(request()->get('limit', 15));

Nah, package ini bakal otomatis query berdasarkan query param yang kita lempar ke server. Misalnya, kita bisa akses /authors?page=1&limit=30&filter[name]=Andrea. Gampang banget kan?

Keuntungan Menggunakan Laravel Query Builder

Fleksibilitas: Kita bisa dengan mudah menambah atau mengurangi filtering dan sorting tanpa harus mengubah banyak kode.
Keamanan: Package ini otomatis melakukan sanitasi input, jadi kita gak perlu khawatir soal SQL injection.
Performa: Query yang dihasilkan sudah dioptimasi, jadi performa database tetap terjaga.
Standarisasi: Mengikuti spesifikasi JSON API, jadi lebih mudah diintegrasikan dengan berbagai frontend framework.

Implementasi Lebih Lanjut

Selain filtering dan sorting, kita juga bisa menambahkan fitur include relations. Misalnya, kita punya relasi books di model Author, kita bisa tambahkan:

QueryBuilder::for(Author::class)
    ->allowedFilters('name')
    ->allowedSorts('name')
    ->allowedIncludes('books')
    ->paginate(request()->get('limit', 15));

Dengan ini, client bisa request /authors?include=books untuk mendapatkan data author beserta buku-bukunya.

Hasil Akhir: Performa yang Drastis Meningkat

Setelah semua optimasi ini, coba tebak apa yang terjadi? Yap, performa aplikasi kita meningkat drastis! Response time yang tadinya bisa sampai 5-10 detik, sekarang jadi konsisten di bawah 500ms, bahkan untuk data yang jumlahnya puluhan ribu. Keren kan?

Kabar Gembira: Buku "Modern Monolith" Gratis!

Nah, sekarang kabar gembiranya nih! Kalian bisa dapetin buku "Modern Monolith" ini GRATIS lho di platform NihBuatJajan! Iya, bener, GRATIS! Di buku ini, kalian bakal belajar lebih detail tentang teknik-teknik yang saya ceritain di atas, plus banyak lagi tips dan trik untuk membangun aplikasi Laravel modern yang cepat.

Tapi, buat kalian yang pengen dapetin akses eksklusif, ada bonus spesial nih. Kalau kalian berdonasi minimal 100.000 IDR, kalian bakal dapet invitation ke private repository yang isinya detail kode yang ada di buku. Di sini kalian bisa lihat langsung implementasi kode, eksplorasi lebih dalam, bahkan bisa tanya-tanya langsung ke saya lho (melalui GitHub)!

Kesimpulan dan Langkah Selanjutnya

Optimasi data table dari client-side ke server-side rendering ini cuma salah satu contoh kecil dari banyak optimasi yang bisa kita lakukan untuk meningkatkan performa aplikasi Laravel kita. Ingat, dalam dunia development, selalu ada ruang untuk improvement.

Jadi, tunggu apa lagi? Yuk, langsung aja kunjungi NihBuatJajan - The Modern Monolith: Membangun Aplikasi Web Cepat dengan Laravel, Inertia.js, Bun, dan TypeScript dan dapatkan bukunya! Jangan lupa, donasi 100.000 IDR buat dapetin akses ke private repo ya!

Oh iya, buat kalian yang udah baca atau nanti bakal baca bukunya, jangan lupa share pengalaman kalian ya. Kira-kira ada teknik optimasi lain yang kalian punya? Atau mungkin ada pertanyaan seputar materi di buku? Yuk, langsung aja tulis di kolom komentar!

Sampai jumpa di artikel berikutnya, developers! Keep coding, keep learning, and keep optimizing!