Google membangun kembali Dart DevTools dari awal di Flutter

Flutter adalah a kerangka pemrograman lintas platform, yang bertujuan untuk mengatasi kesulitan dalam mengembangkan aplikasi lintas platform tanpa kekacauan kode non-asli. Dengan pengetahuan tentang bahasa pemrograman Dart, pengembang dapat membuat aplikasi untuk Android, iOS, web, dan desktop dengan UI terpadu di seluruh aplikasi. Berkibar 1.9 membawa dukungan macOS dan Catalina dalam keadaan alfa sementara rilis v1.12 mematangkan dukungan mereka melewati kondisi pra-alfa dan itu v1.17 dari Flutter dan v2.8 dari Dart menandai rilis stabil pertama mereka pada tahun 2020. Hari ini, Google merilis versi baru DevTools untuk kode Dart dan Flutter, yang telah dibuat ulang dari awal di Flutter dan dilengkapi dengan beberapa peningkatan.

Dalam pengumuman sebelumnya, Google telah menyebutkan niatnya untuk menukar versi Dart DevTools saat ini dengan versi Flutter yang baru. Hal ini kini terjadi karena DevTools baru telah dibuat ulang dari awal di Flutter. DevTools versi baru ini menambahkan peningkatan seperti perubahan pada halaman kinerja dan memori, serta halaman jaringan yang benar-benar baru.

Tapi mengapa membangun kembali sesuatu ketika masih berfungsi? Tim di belakang Flutter mengklaim bahwa manfaat produktivitas penting ketika membangun kinerja tinggi UI, dan cara terbaik untuk menunjukkan keyakinan terhadap klaim ini adalah dengan menggunakan alat yang sama diri. Membangun kembali di Flutter juga memungkinkan pengembang memilih model distribusi setelah menulis kode adalah penyimpangan dari diagram alur pengambilan keputusan saat ini dimana model distribusi akan menentukannya kode.

DevTools dikirimkan sebagai aplikasi web yang memudahkan untuk mengintegrasikan alat tersebut ke dalam pengalaman perkakas yang ada di seluruh platform dan IDE target. DevTools adalah seperangkat alat mandiri yang berjalan di browser, dan berfungsi untuk aplikasi seluler, aplikasi desktop, dan web. aplikasi.

DevTools menggabungkan fitur-fitur berikut:

• Inspektur Flutter: alat untuk memvisualisasikan dan menjelajahi pohon widget. Anda dapat memilih widget di aplikasi yang sedang berjalan, memperlambat semua animasi, melihat garis dasar teks, dan banyak lagi.
  • Salah satu fitur barunya adalah Layout Explorer yang dapat Anda temukan di tab Flutter Inspector di sebelah Details Tree. Layout Explorer memungkinkan Anda memeriksa model tata letak fleksibel Flutter. Tim memberikan contoh bagaimana alat ini dapat membantu men-debug mengapa deretan widget tidak terlihat seperti yang diharapkan pengembang, misalnya.

• Tampilan garis waktu: menunjukkan waktu pembuatan untuk setiap frame dan diagram nyala. Hal ini memudahkan untuk mengidentifikasi kerangka bermasalah dalam konteksnya.
  • Panel ini sekarang dilengkapi tombol Track Widget Builds baru yang menambahkan waktu pembuatan semua widget di dalamnya aplikasi Anda ke timeline (dengan mengorbankan kinerja pembuatan profil Anda—sehingga tidak aktif bawaan). Ini berguna saat Anda mencoba mencari tahu widget mana sebenarnya yang berada di balik frame lambat.

• Tampilan memori: menunjukkan bagaimana aplikasi Anda menggunakan memori pada saat tertentu.
  • Tampilan ini sekarang menampilkan peta panas dari memori yang dialokasikan dan memungkinkan pelacakan memori platform juga.

• Tampilan kinerja: Ini adalah profiler CPU tradisional. Ini memungkinkan Anda merekam sesi aplikasi Anda dan melihat fungsi mana yang menghabiskan sebagian besar waktunya oleh CPU. Anda dapat menggunakan ini untuk memutuskan di mana akan menghabiskan waktu Anda untuk mengoptimalkan.
• DevTools bahkan menyertakan miliknya sendiri debug. Ini bisa berguna jika Anda tidak menggunakan IDE namun masih menginginkan opsi untuk menambahkan breakpoint, menelusuri kode, mengintip nilai variabel, dan sebagainya.

• Tampilan jaringan: Ini benar-benar baru.
  • Sesuai dengan namanya, ini memungkinkan Anda memeriksa lalu lintas jaringan. Anda dapat melihat seluruh riwayat permintaan yang dibuat aplikasi Anda sejak dimulainya dan mendapatkan informasi mendetail tentang masing-masing permintaan. Hal ini membebaskan Anda dari keharusan mencatat peristiwa ini sendiri saat mencoba men-debug masalah jaringan.
  • Tab Jaringan saat ini menampilkan lalu lintas HTTP; perbaikan di masa depan termasuk menunjukkan lalu lintas I/O soket umum.
  • Permintaan jaringan juga ditampilkan dalam tampilan Timeline sehingga Anda dapat melihatnya dalam konteks.
• Tampilan pencatatan: menampilkan peristiwa dari aplikasi dan kerangka kerja Anda. Dengan itu, Anda dapat dengan mudah memfilter pesan (misalnya, Anda dapat menentukan "-gc" untuk memfilter peristiwa Pengumpul Sampah atau "flutter.frame" untuk hanya menampilkan peristiwa bingkai). Di Dart, mencatat pesan dapat terstruktur, dan tampilan Logging memanfaatkannya.

Untuk memanfaatkan DevTools sepenuhnya, Anda dapat membaca dokumentasi. Jika Anda menemukan bug, atau jika Anda ingin memberikan suara pada fitur baru, Anda dapat melakukannya GitHub.