Hidden Classes and Inline Caching are two fundamental optimization techniques used by JavaScript engines like V8 to dramatically speed up object property access.
JavaScript is a dynamically-typed language, which means object structures can change at runtime by adding or deleting properties. This flexibility poses a performance challenge because, in a naive implementation, the engine would need to perform expensive dictionary lookups every time a property is accessed. Hidden Classes and Inline Caching work together to solve this problem, making property access nearly as fast as in statically-typed languages.
A Hidden Class is an internal meta-object that V8 (and other engines) creates to describe the 'shape' or structure of a JavaScript object, such as which properties it has and their memory offsets .
Objects with the exact same properties in the same order will share a single Hidden Class, which saves memory and allows for optimized property lookups .
When a property is added to an object, the engine doesn't modify its existing Hidden Class. Instead, it creates a new one through a process called 'transition,' forming a transition tree that tracks the object's evolution .
Because the order of property addition matters, two objects that end up with the same properties but added in a different order will have different Hidden Classes, preventing them from being optimized together .
While Hidden Classes provide a fast way to locate a property, the engine still needs to find the correct Hidden Class first. This is where Inline Caching (IC) comes in. IC is a technique where the engine caches the result of a successful property lookup at the same location for future use .
When a function that accesses a property (like
o.x) is executed for the first time, the engine performs a full lookup. It notes the Hidden Class of the object and the offset where the property's value was found .This information is cached right at the instruction site. The next time the same line of code runs, the engine first checks if the incoming object has the same Hidden Class .
If the Hidden Class matches (a 'cache hit'), the engine skips the expensive lookup and directly accesses the value at the remembered memory offset. This is what makes subsequent calls so fast .
The IC goes through several states: starting as 'uninitialized', then becoming 'monomorphic' (one shape cached), 'polymorphic' (a few shapes cached), and finally 'megamorphic' (many shapes, requiring a global lookup) .
These two concepts are deeply interconnected. Inline Caching depends entirely on Hidden Classes to quickly verify if an object is the same as the one it has seen before . For developers, the key takeaway is that writing 'monomorphic' code (consistently using objects with the same shape) allows Inline Caching to remain in its fastest state, leading to significant performance gains, especially in hot code paths .