Mercari meningkatkan produktivitas pengembangan UI sebesar 56% dengan Jetpack Compose

Mercari memungkinkan jutaan orang berbelanja dan menjual hampir semua hal. Perusahaan ini didirikan pada tahun 2013 di Jepang, dan kini menjadi marketplace C2C yang berfokus pada smartphone terbesar di Jepang. Tim Arsitek Klien Mercari mulai menggunakan Jetpack Compose pada tahun 2020 dengan sasaran menggunakan solusi dan teknologi modern yang dapat diskalakan dalam jangka panjang untuk mem-build tech stack mereka untuk aplikasi baru.

Yang mereka lakukan

Tim Mercari perlu mengimplementasikan sistem desain dengan pengelolaan dan penataan status yang kompleks pada View Android — tugas yang sangat kompleks. Dengan menggunakan Jetpack Compose, mereka tidak hanya dapat menerapkan sistem kompleks ini, tetapi juga membantu mengurangi waktu yang mereka habiskan untuk mengembangkan setiap layar.

Jetpack Compose juga membantu tim menulis kode UI untuk aplikasi baru mereka yang memanfaatkan sistem desain, sehingga kode UI-nya ringkas dan mudah dipahami. Hasilnya, tim dapat menghabiskan lebih banyak waktu untuk menulis layar dan logika bisnis, seperti dukungan praktis untuk tema gelap.

Selain itu, tim Mercari menulis alat bukti konsep untuk mengintegrasikan Figma dengan sistem desain, yang secara otomatis menghasilkan kode UI dari desain komponen. Tim mereka mengatakan bahwa pengembangan alat ini lebih mudah dengan Compose karena sifat deklaratifnya.

“Setelah developer Android terbiasa menulis kode Jetpack Compose, mereka tidak akan ingin kembali.” - Anthony Allan Conda, Android Tech Lead di Mercari

Hasil

Antara Jetpack Compose dan sistem desain barunya, Mercari dapat menggunakan lebih sedikit kode untuk menulis layar. Di layar dengan konten yang dapat di-scroll tanpa batas — kasus penggunaan umum — mereka sebenarnya mengurangi kode sekitar 56%. Hasilnya, mereka dapat menulis lebih banyak layar dalam waktu yang sama, sehingga memberi mereka lebih banyak waktu untuk menulis logika bisnis dan bagian kode lainnya.

Selain itu, mereka dapat melakukan lebih banyak hal dengan UI itu sendiri, seperti menggabungkan animasi dan menggunakan API intuitif seperti AnimatedVisibility, Crossfade, dan Animatable.

Mercari berencana untuk terus menggunakan Jetpack Compose dalam aplikasi baru mereka hingga dirilis. Sistem desain mereka, dengan Android SDK yang ditulis dalam Jetpack Compose, juga dirancang agar berfungsi dengan beberapa aplikasi dalam Mercari.

Mulai

Pelajari Jetpack Compose lebih lanjut.