HTML5 Unleashed

In-Memory Canvases

Often, you’ll want to use a second canvas to prepare a complex figure that is to be drawn onto your primary canvas. You can create a canvas that is not part of the DOM, called an in-memory canvas, by using createElement:

var inMemoryCanvas = document.createElement('canvas');

In-memory canvases are one of the most versatile tools for making advanced graphics and effects. In-memory canvases can be used to temporarily save the bitmap of a canvas, to introduce the concept of “layers” that can be modified in any order and composited on the one primary DOM canvas, and to compound drawing operations in order to create figures that would otherwise be impossible to create on a single canvas.

In-memory canvases can aid performance ...