Berita DevTools, yang terbaru
Item berita pertama dalam postingan ini adalah meta kecil – ini adalah pembaruannya sendiri. Sesekali, setidaknya sebulan sekali, saya akan merangkum apa yang terjadi di dunia Chrome DevTools, saat dipublikasikan.
Saya serius di sini: saya akan membahas fitur baru yang baru saja hadir di Chrome Canary, jadi jika Anda lebih suka versi yang stabil, ini keren juga. Namun, jika Anda ingin bertualang dan ingin tetap di posisi teratas, postingan ini tepat untuk Anda. Selain fitur dan perbaikan bug terbaru, Anda akan menemukan bagian Detak Jantung Komunitas di akhir setiap postingan, yang menyoroti bagian terbesar Anda, pengguna tercinta, yang telah berkontribusi.
Tanpa basa-basi lagi, mari masuk ke berita yang sebenarnya.
Baru di DevTools
Screenshot mirip film strip di Network dan Linimasa
Seminggu yang lalu, kami memindahkan fitur baru yang signifikan dari eksperimen: Kemampuan mengambil screenshot halaman di tab Jaringan dan Linimasa.
Di panel Jaringan, klik ikon kamera kecil untuk mengaktifkan pengambilan frame, lalu muat ulang halaman untuk memicu pengambilan gambar. Selain screenshot yang diambil dengan alat lain seperti WebPageTest, saat ini kami hanya menampilkan frame yang benar-benar berasal dari paint.
Mengklik dua kali pada salah satu frame akan menunjukkan tampilan yang diperbesar (lalu gunakan panah kiri/kanan untuk menavigasi), mengarahkan kursor ke atasnya akan menampilkan garis di seluruh panel dan linimasa untuk memvisualisasikan secara persis kapan frame diambil, sehingga Anda dapat berkaitan dengan urutan pemuatan. Hal ini mempermudah proses debug masalah pemuatan umum, seperti font web yang memblokir perenderan.
Di panel Linimasa, Anda dapat mengaktifkan pengambilan screenshot dengan mengalihkan kotak centang "Screenshot" di toolbar bagian atas. Di sini, semuanya bekerja sedikit berbeda, dibandingkan dengan panel Jaringan: Dalam hal ini, kami mencoba menangkap sesering mungkin – terlepas dari warna yang sebenarnya – agar dapat menghapus screenshot tersebut pada skala waktu linier yang berkorelasi dengan baris lain di Linimasa. Alih-alih perlu mengklik dua kali untuk menampilkan pratinjau, bingkai yang diperbesar akan muncul saat kursor diarahkan.
Karena keduanya sedikit tidak sinkron dalam hal fungsi dan UX, kami ingin menganjurkan Anda untuk mencoba fitur-fitur tersebut dan memberikan masukan Anda melalui tiket di crbug.com/new atau melalui tweet ke @ChromeDevTools.
Throttling Jaringan di panel Jaringan
Throttling jaringan, fitur yang kami tambahkan saat memperkenalkan Mode Perangkat, menemukan tempat kedua di toolbar panel Jaringan sehingga Anda dapat berfokus pada pengoptimalan jaringan di satu tempat.
Rumah baru ini hanyalah cermin: Mode ini masih tersedia di luar Mode Perangkat, karena menyimulasikan konektivitas buruk masih sangat penting saat berupaya membuat situs Anda responsif.
Terakhir, apakah Anda salah satu orang malang ini yang bertanya-tanya mengapa koneksi internet Anda terputus setelah seharian bekerja, lalu menyadari bahwa Anda lupa menonaktifkan throttling jaringan? Tab panel Jaringan sekarang menampilkan ikon peringatan saat throttling jaringan diaktifkan.
Berbagai informasi
- Membenci lingkaran aneh itu di rentang waktu jaringan? Kami juga. Ini adalah titik waktu saat frame (dalam strip film baru) diambil. Sekarang keduanya muncul sebagai garis saat Anda mengarahkan kursor.
- Mode Perangkat kini mempertahankan orientasi saat Anda beralih antar-perangkat
Heartbeat Komunitas
Tidak berfungsi dengan Chrome DevTools
Bret Little merilis kursus panduan singkat yang bagus ini, yang memperkenalkan fungsi DevTools dasar dan juga menawarkan banyak tips dan trik mendalam. Info ini sangat berguna, dan lebih banyak dokumen DevTools tidak ada salahnya.
IDE DevTools...?!
Kenneth Auchenberg, developer web dan penggemar DevTools, mengembangkan aplikasi DevTools mandiri bukti beberapa bulan lalu, dan entah bagaimana postingan blognya menjadi berita (peretas) lagi minggu ini.
Mengubah DevTools menjadi IDE hebat adalah ide yang menyenangkan, yang pernah diimpikan oleh banyak anggota tim kami sebelumnya, tetapi juga akan menjadi proyek dengan proporsi yang epik.
Bagaimana menurut Anda? Apakah DevTools IDE adalah pipe-dream atau dapatkah Anda melihatnya berhasil? Bagaimana seharusnya? Beri tahu kami melalui komentar.
Sampai jumpa!
Paul Bakaus & tim DevTools