Penting untuk memahami pengalaman menggunakan aplikasi atau situs Anda saat konektivitas buruk atau tidak dapat diandalkan, dan membangunnya dengan sesuai. Ada berbagai alat yang dapat membantu Anda.
Pengujian dengan bandwidth rendah dan latensi tinggi
Sebagian besar orang menggunakan web di perangkat seluler. Bahkan di rumah, banyak orang meninggalkan broadband tetap untuk beralih ke seluler.
Dalam konteks ini, penting untuk memahami pengalaman menggunakan aplikasi atau situs Anda saat konektivitas buruk atau tidak dapat diandalkan. Berbagai alat software dapat membantu Anda mengemulasi dan menyimulasikan bandwidth rendah dan latensi tinggi.
Mengemulasi throttling jaringan
Saat mem-build atau mengupdate situs, Anda harus memastikan performa yang memadai dalam berbagai kondisi konektivitas. Beberapa alat dapat membantu.
Alat browser
Chrome DevTools memungkinkan Anda menguji situs dengan berbagai kecepatan upload/download dan waktu bolak-balik, menggunakan setelan kustom atau preset dari panel Jaringan. Lihat Memulai Analisis Performa Jaringan untuk mempelajari dasar-dasarnya.
Alat sistem
Network Link Conditioner adalah panel preferensi yang tersedia di Mac jika Anda menginstal Hardware IO Tools untuk Xcode:
Emulasi perangkat
Android Emulator memungkinkan Anda menyimulasikan berbagai kondisi jaringan saat menjalankan aplikasi (termasuk browser web dan aplikasi web campuran) di Android:
Untuk iPhone, Network Link Conditioner dapat digunakan untuk menyimulasikan kondisi jaringan yang terganggu (lihat di atas).
Menguji dari lokasi dan jaringan yang berbeda
Performa konektivitas bergantung pada lokasi server serta jenis jaringan.
WebPagetest adalah layanan online yang memungkinkan serangkaian pengujian performa dijalankan untuk situs Anda menggunakan berbagai jaringan dan lokasi host. Misalnya, Anda dapat mencoba situs dari server di India menggunakan jaringan 2G, atau melalui kabel dari kota di AS.
Pilih lokasi, lalu dari setelan lanjutan, pilih jenis koneksi. Anda bahkan dapat mengotomatiskan pengujian menggunakan skrip (misalnya, untuk login ke situs) atau menggunakan RESTful API-nya. Hal ini membantu Anda menyertakan pengujian konektivitas ke dalam proses build atau logging performa.
Fiddler mendukung proxy Global melalui GeoEdge, dan aturan kustomnya dapat digunakan untuk menyimulasikan kecepatan modem:
Menguji di jaringan yang terganggu
Proxy software dan hardware memungkinkan Anda mengemulasi kondisi jaringan seluler yang bermasalah, seperti throttling bandwidth, penundaan paket, dan hilangnya paket secara acak. Proxy bersama atau jaringan yang terganggu dapat memungkinkan tim developer untuk menyertakan pengujian jaringan di dunia nyata dalam alur kerja mereka.
Augmented Traffic Control (ATC) Facebook adalah kumpulan aplikasi berlisensi BSD yang dapat digunakan untuk membentuk traffic dan mengemulasi kondisi jaringan yang terganggu:
Facebook bahkan menerapkan 2G Tuesdays untuk membantu memahami cara orang menggunakan produk mereka di jaringan 2G. Pada hari Selasa, karyawan akan melihat pop-up yang memberi mereka opsi untuk menyimulasikan koneksi 2G.
Proxy HTTP/HTTPS Charles dapat digunakan untuk menyesuaikan bandwidth dan latensi. Charles adalah software komersial, tetapi tersedia uji coba gratis.
Informasi selengkapnya tentang Charles tersedia di codewithchris.com.
Menangani konektivitas yang tidak dapat diandalkan dan "lie-fi"
Apa yang dimaksud dengan lie-fi?
Istilah lie-fi berasal setidaknya dari tahun 2008 (saat ponsel terlihat seperti ini), dan mengacu pada konektivitas yang tidak seperti yang terlihat. Browser Anda berperilaku seolah-olah memiliki konektivitas, padahal, karena alasan apa pun, browser tidak memilikinya.
Konektivitas yang salah ditafsirkan dapat menyebabkan pengalaman yang buruk karena browser (atau JavaScript) terus mencoba mengambil resource, bukan menyerah dan memilih penggantian yang wajar. Lie-fi sebenarnya bisa lebih buruk daripada offline; setidaknya jika perangkat benar-benar offline, JavaScript Anda dapat mengambil tindakan penghindaran yang sesuai.
Lie-fi kemungkinan akan menjadi masalah yang lebih besar karena semakin banyak orang beralih ke perangkat seluler dan menjauhi broadband tetap. Data Sensus AS terbaru menunjukkan pergeseran dari broadband tetap. Diagram berikut menunjukkan penggunaan internet seluler di rumah pada tahun 2015 dibandingkan dengan tahun 2013:
Menggunakan waktu tunggu untuk menangani konektivitas yang terputus-putus
Sebelumnya, metode hacky menggunakan XHR telah digunakan untuk menguji konektivitas yang terputus-putus, tetapi pekerja layanan memungkinkan metode yang lebih andal untuk menetapkan waktu tunggu jaringan. Hal ini dapat dicapai menggunakan Workbox hanya dengan beberapa baris kode:
workboxSW.router.registerRoute(
'/path/to/image',
workboxSW.strategies.networkFirst({networkTimeoutSeconds: 3}),
);
Anda dapat mempelajari Workbox lebih lanjut dalam presentasi Chrome Dev Summit Jeff Posnick, Workbox: Flexible PWA Libraries.
Fungsi waktu tunggu juga sedang dikembangkan untuk Fetch API, dan Streams API akan membantu dengan mengoptimalkan pengiriman konten dan menghindari permintaan monolitik. Jake Archibald memberikan detail selengkapnya tentang cara mengatasi lie-fi di Meningkatkan kecepatan pemuatan halaman.