[HN Gopher] Show HN: I rewrote an outdated React Native map clus...
___________________________________________________________________
Show HN: I rewrote an outdated React Native map clustering library
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!
Author : hadat
Score : 30 points
Date : 2025-07-09 07:07 UTC (15 hours ago)
(HTM) web link (github.com)
(TXT) w3m dump (github.com)
| belchiorb wrote:
| 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.
| hadat wrote:
| Will do so, thank you
| DanielHB wrote:
| 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.
| hadat wrote:
| Thank you very much for considering using it
| kevg123 wrote:
| Cool stuff, especially spiderfier. What's your opinion of expo-
| maps? https://expo.dev/blog/introducing-expo-maps-a-modern-maps-
| ap...
| belchiorb wrote:
| Good point. Is this something that expo maps can't do?
| hadat wrote:
| Haven't used it yet, our team is fully integrated with react-
| native-maps, and I'm just hearing about it now
___________________________________________________________________
(page generated 2025-07-09 23:02 UTC)