HTML and CSS Reference
an Object “template” or a specific underlying native implementation of the Object. However, in the general case, the
engine may need to hash strings, perform hash-table lookups, and traverse prototype hierarchies and scopes in order
to find a given piece of stored data.
Garbage collection has traditionally been a source of “long” (up to several hundred milliseconds) pauses
freezing execution and traversing all active objects on the heap. The evolution of solutions to this problem provides
introduced solutions at different times in their development history, but as of today garbage collection is much less
of an issue in modern browsers.
However, make sure that it has minimal impact on older browsers and browsers running to on low-end
platforms, it is generally advisable to keep total Object count as low as possible and to minimize the number of
temporary Objects being dynamically created at runtime.
As you shall see, Object count has a pronounced effect on memory usage and as a general rule, structures that
use fewer Objects to store the same amount of data are likely to result in more efficient code execution. This principle,
along with an understanding of how data is stored and accessed for some common object types, is fundamental to
designing data structures that support optimal execution across various HTML5 implementations.
The process of flattening data structures can be a very effective way of reducing object count, and thereby memory
overhead and the cost of looking up data. “Flattening” here involves replacing hierarchies or subhierarchies of objects
with single Objects or Arrays. For example, consider the object structure in Listing 4-1.
Listing 4-1. A Naïve Particle Structure
An immediate gain in memory efficiency (and runtime performance) can be achieved by flattening this structure,
as shown in Listing 4-2.