[OpenLayers-Dev] Towards slick panning and animated zooming

[Andreas Hocevar]

Hey fellow developers,

I don't know if you saw the enthusiastic tweets (e.g.
https://twitter.com/19_norte/status/281134258725199875), but
http://ahocevar.github.com/openlayers/mobile-wmts-vienna/examples/mobile-wmts-vienna.html
shows the improvements in tile rendering we can get with four pull
requests. All these pull requests have been thoroughly tested, and are
the result of client work at OpenGeo. To bring these improvements into
master, I am asking for reviews:

http://github.com/openlayers/openlayers/pull/702
New tile image cache and tile queue improvements. This pull request
gets rid of the current tile queue, which I know many people were
unhappy with. It adds a new TileManager class, which delays tile
loading for panning (replacement for previous tileLoadingDelay in
Layer.Grid) and zooming to avoid unnecessary tile image requests. It
also keeps references to image elements, so they can be reused when
the user pans or zooms back to regions or zoom levels that were
already visited.

http://github.com/openlayers/openlayers/pull/800
Use translate3d to enable GPU support where available. This introduces
an applyTransform method on the map, which will use an appropriate
positioning method for the layerContainerDiv. Without any transform3d
styles on the layerContainerDiv, style.left and style.top will be used
just like we currently do, and scale transforms will be used for
scaling. But with a translate3d style on the layerContainerDiv, all
positioning is made with translate3d, and scaling is done with
scale3d. By doing so, the GPU kicks in and brings greatly improved
dragging and pinch-zooming performance.

http://github.com/openlayers/openlayers/pull/503
Animated zooming. This depends on #800, and I will rebase it when #800
is in. For now, it is best to look at the three commits mentioned in
https://github.com/openlayers/openlayers/pull/503#issuecomment-11495176.
This change includes some improvements to the MouseWheel handler, and
better mousewheel defaults for the Navigation control, to allow for
usable and predictable wheel zooming on touch pads.

http://github.com/openlayers/openlayers/pull/803
Tween: skip frames when minimum frame rate is not reached. We use
requestAnimationFrame for tween already, but we have no control over
the frame rate. This change introduces a new minFrameRate option. When
set, frames will be skipped if the animation gets too slow. The effect
of this can best be seen when zooming with #503 applied in Firefox:
instead of the 20 frames (which work fine in Chrome), about half of
the frames will be skipped because Firefox can not scale the
layerContainer fast enough. The visual effect of animated zooming
still works fine, and users do not have to wait too long for the zoom
to finish.

Thanks for any reviews! With these changes in, the visual appearance
and performance of OpenLayers will be on par with Leaflet.
Andreas.

--
Andreas Hocevar
OpenGeo - http://opengeo.org/
Expert service straight from the developers.