1. Quality
    1. Original Maps
    2. Pink Tiles
  2. Performance
    1. OpenLayers
      1. "empty" layer
      2. Layer extent
      3. Tiles Size
      4. Buffer size around the viewport
    2. TileCache
      1. Image format
      2. Postprocessing
        1. png
        2. jpeg
      3. mod_python
      4. mod_expires
    3. Apache
      1. mod_deflate
    4. UMN Mapserver
      1. Projections
      2. Page weight
    5. Test your website for slow connection speed
    6. Check your page weight
This page contains important information on the hot spots encountered while configuring your OL/MapFish application. Please post your remarks and reflections on the mailing list, so that we can collect best practices rules. It will make it much easier for new comers on OL/Mapfish.

Quality

Original Maps

Use original maps, as far as possible, at their original scale for best maps quality. If you need to resample them, use the right algorithm: nearest (plans), average (aerials), ...

Pink Tiles

To avoid "the pink tile effect" - a tile is requested but not downloaded - increase OpenLayers.IMAGE_RELOAD_ATTEMPTS to 3-5. Default is 2.

Performance

OpenLayers

"empty" layer

If you need to create an empty base layer, use this kind of code: 

map.addLayer(new OpenLayers.Layer("No base layer",{isBaseLayer: true}));

In this example, the user can choose between the aerial map, the city map and an empty background.

Don't use white tiles or a white wms image.

Layer extent

Adjust your layer extent to your data extent for each layer to avoid generating and downloading transparent tiles.

Tiles Size

Determine which tile size is optimal. Default is 256x255px.

Buffer size around the viewport

Adjust the buffer size with an adequate ratio between displayed tiles and tiles downloaded behind the scene. Consider this OpenLayers downloads all tiles from a layer before downloading the next layer if the tiles come from the same domain.

Default value in OpenLayers is buffer:2 which means 2 tiles on each side of the viewport.

TileCache

Image format

Choose an adequate output image format: JPEG, PNG256, PNG24, ... Each image format has it's own advantage/disadvantage. Adjust the compression options. Think at weight, image quality, browser compatibility, etc.

If you're using TileCache, always specify the image format in the configuration file. If you don't, TileCache ask for png images.

Example: 

[basic]
type=WMS
url=http://labs.metacarta.com/wms/vmap0
extension=jpeg

Postprocessing

These commands allow to reduce the size of the images stored in the TileCache.

png

$find -name "*.png" | nice xargs optipng -q

jpeg

$find -name "*.jpeg" | nice xargs jpegoptim --strip-all

mod_python

Run TileCache under mod_python for best performances: 

SetHandler python-program
PythonHandler TileCache.Service 
PythonOption TileCacheConfig /path/to/tilecache.cfg

mod_expires

Set expiration buffer for tiles stored in the browser with mod_expires: 

ExpiresActive on
ExpiresDefault "now plus 1 years"
Header set Cache-Control "public, max-age=31536000"

Apache

mod_deflate

Activate mod_deflate to compress output from your server to be compressed before being sent to the client over the network.

UMN Mapserver

Projections

Use projections inline parameters (http://mapserver.gis.umn.edu/docs/reference/mapfile/projection), especially if Mapserver is acting as a WMS server and isn't behind TileCache (http://trac.osgeo.org/mapserver/ticket/1976).

Page weight

Test your website for slow connection speed

This check allows you to see if there is a major performance problem (slow network connection): limit your connection to a small ADSL default speed, for exemple: $ trickle -s -d 300 firefox

Check your page weight

  • Disconnect network applications (mails, instant client, etc)
  • Clear your browser cache
  • run $ ifconfig eth0
  • note RX bytes 1
  • load the webpage
  • run $ ifconfig eth0
  • note RX bytes 2
  • Page weight = RXB2 - RXB1