The supercluster example, why do the markers re-render on every move of the map? Any idea how to optimize this?

[raffidahmad]

I've tried to memo and callback and am even using the react compiler but no luck

[usefulthink]

In the useSupercluster hook, we're using the current map bounding-box to only retrieve results within the visible region.
So the 'clusters' array will be recomputed with every move. There could be a tiny opportunity for optimization, if we were to return the same list if nothing changed, but it don't think that would be worth it.

react-google-maps/examples/custom-marker-clustering/src/hooks/use-supercluster.ts

Lines 29 to 35 in 1d9d52c

	const clusters = useMemo(() => {
	// don't try to read clusters before data was loaded into the clusterer (version===0),
	// otherwise getClusters will crash
	if (!clusterer || version === 0) return [];
	return clusterer.getClusters(bbox, zoom);
	}, [version, clusterer, bbox, zoom]);

[raffidahmad]

Just removing the bounding-box from the dependency array has stopped a lot re-rendering for me, to put it into perspective i have about 1000+ advanced markers on the map and you could see them flickering when moving around

[usefulthink]

Hmm, are we talking about the "custom-marker-clustering" example, or the basic "marker-clustering" one?

[raffidahmad]

the custom-marker-clustering, i just relalized it after seeing your code snippet above and removed the bbox from the dep array

[raffidahmad]

you should be able to try it out in the examples sandbox, it also re-renders the markers on moving the map around even when not zooming in/out

[usefulthink]

Sure, but for one, that is actually required since there could be new markers coming into / leaving the view when moving the map around, since it will only request data for the current viewport from the supercluster library. On the other hand, that shouldn't generate a thousand AdvancedMarker components. I tested it with huge (~500k points) datasets, but even there I didn't see more than maybe 400 markers at the same time.

Lastly, re-rendering the markers should normally not be a huge problem as long as the props of the markers aren't needlessly changing. But there might still be things for us to look into...

[raffidahmad]

Maybe we could add a condition to it to only re-render on a specific zoom level?