Middleware (Next.js)

TL;DR: Middleware Next.js adalah fungsi yang dijalankan di lapisan edge sebelum sebuah request sampai ke halaman atau API route. Fungsinya untuk mengatur redirect, memeriksa otentikasi, menambah header, atau menjalankan A/B test, semuanya dengan latensi rendah karena berjalan dekat dengan pengguna.

Apa itu Middleware (Next.js)?

Middleware adalah satu file middleware.ts di root proyek Next.js yang menjalankan logika untuk setiap request yang cocok dengan pola tertentu. Bayangkan ia sebagai petugas di pintu masuk: setiap tamu (request) diperiksa lebih dulu sebelum diarahkan ke ruangan yang tepat (halaman). Karena berjalan di edge function, eksekusinya cepat dan tidak membebani server utama.

Kegunaan Umum

Middleware berbeda dari server action: server action menangani mutasi data dari komponen, sementara middleware bekerja di level request sebelum rendering dimulai.

Kenapa Penting?

Untuk pemilik website bisnis di Indonesia, middleware memungkinkan personalisasi dan proteksi rute tanpa menambah waktu muat yang terasa. Dalam beberapa proyek portofolio, saya memakai middleware untuk menjaga halaman admin tetap privat dan mengarahkan URL lama ke struktur baru tanpa mematahkan ekuitas SEO. Hindari logika berat di middleware karena ia berjalan di setiap request; pekerjaan berat lebih cocok di route handler. Dokumentasi resmi merangkum batasannya dengan jelas di Next.js Middleware.

Pertanyaan Umum

Apakah middleware memperlambat website?

Tidak signifikan jika logikanya ringan. Middleware berjalan di edge dan dirancang untuk tugas cepat seperti cek header atau cookie. Operasi berat sebaiknya dipindah ke API route.

Apakah middleware bisa mengakses database?

Bisa terbatas, tapi tidak disarankan untuk query berat karena lingkungan edge punya keterbatasan runtime. Untuk akses data penuh, gunakan route handler atau server action.