So sánh chỉ số Compose và Chế độ xem

Jetpack Compose tăng tốc độ phát triển giao diện người dùng và cải thiện việc phát triển trên Android. Tuy nhiên, hãy cân nhắc xem việc thêm Compose vào một ứng dụng hiện có có thể ảnh hưởng như thế nào đến các chỉ số như kích thước APK, bản dựng và hiệu suất thời gian chạy của ứng dụng.

Kích thước APK và thời gian tạo bản dựng

Phần này sẽ trình bày tác động đến kích thước tệp APK và thời gian xây dựng bằng cách xem ứng dụng mẫu Sunflower – một ứng dụng minh hoạ các phương pháp hay nhất để di chuyển ứng dụng dựa trên Khung hiển thị sang Compose.

Kích thước APK

Việc thêm thư viện vào dự án của bạn sẽ làm tăng kích thước tệp APK của dự án. Các kết quả sau đây dành cho tệp APK phát hành rút gọn của mỗi dự án đã bật tính năng rút gọn tài nguyên và mã, sử dụng chế độ đầy đủ R8 và được đo lường bằng Công cụ phân tích APK.

Chỉ chế độ xem Chế độ xem kết hợp và Compose Chỉ Compose
Kích thước tệp tải xuống 2.252 KB 3.034 KB 2.966 KB

Trong lần đầu thêm Compose vào Sunflower, kích thước APK đã tăng từ 2.252 KB lên 3.034 KB – tăng 782 KB. APK được tạo bao gồm bản dựng giao diện người dùng kết hợp Khung hiển thị và Compose. Sự gia tăng này là bình thường vì chúng tôi đã thêm các phần phụ thuộc bổ sung vào Sunflower.

Ngược lại, khi Sunflower được chuyển sang ứng dụng chỉ dành cho Compose, kích thước APK đã giảm từ 3.034 KB xuống còn 2.966 KB, tức là giảm 68 KB. Sự sụt giảm này là do việc xoá các phần phụ thuộc Khung hiển thị không dùng đến, chẳng hạn như AppCompat và ConstraintLayout.

Thời gian tạo bản dựng

Việc thêm Compose sẽ làm tăng thời gian tạo bản dựng của ứng dụng khi trình biên dịch Compose xử lý các thành phần kết hợp trong ứng dụng. Bạn có được kết quả sau đây bằng cách sử dụng công cụ gradle-profiler độc lập, thực thi một bản dựng nhiều lần để có thể đạt được thời gian tạo bản dựng trung bình cho thời lượng bản dựng gỡ lỗi của Sunflower:

gradle-profiler --benchmark --project-dir . :app:assembleDebug
Chỉ chế độ xem Chế độ xem kết hợp và Compose Chỉ Compose
Thời gian xây dựng trung bình 299,47 mili giây 399,09 mili giây 342,16 mili giây

Trong lần đầu thêm Compose vào Sunflower, thời gian xây dựng trung bình tăng từ 299 mili giây lên 399 mili giây – tăng 100 mili giây. Thời lượng này là do trình biên dịch Compose thực hiện thêm các thao tác để biến đổi mã Compose được xác định trong dự án.

Ngược lại, thời gian tạo bản dựng trung bình giảm xuống còn 342 mili giây, tức là giảm 57 mili giây, khi quá trình di chuyển của Sunflower sang Compose hoàn tất. Việc giảm này có thể do một số yếu tố làm giảm chung thời gian tạo bản dựng, chẳng hạn như xoá liên kết dữ liệu, di chuyển các phần phụ thuộc sử dụng kapt sang KSP, đồng thời cập nhật một số phần phụ thuộc lên phiên bản mới nhất.

Tóm tắt

Việc sử dụng Compose sẽ làm tăng kích thước APK của ứng dụng một cách hiệu quả, đồng thời tăng hiệu suất trong thời gian xây dựng của ứng dụng do quá trình biên dịch mã Compose. Tuy nhiên, bạn cần cân nhắc những đánh đổi này với các lợi ích của Compose, đặc biệt là về việc tăng năng suất của nhà phát triển khi sử dụng Compose. Ví dụ: nhóm Cửa hàng Play nhận thấy rằng việc viết giao diện người dùng sẽ yêu cầu ít mã hơn nhiều, đôi khi lên tới 50%, do đó làm tăng năng suất và khả năng bảo trì của mã.

Bạn có thể đọc thêm các nghiên cứu điển hình trong bài viết Triển khai Compose cho nhóm.

Hiệu suất thời gian chạy

Phần này trình bày các chủ đề liên quan đến hiệu suất của thời gian chạy trong Jetpack Compose để giúp bạn so sánh Jetpack Compose với hiệu suất của hệ thống Khung hiển thị, cũng như cách đo lường hiệu suất đó.

Soạn lại thông minh

Khi các phần của giao diện người dùng không hợp lệ, Compose sẽ cố gắng chỉ kết hợp lại các phần cần cập nhật. Hãy đọc thêm về nội dung này trong tài liệu về Vòng đời của các thành phần kết hợp và các giai đoạn trong Jetpack Compose.

Hồ sơ cơ sở

