Skip to main content
SimilarExport ZIP
100%

Hidden classes in JavaScript and Inline Caching

✓ Published0🌍 Public
JJastor11
Last edited Mar 12, 2014
Created on Dec 2, 2025

This example illustrates how the V8 JavaScript engine optimizes object property access through hidden classes and inline caching, using a Person constructor with `firstName` and `lastName` properties. The visualization shows the creation of hidden classes (C0, C1, C2) as objects are initialized, and demonstrates how adding an `age` property changes the class chain. It also depicts assembly-level code snippets showing how V8 replaces a call to the Inline Cache with a direct memory address for a ~20x speed improvement, and explains when deoptimizations occur. The source is a Markdown document from a gist by Jastor11.

AI-generated description

Similar vizzes

Loading thumbnail…

Making Javascript faster

This example presents a markdown document that compiles performance guidelines for JavaScript, sourced from a gist by GerHobbelt and linked to jsPerf benchmarks. The text explains optimization techniques such as using IIFEs over nested functions, avoiding the `arguments` object, and preferring `that` instead of `bind`. It describes the content without a graphical interface, serving as a static textual reference for developers.

GGerHobbelt
64% match
Loading thumbnail…

JavaScript Basics

This example demonstrates fundamental JavaScript syntax and programming concepts through a series of commented-out code snippets, with only the final function call active. The active code defines a `person` function that returns an object with `first` and `last` properties, then logs the result of calling it with `('Jane', 'Doe')` to the console. The rendered output is an empty SVG element, as the example focuses on console-based learning rather than visual output. It serves as a minimal HTML page using raw JavaScript, with no external libraries or frameworks.

HHayden-V
64% match
Loading thumbnail…

JavaScript Basics

This example demonstrates basic JavaScript syntax and concepts using console output. The code defines functions and objects, including a `person` arrow function that returns an object with `first` and `last` properties, and logs the result to the browser console. It also shows commented-out examples of variable declaration with `const` and `let`, loops, and arithmetic operations. The page uses a simple CSS class for styling but no external libraries or data sources.

CCeciliaW888
63% match
Loading thumbnail…

JS Bin

This example demonstrates JavaScript destructuring and template literal syntax, contrasting a concise ES6+ implementation with its transpiled ES5 equivalent. The page’s source code includes a hand-written JavaScript version using `const` and arrow functions, alongside a generated `'use strict'` script that employs `var` and helper functions like `printName` to achieve the same console output. The data being processed is a simple inline object literal with a name and age property. The visualization is purely textual, relying on the browser’s console to show the logged results of both code paths.

AAlsaxian
63% match
Loading thumbnail…

Fork of JavaScript Basics

A minimal HTML page demonstrates JavaScript syntax basics through commented-out examples and a single active function call. The page uses an SVG element and inline script, with all code commented except for a `person` function that creates and logs an object with `first` and `last` properties. The visualization shows the console output of `person('Jane', 'Doe')` using standard JavaScript object literal syntax. The file includes references to CSS and JavaScript, though the actual rendering relies solely on the SVG structure and console logging.

HHayden-V
61% match
Loading thumbnail…

JavaScript Basics

This example presents a minimal HTML page that explores fundamental JavaScript syntax and concepts through commented-out code examples. The visible script defines a `person` arrow function that returns an object with `first` and `last` properties, then logs an instance to the console. An empty SVG element with 960×500 dimensions is rendered on the page, though no data visualization is displayed. The code demonstrates object creation, function definitions, and console logging using plain JavaScript APIs.

DDavid Hojdan
61% match
Loading thumbnail…

JavaScript Fundamentals

This example demonstrates JavaScript fundamentals through a minimal web page that logs a created person object to the browser console. The code walks through variable assignment, function declarations, arrow functions, and object mutation, ultimately using a concise ES6 arrow function with shorthand property names to create and output a person with first and last names. The page contains no visualization or external libraries, relying solely on native JavaScript and the console API to illustrate core programming concepts.

Kkathrynrbernard
61% match
Loading thumbnail…

JS basics

This example demonstrates JavaScript programming fundamentals in a bare-bones HTML page. It showcases variable mutation with `const` objects, arrow functions with implicit and explicit returns, and a `for` loop. The code defines a `person` function using ES6 shorthand and logs results to the console. The visualization itself is static, containing only an empty SVG element, while all activity happens in the browser’s developer console. The page uses plain CSS and JavaScript, with no external libraries.

Mmax-31
61% match