Hacker News new | ask | show | jobs
by et-al 698 days ago
Not to sure how your backend is set up, but it looks like you're generating GeoJSON on the fly and the JSON serialization for this amount of data can be slow.

In typical HN fashion, I would suggest looking into using Tippecanoe to generate some vector tiles of the data and host that on S3. Then the DB can fall back to performing simple lookups via the accident ID. Filtering by time will need to move to the frontend, but that should be fine (if not, look into clustering the data at further zoom levels).

https://github.com/mapbox/tippecanoe

1 comments

This is very helpful
Hi Ben, briefly took another look this morning and I'm sorry for the hasty rec because I forgot Leaflet doesn't support vector tiles as easily as MapLibre/Mapbox.

If the bottle-neck is the DB and you haven't enabled the PostGIS extension, I'd look into that as the other commenter mentioned. If it's your server, then yes look into pre-generating all the tiles and hosting them elsewhere, but this might then mean switching over to MapLibre/Mapbox (which is what most companies end up using because of Leaflet's limitations).

For filtering on the frontend, I'd look into Expressions so you're not regenerating the GeoJSON collection every time (this causes a significant delay and flicker).

- https://maplibre.org/maplibre-style-spec/expressions/

- https://maplibre.org/maplibre-gl-js/docs/examples/hover-styl...

I've built quite a few open source mapping projects myself using Tippecanoe and other tools. Feel free to email me if you want help setting this up!
You could also take a look at PostGIS to do geospatial queries (if needed). And in the past I’ve used node-mapnik to render vector/image map tiles. You can indeed host and cache them effectively on S3.