A CLI tool to convert multi-module Jetpack Compose compiler metrics into beautiful HTML reports

Overview
Dowel banner

A CLI tool to convert multi-module
Jetpack Compose compiler metrics
into beautiful HTML reports

Download Mendable

License CI

1. What are Jetpack Compose compiler metrics?

The Compose Compiler plugin can generate reports/metrics around certain Compose-specific concepts that can be useful in understanding what is happening with some of the Compose code at a fine-grained level.

It can output various performance-related metrics at build time, allowing us to peek behind the curtains and see where any potential performance issues are.

Read more here

2. Why Mendable?

Although, the metrics generated by the Compose Compiler are in pseudo-Kotlin style function signatures, which are reasonably readable. But, over time these files get big and unwieldy to work with, and checking each-and-every composable in those txt files becomes cumbersome and clumsy. Also, these reports are spread across different files for different modules.

That is where Mendable comes in and takes care of generating HTML reports for Compose compiler metrics, which are much easier to work with. And Mendable only presents composable methods which need your attention, and highlights the issue-causing part with appropriate colors. It filters out the rest of the composables which are non-problematic.

Mendable also takes reports of multiple modules and merges them into different sections of a single beautiful HTML page to reduce going back and forth while working.

Note : Mendable only generates HTML report for the composables metrics. In other words, it only targets the '-composables.txt` files.

3. Gradle setup - for generating Compose compiler metrics

Add the following lines to your root project's build.gradle file. This will direct the Compose compiler to generate metrics and save all of them into the root project's build folder (for all of the modules).

Groovy
subprojects {
    tasks.withType(org.jetbrains.kotlin.gradle.tasks.KotlinCompile).configureEach {
        kotlinOptions {
            // Trigger this with:
            // ./gradlew assembleRelease -PenableMultiModuleComposeReports=true --rerun-tasks
            if (project.findProperty("enableMultiModuleComposeReports") == "true") {
                freeCompilerArgs += ["-P", "plugin:androidx.compose.compiler.plugins.kotlin:reportsDestination=" + rootProject.buildDir.absolutePath + "/compose_metrics/"]
                freeCompilerArgs += ["-P", "plugin:androidx.compose.compiler.plugins.kotlin:metricsDestination=" + rootProject.buildDir.absolutePath + "/compose_metrics/"]
            }
        }
    }
}
Kotlin scipt
allprojects {
    tasks.withType(org.jetbrains.kotlin.gradle.dsl.KotlinCompile::class.java).configureEach {
        kotlinOptions {
            // Trigger this with:
            // ./gradlew assembleRelease -PenableMultiModuleComposeReports=true --rerun-tasks
            if (project.findProperty("enableMultiModuleComposeReports") == "true") {
                freeCompilerArgs += listOf("-P", "plugin:androidx.compose.compiler.plugins.kotlin:reportsDestination=" + rootProject.buildDir.absolutePath + "/compose_metrics/")
                freeCompilerArgs += listOf("-P", "plugin:androidx.compose.compiler.plugins.kotlin:metricsDestination=" + rootProject.buildDir.absolutePath + "/compose_metrics/")
            }
        }
    }
}

With the above setup, you can generate Compose compiler metrics by executing the following command in the terminal window.

./gradlew assembleRelease -PenableMultiModuleComposeReports=true --rerun-tasks

4. How do I use Mendable?

Note : The following steps assume that you have a similar gradle setup as to the one described in step 3.

It is very straightforward. Download and execute the jar file while pointing it to the appropriate directory which contains all the Compose compiler-generated metrics files.

Mendable will take care of the rest. It will figure out metrics files of individual modules, parse them, compute and generate a beautiful HTML report for you.

4.1 Generate HTML report with a single command

Download and place the jar file in the same folder which contains all the generated Compose compiler metrics ( should be YourProject/build/compose_metrics). And then execute the jar file with the following command.

java -jar mendable.jar

After executing this command there should be index.html file generated in the same folder, which will contain the combined metrics of all the modules.

4.2 Generate HTML report by specifying paths manually

While the above method is the easiest, and should work fine for most of the use cases, Mendable also supports reading and writing files to custom locations. The following are the supported options via CLI arguments.

java -jar mendable.jar
    --composablesReportsPath, -i  [Default value : <Current working dir>] -> Path to the directory containing all of the composables.txt files
    --htmlOutputPath, -o          [Default value : <Current working dir>] -> HTML output directory
    --outputName, -oName          [Default value : "index"]               -> Name of the output HTML file
    --help, -h                                                            -> Usage info

For example :

java -jar mendable.jar
    -i /Users/username/Desktop/Your-project/build/compose_metrics \
    -o /Users/username/Desktop/Reports \
    -oName Your-project-metrics \

For the above command, files will be read from '/Users/username/Desktop/Your-project/build/compose_metrics' and the output file will be saved at '/Users/username/Desktop/Reports' and that file will be named ' Your-project-metrics.html'.


And your HTML report should look something like this

Mendable sample screenshot


Other things to know

  • Clicking on the composable's name in the HTML report will copy that name to the clipboard

  • You can build an executable jar yourself by executing the following command in the root of the project

./gradlew mendable:clean mendable:jar

Contributions

Contributions are super welcome! See Contributing Guidelines.

Discussions

Have any questions or queries, or want to discuss anything? Feel free and start a discussion.

Acknowledgements

Huge thanks to Shreyas Patil. This repo has been inspired by his version of compose-report-to-html CLI tool.

