Hey Hacker News,
I'm a long-time lurker and wanted to share a project I just finished building.
Like many React Native developers, I needed to add marker clustering to a map in my app. The most popular library for this, react-native-maps-clustering, was fantastic in its day but has become outdated and no longer works with modern versions of Expo, React Native, and their dependencies.
After hitting a wall of compatibility issues, I decided to take on the challenge of rewriting it from the ground up, focusing on a modern toolchain and a better developer experience.
The journey was a lot more challenging than I anticipated. It turned into a deep dive into solving dependency hell with different versions of @types/react, wrestling with build tool configurations for pnpm, bob, and ESLint, and ensuring everything was strictly typed with TypeScript. It felt like a classic case of yak shaving, but I was determined to create a solution that "just works" for developers today.
The result is RN Super Cluster, a performant, fully-typed, and easy-to-use clustering library for react-native-maps.
What it does: It provides a <ClusteredMapView /> component that you can use as a drop-in replacement for the standard <MapView />. Any <Marker /> components you place inside will be automatically clustered.
Key Features:
Modern & Maintained: Built with a modern toolchain and designed to be actively maintained.
Fully-Typed: Written entirely in TypeScript to prevent common errors and improve autocompletion.
High-Performance: Uses supercluster under the hood for extremely fast geospatial clustering.
Spiderfier: At the maximum zoom level, overlapping markers automatically "spiderfy" (spread out on a spiral) so they can be individually tapped.
Customizable: You can provide your own custom components for rendering clusters, and callbacks for handling press events.
This was a passion project born out of necessity, and I hope it can save other React Native developers the headaches I went through.I would love to get your feedback, and contributions are more than welcome!
GitHub: https://github.com/suwi-lanji/rn-maps-clustering NPM: https://www.npmjs.com/package/rn-maps-clustering
Thanks for checking it out!
I actually did a project doing clustering like that around 2018 using react native, we quickly realized we had to drop down to native for the maps. It was a huge pain in the ass because of the vastly different implementations of google/apple maps and dealing with bridging between native and react parts of the code.
Your project would have solved about 2-3 months of work and ongoing maintenance of 2 devs we had back then. The project is not around anymore but I will keep it in mind if I ever do something similar again.
Thank you very much for considering using it
Looks nice! As a suggestion, it would be easier to understand what this is about by adding a small video/GIF of the library in action.
Took me some time to understand what it was about.
Will do so, thank you
Cool stuff, especially spiderfier. What's your opinion of expo-maps? https://expo.dev/blog/introducing-expo-maps-a-modern-maps-ap...
Haven't used it yet, our team is fully integrated with react-native-maps, and I'm just hearing about it now
Good point. Is this something that expo maps can’t do?