Vector Data Rendering Performance Analysis of Open-Source Web Mapping Libraries

Nowadays, various technologies exist with differing rendering performance for interactive web maps. These maps are consumed on devices with varying capabilities; therefore, choosing the best-performing library for a dataset is emphasized. Unlike existing research, this study presents a comparative analysis on libraries’ native performance for rendering large amounts of GeoJSON vector data, partially extracted from OpenStreetMap (OSM). Four libraries were analyzed. Results showed that regardless of feature types, Leaflet and OpenLayers excelled for features up to 10,000. Up to 5000 points, these two were the fastest, above which the libraries’ performance converged. For 50,000 or more, Mapbox GL JS rendered them the quickest, followed by OpenLayers, MapLibre GL JS and Leaflet. For up to 50,000 lines and 10,000 polygons, Leaflet and OpenLayers were the fastest in all scenarios. For 100,000 lines, OpenLayers was almost twice as fast as the others, while Mapbox rendered 50,000 polygons the quickest. The performance of Leaflet and OpenLayers scales with the increasing feature quantities, yet for Mapbox and MapLibre, any performance impact is offset to 1000 features and beyond. Slow initalization of map elements makes Mapbox and MapLibre less suitable for rapid rendering of small feature quantities. Other behavioural differences affecting user experience are also explored.