License

 Copyright 2022 Jaya Surya Thotapalli

   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
   You may obtain a copy of the License at

       http://www.apache.org/licenses/LICENSE-2.0

   Unless required by applicable law or agreed to in writing, software
   distributed under the License is distributed on an "AS IS" BASIS,
   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
   See the License for the specific language governing permissions and
   limitations under the License.
You might also like...
Multi module architecture Android template project using MVVM, Dagger-Hilt, and Navigation Components
Multi module architecture Android template project using MVVM, Dagger-Hilt, and Navigation Components

ModularAppTemplate An Android template project following a multi module approach with clean architecture. It has been built following Clean Architectu

Example Multi module architecture Android project using MVVM, Dynamic Features, Dagger-Hilt, Coroutines and Navigation Components
Example Multi module architecture Android project using MVVM, Dynamic Features, Dagger-Hilt, Coroutines and Navigation Components

ModularDynamicFeatureHilt An Android template project following a multi module approach with clean architecture. It has been built following Clean Arc

Calorie tracking app using multi-module CLEAN architecture
Calorie tracking app using multi-module CLEAN architecture

CalorieTrack Calorie tracking app using multi-module CLEAN architecture Tech used Multi-module Application (Improve build time & componentization) Kot

Built with Jetpack compose, multi modules MVVM clean architecture, coroutines + flow, dependency injection, jetpack navigation and other jetpack components

RickAndMortyCompose - Work in progress A simple app using Jetpack compose, clean architecture, multi modules, coroutines + flows, dependency injection

🚀 CLI-like personal webpage built with Kotlin/JS
🚀 CLI-like personal webpage built with Kotlin/JS

kotlin-cv.js Personal terminal-like simple webpage template built with Kotlin/JS. The template features CLI commands help, cat, ls, their completion a

A plugin for Termux to use native Android GUI components from CLI applications.

Termux:GUI This is a plugin for Termux that enables command line programs to use the native android GUI. In the examples directory you can find demo v

Reapp is everything you need to build amazing apps with React: a collection of packages that work together, our UI kit, and a CLI that scaffolds your app and includes a server and build system.
Reapp is everything you need to build amazing apps with React: a collection of packages that work together, our UI kit, and a CLI that scaffolds your app and includes a server and build system.

What is it? Reapp is everything you need to build amazing apps with React: a collection of packages that work together, our UI kit, and a CLI that sca

UltralightFabric - Ultralight, a HTML + CSS renderer for Fabric

Xander's Fabric Template for Kotlin The best Fabric template using kotlin. Usage Mod Development: Please read the Fabric Wiki for general mod developm

Solid - A CLI that tries to cover a dry-run phase for liquibase database change management

solid a CLI that tries to cover a dry-run phase for liquibase database change ma

Releases(0.5.0)
Owner
Jaya Surya Thotapalli
Android developer, contemplator.
Jaya Surya Thotapalli
Speech-Text Converter is a simple task that enable the user to convert the speech to text or convert text to speech (by Mic)

Speech-Text Converter About Speech-Text Converter is a simple task that enable the user to convert the speech to text or convert text to speech (by Mi

Kareem Saeed 1 Oct 21, 2021
An experimental tool for building console UI in Kotlin using the Jetpack Compose compiler/runtime

An experimental tool for building console UI in Kotlin using the Jetpack Compose compiler/runtime

Jake Wharton 1.4k Dec 28, 2022
Sample project that shows an approach for designing a multi-module architecture for Jetpack Compose Android applications.

Compose Multi-Module Architecture Sample Sample project that shows an approach for designing a multi-module architecture for Jetpack Compose Android a

Pavlo Stavytskyi 77 Jan 3, 2023
Modifold - Kotlin CLI tool for moving curseforge mods to modrinth

Modifold Modifold is a Kotlin CLI utility that allows you to transfer mods from

null 12 Nov 13, 2022
The Klutter CLI tool gives access to all tasks to create and manage a Klutter project.

Klutter CLI The Klutter CLI tool gives access to all tasks to create and manage a Klutter project. Gettings started Download the tool. Unzip the file.

Gillian 2 Mar 31, 2022
A multi module app, for improve knowledges

MultiModuleApp App multimódulos para estudos Aqui existem vários apps simples (1 em cada módulo) e está sendo construído por: App multi módulos Consum

PLINIO DA SILVA ALENCAR 0 Dec 27, 2021
A set of highly-opinionated, batteries-included gradle plugins to get you started building delicious multi-module Kotlin projects

Sourdough Gradle What is Sourdough Gradle? Sourdough is a set of highly opinionated gradle plugins that aim to act as the starter for your Kotlin proj

Backbone 0 Oct 3, 2022
Workout Journal is a mobile app based on Multi-Module and Clean Architecture for those who want to track their progress over a workout and a calendar period.

Workout-Journal Workout Journal is a mobile app for those who want to track their progress over a workout and a calendar period. The app allows you to

Maxim Smolyakov 4 Oct 23, 2022
Course_modularizing_android_apps - Multi-module demo app that gets data from a Dota2 api

Work in progress Multi-module demo app that gets data from a Dota2 api. Module n

Julio Ribeiro 1 Dec 30, 2021
Sample application to demonstrate Multi-module Clean MVVM Architecture and usage of Android Hilt, Kotlin Flow, Navigation Graph, Unit tests etc.

MoneyHeist-Chars Sample application to demonstrate Multi-module Clean MVVM Architecture and usage of Android Hilt, Kotlin Flow, Navigation Graph, Room

Hisham 20 Nov 19, 2022