Load markers from a URL and update as user pans in Leaflet?

Question

I have a webapp generating thousands of CircleMarkers on a map, and right now I just download a few MB of JSON from my server and instantiate them when the site loads. This is a lot of data to download and slows page load.

Can I set up a marker layer that loads like a tile layer, where I pass in a url like theserver/markers/{x}/{y}/{z} etc. and then Leaflet can lazy load markers the way it does for tiles? I've thought about implementing this myself but it would be nice if there's a standard approach for this.

Answer 1

You can use Mapbox tippecanoe to convert GeoJSON to vector tiles and then Leaflet.VectorGrid plugin to display those tiles in Leaflet map.