Pada hari ini saya ingin perkenalkan kepada anda satu alatan yang sering saya gunakan untuk menguji reka bentuk responsif (responsive web design) sesebuah laman web. Sejujurnya ia sangat membantu saya dalam menyiapkan tugasan yang diberikan. Alatan tersebut adalah LT Browser.
Apa itu LT Browser?
LT Browser ini adalah sebuah produk yang dihasilkan oleh LamdaTest, sebuah syarikat berteraskan awan yang penyedia perkhidmatan pengujian untuk aplikasi web ke hampir lebih 2000 jenis browser, sistem operasi dan peranti.
Menariknya mengenai LT Browser ini, ia membantu saya untuk menangani mimpi ngeri setiap front-end developer di luar sana iaitu menguji keupayaan reka bentuk aplikasi web saya ke arah rekaan yang lebih mesra telefon bimbit (mobile friendly).
Menyokong hampir 50 jenis paparan (viewport) yang terdiri daripada pelbagai peranti popular, kerja saya menjadi sangat mudah dengan hanya mengujinya menggunakan LT Browser. Kepala pun tak sakit, saya pun punyai kesempatan untuk melihat adalah rekaan saya responsif dengan telefon bimbit (mobile responsive) yang pelbagai.
Apa yang menarik lagi pada browser ini?
Sudah mestinya sebab utama mengapa saya menyukai LT Browser ini ialah disebabkan oleh kemampuannya untuk menguji rekaan (design) saya dalam pelbagai resolusi dan saiz skrin. Selain daripada itu ada juga beberapa sebab lain. Antaranya:
1. Ujian boleh dilakukan secara localhost
Saya dalam banyak-banyak hal, ini antara perkara yang saya sangat mahukan iaitu menguji rekaan saya secara localhost atau offline. Terdapat beberapa produk lain yang berada di luar sana menawarkan fungsi yang serupa, namun kebanyakannya berbayar. Bila saya tahu ia menawarkan fungsi yang serupa secara percuma, laju sahaja saya muat turun.
2. Debug: Devtools
Sama seperti Chrome DevTools, fungsi Devtool yang terdapat pada LT Browser ini juga membenarkan saya membuat debugging secara live tanpa sebarang masalah. Jadi saya boleh mengenalpasti penyelesaian kepada masalah rekaan saya dengan lebih pantas.
Sudah jumpa penyelesaian? LT Browser ini juga menyokong fungsi hot reloading dimana ketika anda berada dalam debug mode, anda boleh melihat apa attribute yang diubah kelihatan kepada paparan skrin. Jadi mudahlah untuk pembangun untuk bereksperimen.
3. Rakam video dan tangkap layar (screenshot)
Fungsi ini saya jarang guna, tetapi ianya sangat membantu apabila melibatkan perbincangan dengan ahli pasukan yang berkaitan dengan permasalahan produk. Mana tau ada tak kena dengan paparan rekaan atau nak buat fungsi tambahan, sekurangnya boleh la berkongsi dengan UI/UX designer atau project manager.
4. Pendikit rangkaian (Network Throttling)
Ini salah satu fungsi devtools yang ada pada browser ini. Kalau anda tak faham tentang maksud pendikit rangkaian, ianya berkenaan permasalahan untuk mengakses laman web anda mengikut kelajuan capaian internet.
Maklumlah, bukan semua orang memiliki akses internet yang laju. Jadi browser ini membenarkan anda untuk menguji akses kepada laman web anda dengan internet kelajuan serendah 3G ke 5G. Kalau interaksi dan kelajuan akses terlalu lama, dah boleh la berusaha untuk buat apa yang patut.
5. Laporan Prestasi Rumah Api Google
Laporan prestasi yang turut dikenali sebagai Google Lighthouse Performance Reports ini memberi laporan yang terperinci tentang prestasi laman web anda untuk paparan di desktop dan juga telefon bimbit.
Antara aspek yang disentuh adalah berkenaan dengan prestasi, kebolehakses, amalan terbaik, SEO dan PWA. Sambungan terus kepada Page Speed Insights juga boleh dilakukan jika anda mahukan analisis yang lebih terperinci.
Soalan Lazim
LT Browser boleh digunakan secara percuma tanpa sebarang limitasi. Ianya adalah sebahagian daripada produk penguji Lambdatest.
Boleh. Anda boleh menguji tahap responsif rekaan laman web anda secara localhost/offline tanpa sebarang masalah. Cuma terdapat limitasi daripada laporan prestasi rumah api Google yang tidak dapat diakses menerusi ujian offline.
LT Browser ini boleh dimuat turun di laman web rasmi Lambdatest dan ianya menyokong pelbagai jenis OS seperti Windows, Mac OSX dan Ubuntu.
Laman web rasmi Lambdatest: Muat turun
Kesimpulan
Bagi saya, LT Browser ini sebuah aplikasi yang sangat memenuhi keperluan saya sebagai front-end developer. Walaupun ia mempunyai beberapa kekurangan seperti laporan prestasi tidak boleh dimuat turun dan hanya dua peranti boleh diuji dalam satu masa, asalkan ia percuma bagi saya dah cukup baik.
Baca juga: Bagaimana cara debug ghost CSS secara manual
Jika aplikasi kegemaran saya adalah LT Browser, apa pula aplikasi atau kaedah yang anda gunakan untuk menguji tahap responsif rekaan laman web anda? Jangan lupa kongsikan di ruangan komen. Mungkin saya sendiri boleh mencubanya.
