This question already has an answer here:

I've just added a couple of more WFS backed vector layers to a map and the performance has dropped. Whilst debugging this I've noticed that openlayers is considering every feature in the visible layers when rendering.

If I'm zoomed right in so there are a only couple of features from a few layers and then say pan the map up a small amount. I'd expect openlayers to use a spatial index to identify which features need to be rendered and only render those.

However, I'm seeing my context based styles being asked for symbolizer info for every feature in every layer. E.g. my externalGraphic function is been called for features that are on the other side of the country!

  externalGraphic: function(f) {
      return map.zoom < switchZoom ? icon : "/grails-app/feature/image/" + f.fid;

When zoomed out my layers are not visible but when zoomed in there are suddenly 1000s of feature being considered. Is there a way to get openlayers to use some filter when rendering? I had thought about adding map zoom/pan event handlers to map features in and out of layers using a spatial filter but I'm pretty sure I shouldn't have to do that.

I don't believe that the fact that my data originally comes from a WFS source is the issue here. My app also runs offline, the data, once retrieved is stored locally, the retrieval and resources needed to hold these in memory is fine.

There must be a way of getting OL to apply some intelligence when rendering vector features when zoomed in, it shouldn't be even considering rendering features that are hundreds of miles away from the current bounds, this is triggering retrieval of images from either the local file system or the server when I the zoom level switches from a generic icon to a more detailed device specific image.

In total I have about 5000 features, this should be a trivial amount. I've worked around this by handling move/zoom events and mapping my features in and out of the layers using a quad tree from the bespoke library I wrote years ago and want to move away from. This is an ugly hack that I find it hard to believe that that there is not a more elegant way to handle, I'd expect to provide the map with my vectors and let it manage them.

marked as duplicate by underdark Jul 11 '15 at 21:26

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.


I would initially look at optimizing the layer at the server level. Here are some options to consider (if your data is coming from GeoServer/PostGIS table):

  • Use "Per-Request Feature Limit" option (in GeoServer web) to limit number of features that will draw
  • Define a spatial index on the table (PostGIS table)

WFS is not so suitable for on-the-fly visualisation - it does not handle scale/zoom. To improve client-side vector display performance, it should be ensured that (1) only the features in the view are loaded and rendered and (2) the features displayed are properly simplified and aggregated according to each zoom level.

To solve 1, spatial indexing is a solution. For layers of large and complex objects, vector tiling is a more suitable option.

To solve 2, the data format should be thin to ensure fast transfer time through the web and also fast parsing by the client (prefer for example GeoJSON over the terrible GML). Additionally, you should use generalisation techniques on the server side to simplify/aggregate the data for each zoom layer. Simplified geometries are really faster to transfer and render.


If you are referencing a file, no matter how it is indexed or what format it is in, it will still be downloading and including features not in your view port. What is needed in this case is to use map server software. A tile server was suggested above but a tile server usually sits between a map server and the user. Try implementing something like mapserver, mapnik, or geoserver. A SO thread that chats about them: Mapnik, Mapserver or Geoserver

How a system like this works is:

1-from your front end, seamless in openlayers, a request is made to the server for a layer with the appropriate geospatial bounds.

2-the server software interprets the request and grabs the relevant file or queries the appropriate database table to gather the data that "fits" into your current view port

3-the map server makes sure the format is correct (png, kml, etc. ) and streams it to the browser

4-your openlayers functionality will take care of the rendering. of course, you will need to code a bit to make sure your styling etc is what you want.

So, you see, only the data you want is queried for and moved over your web connection...no features, no data! Even if you have a query that essentially selects everything, you can configure the output to have zoom level awareness so, for example, a country level zoom would not deliver side-street data.

If you are map/data heavy and are making web pages, learning how to use a server-side mapping server is totally worth it. It was not that long ago when we had to make our own mapping sever programs...which essentially made web GIS the domain of programmers, not map people. The fact that there are robust, free and feature rich programs out there nowadays to do this for us is incredible!


I would have added this as a comment but since I don't have the reputation I thought I'd put it as an answer. I believe that both simplification and some form of spacial indexing are used in OpenLayers 3 to improve vector performance. It may be worth giving it a try if you are currently using OL2. Source http://www.slideshare.net/mobile/camptocamp/open-layers3

Not the answer you're looking for? Browse other questions tagged or ask your own question.