Memory Engine

See how JavaScript manages memory — references, object lifecycles, garbage collection, and circular structures made visible.

Reference Tracking

Watch references appear, move, and vanish over time.

let user = { name: "Alice" };  // ref created
let admin = user;              // second ref to same object
user = null;                   // ref removed
admin.name = "Bob";            // mutate via remaining ref
admin = null;                  // last ref removed → GC

Live References

No objects in heap

Reference Timeline

Run the demo to see reference flow

0 active0 removed

Object Lifecycle

Creation → Mutation → Reference changes → Destruction.

let car = { brand: "Tesla", year: 2024 };
car.color = "red";          // mutation: add property
car.year = 2025;            // mutation: change property
let old = car;              // new reference
car = { brand: "BMW" };     // car points to new object
old = null;                 // last ref to Tesla removed → GC

Heap Objects

No objects yet

Lifecycle Timeline

Events will appear here

Garbage Collection

Mark reachable objects, sweep the rest. Even circular refs get collected.

let a = { name: "A" };
let b = { name: "B", friend: a };
let c = { name: "C", friend: b };
a.friend = c;  // circular: A→C→B→A

// Remove root references:
a = null;
b = null;
// c still holds everything reachable
c = null;  // now all are unreachable → GC collects

Setup

Mark

Sweep

Done

Object Graph

Heap is empty

GC Log

waiting...

Circular References

Explore reference loops and see how cycles form in the object graph.

let obj = {};
obj.self = obj;  // obj → obj

Reachability Graph

↺ .self

objin cycle

Detection Trace

Click "Detect Cycles" to trace

In cycleNot in cycle

Memory Diff Engine

Compare snapshots to see exactly what changed in memory.

let x = 10;

Step 1: Create x

Variables

empty

Heap

empty

Changes

+var.x

+1 added~0 changed-0 removed

Current

Variables

x10

Heap

empty