Mercari cải thiện năng suất phát triển giao diện người dùng thêm 56% nhờ Jetpack Compose

Mercari cho phép hàng triệu người mua sắm và bán hầu hết mọi thứ. Công ty này được thành lập vào năm 2013 tại Nhật Bản và hiện là trang web thương mại C2C lớn nhất tập trung vào điện thoại thông minh ở Nhật Bản. Nhóm Kiến trúc sư khách hàng của Mercari bắt đầu sử dụng Jetpack Compose vào năm 2020 với mục tiêu sử dụng các giải pháp và công nghệ hiện đại có thể mở rộng quy mô trong dài hạn để xây dựng ngăn xếp công nghệ cho các ứng dụng mới.

Những việc họ đã làm

Nhóm Mercari cần triển khai một hệ thống thiết kế có tính năng quản lý trạng thái và tạo kiểu phức tạp trên Android View – một nhiệm vụ rất phức tạp. Khi sử dụng Jetpack Compose, họ không chỉ triển khai được hệ thống phức tạp này mà còn tiết kiệm được thời gian phát triển từng màn hình.

Jetpack Compose cũng giúp nhóm viết mã giao diện người dùng cho ứng dụng mới của họ bằng cách sử dụng hệ thống thiết kế, giúp mã giao diện người dùng của họ ngắn gọn và dễ hiểu. Do đó, nhóm có thể dành nhiều thời gian hơn để viết các màn hình và logic nghiệp vụ, chẳng hạn như hỗ trợ thực tế cho giao diện tối.

Ngoài ra, nhóm Mercari đã viết một công cụ chứng minh khái niệm để tích hợp Figma với hệ thống thiết kế, công cụ này tự động tạo mã giao diện người dùng từ các thiết kế thành phần. Nhóm này cho biết việc phát triển công cụ này dễ dàng hơn với Compose do bản chất khai báo của nó.

"Sau khi quen với việc viết mã Jetpack Compose, nhà phát triển Android sẽ không muốn quay lại." – Anthony Allan Conda, Trưởng nhóm công nghệ Android tại Mercari

Kết quả

Nhờ Jetpack Compose và hệ thống thiết kế mới, Mercari có thể sử dụng ít mã hơn nhiều để viết các màn hình. Trên những màn hình có nội dung có thể cuộn vô hạn (một trường hợp sử dụng phổ biến), họ đã giảm mã khoảng 56%. Nhờ đó, họ có thể viết nhiều màn hình hơn trong cùng một khoảng thời gian, giúp họ có thêm thời gian để viết logic nghiệp vụ và các phần khác của mã.

Ngoài ra, họ có thể làm được nhiều việc hơn với chính giao diện người dùng, chẳng hạn như kết hợp ảnh động và sử dụng các API trực quan như AnimatedVisibility, CrossfadeAnimatable.

Mercari dự định tiếp tục sử dụng Jetpack Compose trong ứng dụng mới của họ cho đến khi phát hành. Hệ thống thiết kế của họ, với Android SDK được viết bằng Jetpack Compose, cũng được thiết kế để hoạt động với nhiều ứng dụng trong Mercari.

Bắt đầu

Tìm hiểu thêm về Jetpack Compose.