Edge Functions untuk Personalisasi Website Bisnis: Cara Memilih Konten Berbeda Tanpa Mengorbankan Kecepatan

TL;DR: Edge Functions adalah kode yang dijalankan di node CDN dekat pengguna, bukan di server pusat. Untuk personalisasi website bisnis (region, bahasa, segmen pelanggan), Edge Functions memungkinkan halaman tetap di-cache statis tapi varian dipilih dalam puluhan milidetik. Hasilnya personalisasi tanpa mengorbankan LCP.

Dalam dua tahun terakhir, makin banyak brand Indonesia minta personalisasi: konten berbeda untuk pengunjung Jakarta vs Surabaya, harga berbeda untuk member vs non-member, atau halaman edukasi berbeda untuk pemula vs lanjutan. Pendekatan klasik dengan SSR sering bikin halaman lambat karena setiap request harus dirender ulang. Edge Functions adalah jalan tengah yang sudah dipakai di proyek Atmo dan Vetmo untuk personalisasi tanpa kompromi performa.

Artikel ini menjelaskan kapan Edge Functions tepat dipakai, kapan justru lebih baik tetap pakai static rendering, dan pola implementasi sederhana di Next.js.

Apa yang Bisa Dilakukan di Edge

Edge Functions berjalan di node terdekat dari pengguna, biasanya di bawah 50 ms latensi. Untuk pengunjung Indonesia, Edge node Vercel atau Cloudflare di Singapura cukup dekat. Yang efisien dilakukan di edge: memilih varian konten, set cookie pertama kali, A/B test bucketing, redirect berdasarkan geo, dan rewrite path. Yang tidak boleh dilakukan: query berat ke database utama atau panggilan API yang lambat.

Pola di Next.js: Middleware + Static Pages

Next.js menyediakan middleware yang dijalankan di edge. Pola yang kami pakai di proyek client:

1. Halaman utama tetap statis (SSG) supaya cache penuh.
2. Middleware membaca header geo, cookie segmen, atau query.
3. Middleware memilih varian (rewrite ke /id/jakarta atau /id/non-jakarta).
4. Setiap varian tetap statis dan di-cache CDN.
5. Hasilnya pengunjung dapat halaman tepat dalam <100 ms TTFB.

Dokumentasi resminya tertulis di Next.js Middleware. Untuk personalisasi yang lebih dalam (misalnya nama pelanggan), kombinasikan dengan client-side hydration setelah halaman muncul.

Studi Kasus Atmo LMS: Memisahkan Pemula dan Lanjutan

Di Atmo LMS, pengunjung baru dan pengunjung yang sudah pernah belajar butuh halaman yang berbeda. Sebelumnya kami pakai SSR yang menambah TTFB 400 ms. Setelah pindah ke pola Edge Middleware + dua varian statis, TTFB stabil di bawah 150 ms. LCP di P75 turun dari 2,8 detik ke 1,9 detik. Konten tetap personal, tapi halaman tetap di-cache penuh.

Kuncinya bukan teknologinya, tapi disiplin memisahkan keputusan ringan (di edge) dari keputusan berat (di origin atau client). Tanpa disiplin itu, edge bisa berubah jadi mini server yang lambat.

Risiko dan Cara Mengatasinya

Dua risiko utama Edge Functions: cold start saat trafik rendah, dan keterbatasan memori. Untuk situs dengan trafik konsisten, cold start hampir tidak terasa. Untuk situs yang trafik kecil, sebaiknya batasi logic edge ke hal-hal sederhana. Risiko kedua adalah debugging yang lebih sulit. Pasang Server-Timing di response edge agar tim bisa baca durasi rewrite langsung di DevTools.

Pertanyaan Umum

Apa beda Edge Functions dengan Streaming SSR?

Edge Functions berjalan di pinggir jaringan untuk keputusan ringan. Streaming SSR berjalan di server untuk merender konten dinamis bertahap. Keduanya bisa dikombinasikan.

Apakah Edge Functions menambah biaya hosting?

Biasanya iya, dihitung per invocation. Vercel dan Cloudflare punya tier gratis yang cukup untuk situs kecil hingga menengah. Untuk situs trafik tinggi, hitung skenario harga sebelum produksi.

Apakah Edge Functions cocok untuk e-commerce?

Cocok untuk geo redirect, A/B testing, dan currency switching. Tidak cocok untuk hitung harga akhir yang butuh akses ke inventory atau diskon kompleks. Itu sebaiknya dilakukan di origin atau client.

Apakah Indonesia punya edge node?

Vercel dan Cloudflare punya node di Jakarta dan Singapura. Latensi dari Jawa biasanya di bawah 30 ms. Untuk audiens luar Jawa, Singapura masih cukup karena rute internet Indonesia banyak melewati sana.

Penutup: Personalisasi Tanpa Membuat Halaman Lambat

Personalisasi bukan alasan untuk membuat halaman lambat. Edge Functions memberi marketer dan developer Indonesia jalan tengah: konten berbeda untuk segmen berbeda, tapi halaman tetap statis dan cepat. Yang dibutuhkan bukan tools mewah, tapi pemikiran yang jelas tentang mana keputusan yang ringan dan mana yang berat. Sisanya tinggal eksekusi.