When you’re managing a map with thousands of markers, speed becomes just as important as the data itself. Map data can be heavy, and trying to load this all at once can lead to resource spikes on your server, slow down of the visitor side and a drop off in engagement as a result.
The last thing we want is for visitors to leave frustrated by the performance of a map. WP Go Maps is already heavily optimized by design, to minimize the impact this has on visitors, but every project is different. It’s important to consider your unique needs and how to best serve your community.
To help you find the right balance for your project, we’re going to explore a few key features:
We’ll explore them in a way where they can handle heavy data with ease, plus some extra optimization tricks we think you’ll love.
Marker Caching – The Performance Powerhouse
Let’s start with the heavy hitter! When a visitor loads your map, your website usually has to load the markers in the background via the database. This means every visitor is requesting all of your marker data and when there are thousands of markers, this can lead to delays in load times.
More often than not, the initial markers are the same for every visitor, meaning we are leaving a lot of performance on the table. Map caching solves this issue by creating a snapshot of your data and saving it as a file, to be loaded by visitors instead.
This means no more database requests, reusing the snapshot data (cache) for every visitor instantly when they arrive on the map page.
Let’s take a look at a comparison of how this affects load times side-by-side. This example showcases load times for 10 000 markers with and without caching.
Without Caching
With Caching
Want to learn more about caching? Take a look at our caching documentation.
Marker Clustering – Decluttering the Viewport
If you have 50 locations in a single city, and your map covers multiple cities, showing all these markers at once can be a bit messy. It also forces the visitors browser to work harder by reposition all of these markers when the map is panned or the zoom level changes.
Marker Clustering solves this issue by grouping nearby markers into a single cluster with a number on it. As the user zooms in the cluster will break apart into smaller clusters, or individual markers. This is a much cleaner way to present your markers when you have a densely populated map.
There are also performance benefits to this, specifically on browsers with low memory budgets, where recalculating the visual location of markers might cause stutter. Clusters can improve the impact that this process has on those devices, making the map feel more responsive.
Our marker cluster documentation is a great resource for getting started with clusters.
Heatmaps – Visualize Data
When you don’t need interactive markers, and you only need to visualize service areas for example, heatmaps are a great companion feature.
Instead of rendering thousands of individual markers, a heatmap draws an intensity layer over the map surface. It’s a visually interesting way to showcase density, without the performance overhead of loading thousands of markers.
Ready to start with your own data visualization?
Batched Loading Markers
Another great way to reduce the impact of loading thousands of markers is to batch load them into the map, instead of loading all markers in a single request. It’s a great way of keeping your markers in-sync without clearing the cache, while still balancing visitor patience. This is the key difference between actual speed and perceived speed.
Imagine a map with 10 000 markers, loading all markers at once, which can take anywhere from 5-10 seconds (without caching). With batch loading we can load these markers incrementally, say in batches of 1000 markers at a time.
By prioritizing loading a single batch of markers, and loading the rest in the background we provide visitors with visual feedback that the map is loading markers. Let’s take a look at our map from earlier loading markers in batches of a few thousand at a time.
We have many more optimization settings available, to help you take your maps to the next level.
Your map should be a gateway to your locations, not a roadblock. By dialing in performance with caching/batch-loading, clustering locations or visualizing data in a more interesting way, you can provide a world-class experience to your community.