Membina Aplikasi Masa Nyata dengan WebSockets
Polling tidak baik untuk aplikasi anda.
Saya pernah membina widget sembang menggunakan AJAX polling. Saya menetapkan aplikasi tersebut untuk meminta mesej baharu daripada pelayan setiap saat. Ia berfungsi, tetapi ia perlahan. UI terasa lembap. Pelayan bekerja terlalu keras. Kebanyakan permintaan mengembalikan data kosong. Ia terasa seperti cuba mengisi tab mandi dengan sudu teh.
WebSockets mengubah perkara ini.
Daripada membuat permintaan berterusan, anda membuka satu sambungan yang kekal. Ini membolehkan aliran data dua hala. Pelayan boleh menolak data kepada klien secara serta-merta. Klien boleh menghantar data kepada pelayan secara serta-merta.
Mengapa guna WebSockets?
• Latensi menurun daripada ratusan milisaat kepada puluhan milisaat. • Beban pelayan menjadi lebih mudah diramal. • Anda menjimatkan lebar jalur dengan membuang pengepala HTTP yang berulang. • Ia berfungsi untuk sembang, pemberitahuan langsung, dan permainan berbilang pemain.
Cara ia berfungsi:
Sambungan bermula dengan permintaan naik taraf HTTP. Jika pelayan bersetuju, ia akan menghantar kod status 101. Selepas itu, anda menggunakan protokol binari mentah atau teks. Tiada lagi kuki atau pengepala yang melambatkan anda.
Perangkap biasa yang perlu dielakkan:
- Sambungan terputus: Rangkaian boleh gagal. Anda mesti melaksanakan strategi cubaan semula seperti exponential backoff.
- Kebocoran memori: Sentiasa tutup soket anda apabila pengguna keluar. Sambungan zombie memakan memori pelayan.
- Gelung mesej: Semasa menyiarkan (broadcasting), langkau penghantar asal. Jika tidak, pengguna akan melihat mesej mereka sendiri sebanyak dua kali.
- Sambungan pegun: Sesetengah proksi menutup sambungan yang senyap. Gunakan denyutan nadi (heartbeat) ping/pong untuk memastikan soket kekal aktif.
Berhenti bertanya kepada pelayan jika sesuatu telah berubah. Mulakan dengan mengekalkan talian terbuka supaya anda boleh berbual bila-bila masa sahaja anda perlu.
Cabaran anda:
Ambil contoh sembang asas. Tambahkan penunjuk "sedang menaip..." (typing...). Lancarkan ia ke hos seperti Render atau Fly.io. Sebaik sahaja anda melihat penunjuk itu bergerak secara masa nyata tanpa polling, anda telah meningkat ke tahap seterusnya.