I needed to display raster image tiles served from GeoServer on my OpenLayers 6 map. Using TileWMS(), this was working fine, but was a little slow, so I wanted to start using GeoWebCache from the server. I opted to continue using WMS (I need to use getFeatureInfo() so WMTS() wouldn't work). This alone didn't seem to speed anything up, and I saw a recomendation somewhere to set the map pixelRatio: 1. This allowed for a significant speed increase. Tiles load immediately (was taking about 3 seconds per layer before), but now the map seems blurry. This is very apparent on point and label features on the map, but it could be happening on other features and layers.

The tile layers are merged into a layerGroup comprised of Google street layer (OMS) and 5 WMS layers served from Geoserver.

How can I get similar performance increases while maintaining the clarity on the map?

Relevant code:

this.map = new Map({
      target: 'map',
      layers: [
      pixelRatio: 1,
      overlays: [this.somePopup],
      view: new View({
        center: olProj.fromLonLat([-86, 38]),
        zoom: 5
var layer = new TileLayer({
        name: 'tile-layer',
        className: 'tile-layer',
        extent: [-13884991, 2870341, -7455066, 6338219],
        source: new TileWMS({
          url: 'https://geoserver.url.com/geoserver/some_workspace/wms',
          params: {'LAYERS': 'some_workspace:some_layer', 'TILED': true, 'WIDTH': 256, 'HEIGHT': 256, 'SRS': 'EPSG:3857'},
          serverType: 'geoserver',
          projection: 'EPSG:3857',
          transition: 0,


enter image description here

Update: I have discovered that when 'pixelRatio' is not set to 1, I am not hitting GWC, which explains the slowness. Referencing this post.

  • Please use the edit button to update your question, with the code you are using. Also GetFeatureInfo works fine on WMTS layers.
    – Ian Turton
    Dec 18, 2020 at 14:15
  • @IanTurton WMTS was throwing errors when I tried to query the layer for value at coordinate in the tiff. Nevertheless, I have direct integration enabled in geoserver and caching appears to be working with WMS. Also, see updated description with relevant code.
    – Baker
    Dec 18, 2020 at 14:24
  • You could try using imageSmoothing: false in the TileWMS source options which should result in pixellation instead of blurring.
    – Mike
    Dec 18, 2020 at 16:16
  • @Mike Thanks for the recommendation, however, I'm trying to actually make tile rendering more performant.
    – Baker
    Dec 18, 2020 at 16:21
  • 1
    @Baker Both the WMS and view use a standard EPSG:3857 grid. However, if the pixelRatio is 2 512px tiles will be requested instead of 256px. If the cache only supports one size the pixel ratio must be fixed to match. If the pixel ratio is lower than that supported by the device (as the OSM base layer in both screenshots) the image will be smoothed (causing blurring) or pixelated if smoothing is disabled.
    – Mike
    Dec 18, 2020 at 22:52


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.