Introduction

The crux of my issue is that when I provide contentPadding to the GoogleMap component it causes recompositions. I need to update the content padding often because I have a bottom sheet for displaying search results! (we modeled it after the Google Maps app) If I have many pins (20-50) on the map the UX is severely hindered and there is a lot of lag.

We really want to update the content padding dynamically as it creates a nice UX and allows us to better utilize the GoogleMap animation APIs. Not to mention, it allows us to keep the Google logo visible.

Anyway, since this API is merely a wrapper around the XML Google Maps implementation I suspect there are some limitations to how well you can optimize this behavior. However, I must expose this issue as it isn't an easy thing to fix on my end and it seriously affects the major production app that I work on with many millions of users.

I can do a few things to kludge this:

1. Adjust the content padding only when the bottom sheet settles into a new position. This works but is ugly as the map components teleport around.
2. Never update content padding and do math for centering the map and doing area searches. This isn't fun for obvious reasons.

Environment details

1. Google Maps Compose 2.11.1
2. Android

Steps to reproduce

I made a repo to reproduce this and illuminate the issues I am seeing!

Clone the repo!

git clone git@github.com:lucas-livefront/google-map-recompositions.git

Add your API key to local.properties by inserting this line and replacing <your-key> with a valid key!

MAPS_API_KEY=<your-key>

Then simply run the app and turn on the layout inspector and monitor the recompositions!
There are two examples: MapExample and CustomComponentExample. MapExample is meant to illustrate the many recompositions that occur when we adjust content padding. CustomComponentExample is meant to illustrate how we can avoid recompositions while still updating content padding!

In order to experiment with the two different examples go to MainActivity.kt and you can swap them out!

        setContent {
            MapsRecompositionsTheme {
                MapExample() // Swap me out with CustomComponentExample()
            }
        }

Demos

April 7, 2023 Update

Due to the comment by @pseudoankit I added a MapEffectExample as well. This helps illustrate the pros and cons of that approach.