Framing Buffer Tile Scrolling Algorithm

From GPWiki

For a discussion of basic tile scrolling techniques, please refer to this Smooth Scrolling Tiles tutorial (Visual Basic). The tutorial below assumes a basic knowledge of tiling methodology.

When coding a tile based game, the efficiency of your tiling algorithm can have a great effect on your frame rate. As a general rule of thumb, the fewer the blits, the better. One large blit is preferable to many small blits. For this reason, it is wise to employ an algorithm which renders the scene to special buffers which are semi-permanent.

For example: Imagine your tiled scene is stationary. Using this technique, the tiles that make up the scene are rendered once to a single buffer, which I will call the Main Surface. The Main Surface is then used to update the backbuffer each frame. This results in one blit per frame, and very fast performance! The only downside to this technique is memory usage. The Main Surface will take up as much video memory as the backbuffer itself, though most modern video cards can accomodate this easily.

Things get a little trickier when your scene is scrolling, however. The Main Surface is no longer sufficient for rendering the scene on its own. Enter the framing buffers:

As you can see in the figure above, the Main Surface is surrounded on all sides by framing buffers. Framing buffers are tile strips which represent the portion of the map just outside of the current view. These buffers are rendered in preparation for scene scrolling, and are called into play when the scene is required to shift. The following three figures depict the usage of the Main Surface and the Top Buffer if the scene were (for example) scrolled upward:

As the view area moves up, the Main Surface will be blitted to the backbuffer in a slightly lower position on each successive frame. The Top Buffer fills the void above, and is also blitted to the backbuffer in successively lower positions. This gives the illusion of movement toward the Top Buffer.

When the scroll is complete, and the Top Buffer is entirely in view, all of the framing buffers and the Main Surface must be re-rendered from constituent tiles, giving us the new scene:

As shown in the figure above, the buffers and the Main Surface have been re-created, rendered with all tiles shifted down one tile height. The scroll process could now start all over again, using the framing buffer appropriate for the direction of the motion, when the scene is next required to move.

An implementation of this technique can be found in this RPG Demo source code (Visual Basic).

It is a good idea to re-use parts of the main surface. This can easily be done by using Source rectangles. If you have to reblit every tile on the main surface and the buffer surfaces, then it'll take some time. However, blitting only those tiles that need to be refreshed increases the FPS about 30% (percentage depends on PC specs, the amount of tiles & dimension of the tiles).