Performance Test of vector-tiles with node-mapnik and Leaflet GridLayer

Опубликовано: 05 Август 2026
на канале: Wilhelm BERG
6,637
25

UPDATE

I never finished that project, please don't ask for source code.

I didn't use GeoJSON as transfer protocol, as it grows too big too fast with a lot of data.
I implemented a custom transfer format with delta encoded (http://en.wikipedia.org/wiki/Delta_en...) coordinates relative to the tile origin.

------------------

Client side vector rendering can be done with a combination of MapBox Studio (to create vector tiles), MapBox GL (client side rendering) and a server that you build by yourself:

https://www.mapbox.com/mapbox-studio/
https://github.com/mapbox/mapbox-studio

https://www.mapbox.com/mapbox-gl/
https://github.com/mapbox/mapbox-gl-js


==========


Watch till 0:32 to see a +600MB shapefile in action!

My first deep-dive into the MapBox (https://www.mapbox.com/) tool stack.

Datasources are shapefiles that are converted to vector tiles via node-mapnik.
Real vector data (geometries, no bitmaps) is transferred to the client.
No caching, which means the tiles are generated on each request (for now).
On the client the data gets rendered to the canvas via a custom Leaflet GridLayer.

I think the performance is pretty impressive already:
Both speedwise and concerning the functionality that comes out of the box with mapnik (simplification, coordinate tolerance, ...).

Nevertheless there is a lot of room for improvements for my application:
Caching of tiles on the server
Custom, minified vector format for transfer to the client (maybe even pbf)
Optimizing drawing to canvas