𝗠𝗲𝗻𝗷𝗶𝗻𝗮𝗸𝗸𝗮𝗻 𝗟𝗮𝘁𝗲𝗻𝘀𝗶 𝗔𝗜 𝗱𝗲𝗻𝗴𝗮𝗻 𝗦𝗦𝗘
Saya membangun fitur autocomplete AI. Pengguna membencinya.
Setiap ketukan tombol mengirimkan permintaan ke model AI. Pengguna menunggu 2 hingga 3 detik untuk respons lengkap. UI terasa rusak.
Saya mencoba debouncing. Saya mencoba caching. Saya mencoba loading spinner. Tidak ada yang berhasil. Masalah utamanya tetap ada. Pengguna harus menunggu seluruh jawaban sebelum melihat data apa pun.
Saya menyelesaikannya menggunakan Server-Sent Events (SSE) untuk melakukan streaming respons secara bertahap (chunk by chunk).
Alur lambat yang asli:
- Pengguna mengetik karakter
- Debounce 300ms
- Permintaan HTTP POST
- Server memanggil API AI (1-2 detik)
- Server mengembalikan respons lengkap
- Client merender
Pengguna tidak melihat apa pun selama 2 detik.
Saya mempertimbangkan polling, tetapi itu menambah terlalu banyak overhead. WebSockets bisa digunakan, tetapi terlalu berat untuk streaming satu arah.
Saya memilih SSE. Ini adalah standar di mana server mengirimkan event teks melalui satu koneksi panjang.
Mengapa SSE cocok untuk AI:
- Bersifat satu arah (server ke client)
- Menggunakan chunk JSON berbasis teks
- Menangani koneksi ulang secara otomatis
- Anda tidak memerlukan library tambahan
Hasilnya instan. Kata pertama muncul dalam waktu kurang dari 300ms. Pengguna melihat saran muncul huruf demi huruf.
Metrik saya meningkat:
- Waktu respons visual pertama: 2,1 detik menjadi 0,3 detik
- Keterlibatan pengguna: naik 40%
- Keluhan pengguna: nol
Streaming adalah tentang persepsi. UI yang lambat namun progresif lebih baik daripada UI yang cepat namun statis. Pengguna lebih suka melihat jawaban muncul kata demi kata daripada menunggu satu blok teks lengkap.
Jika fitur AI Anda terasa lamban, cobalah streaming terlebih dahulu.
Optional learning community: https://t.me/GyaanSetuAi