Hồ sơ cơ sở là một cách hiệu quả giúp đẩy nhanh hành trình thông thường của người dùng. Việc đưa Hồ sơ cơ sở vào ứng dụng của bạn có thể cải thiện tốc độ thực thi mã khoảng 30% kể từ lần khởi chạy đầu tiên bằng cách tránh các bước diễn giải và các bước biên dịch đúng thời điểm (JIT) cho các đường dẫn mã đi kèm.

Thư viện Jetpack Compose có Hồ sơ cơ sở riêng và bạn sẽ tự động nhận được các biện pháp tối ưu hoá này khi dùng Compose trong ứng dụng của mình. Tuy nhiên, những tính năng tối ưu hoá này chỉ ảnh hưởng đến đường dẫn mã trong thư viện Compose. Vì vậy, bạn nên thêm Hồ sơ cơ sở vào ứng dụng của mình để che đi các đường dẫn mã bên ngoài Compose.

So sánh với hệ thống Chế độ xem

Jetpack Compose có nhiều điểm cải tiến so với hệ thống Khung hiển thị. Những điểm cải tiến này được mô tả trong các phần sau.

Chế độ xem mở rộng mọi mặt

Mỗi View vẽ trên màn hình, chẳng hạn như TextView, Button hoặc ImageView, đều yêu cầu phân bổ bộ nhớ, theo dõi trạng thái rõ ràng và nhiều lệnh gọi lại để hỗ trợ tất cả trường hợp sử dụng. Hơn nữa, chủ sở hữu View tuỳ chỉnh cần triển khai logic rõ ràng để ngăn việc vẽ lại khi không cần thiết (ví dụ: để xử lý dữ liệu lặp lại).

Jetpack Compose dùng nhiều cách để giải quyết vấn đề này. Compose không có các đối tượng có thể cập nhật rõ ràng cho các khung hiển thị vẽ. Các thành phần trên giao diện người dùng là các hàm có khả năng kết hợp đơn giản có thông tin được ghi vào thành phần kết hợp theo cách có thể phát lại. Điều này giúp giảm hoạt động theo dõi trạng thái, phân bổ bộ nhớ và lệnh gọi lại rõ ràng chỉ cho các thành phần kết hợp yêu cầu các tính năng đã nêu thay vì yêu cầu chúng bằng tất cả các tiện ích thuộc một loại View nhất định.

Hơn nữa, Compose cung cấp các quá trình kết hợp lại thông minh, phát lại kết quả đã vẽ trước đó nếu bạn không cần thực hiện thay đổi.

Nhiều thẻ bố cục

Nhóm thành phần hiển thị (ViewGroup) truyền thống có rất nhiều biểu hiện trong các API đo lường và API bố cục, khiến chúng dễ dàng nhận được nhiều lần truyền bố cục. Nhiều lượt truyền bố cục này có thể tạo ra tác dụng theo cấp số nhân nếu được thực hiện tại các điểm lồng nhau cụ thể trong hệ phân cấp khung hiển thị.

Jetpack Compose thực thi một lượt truyền bố cục duy nhất cho tất cả các thành phần kết hợp bố cục thông qua hợp đồng API. Điều này cho phép Compose xử lý hiệu quả các cây giao diện người dùng sâu. Nếu cần nhiều chế độ đo lường, Compose sẽ có phép đo lường hàm nội tại.

Xem hiệu suất khi khởi động

Hệ thống khung hiển thị cần tăng cường bố cục XML khi lần đầu hiển thị một bố cục cụ thể. Chi phí này được tiết kiệm trong Jetpack Compose vì các bố cục được viết trong Kotlin và được biên dịch như phần còn lại của ứng dụng.

Compose điểm chuẩn

Trong Jetpack Compose 1.0, hiệu suất của một ứng dụng ở chế độ debug và release có sự khác biệt đáng kể. Để biết thời gian đại diện, hãy luôn sử dụng bản dựng release thay vì debug khi lập hồ sơ ứng dụng.

Để kiểm tra hiệu suất của mã Jetpack Compose, bạn có thể sử dụng thư viện Jetpack Macrobenchmark. Để tìm hiểu cách sử dụng mẫu này với Jetpack Compose, hãy xem dự án MacrobenchmarkSample.

Nhóm Jetpack Compose cũng sử dụng Macrobenchmark để phát hiện mọi lần hồi quy có thể xảy ra. Ví dụ: hãy xem điểm chuẩn cho cột tải từng phần và trang tổng quan của nó để theo dõi số lần hồi quy.

Cài đặt hồ sơ Compose

Vì Jetpack Compose là một thư viện chưa theo gói, nên thư viện này không được hưởng lợi từ Zygote giúp tải trước các lớp và đối tượng có thể vẽ của Bộ công cụ giao diện người dùng của hệ thống Khung hiển thị. Jetpack Compose 1.0 sử dụng chế độ cài đặt hồ sơ cho các bản dựng phát hành. Trình cài đặt hồ sơ cho phép các ứng dụng chỉ định mã quan trọng cần được biên dịch trước (AOT) tại thời điểm cài đặt. Compose gửi các quy tắc cài đặt hồ sơ để giảm thời gian khởi động và hiện tượng giật trong ứng dụng Compose.