Immer-like draft proxies

Q: Immer-like draft proxies

**Target Audience:** Engineers preparing for practical JavaScript coding interviews. **Difficulty:** Hard > **How to read this doc:** this doc own first implementation attempt was caught FAILING the real structural-sharing requirement during verification — it deep-cloned every nested object regardless of whether it changed, satisfying deep EQUALITY but not reference IDENTITY. The corrected version below was then verified to genuinely return the SAME object reference for every untouched field, at every level. ## 1. The problem, restated `produce(base, recipe)` lets a `recipe` function mutate a "draft" object using ordinary, natural-looking assignment syntax (`draft.count = 2`), while genuinely producing a NEW result object where: (1) the original `base` is never mutated, and (2) any part of the structure the recipe never touched is the EXACT SAME object reference in the result as in the original — true structural sharing, not merely equal-looking copies. ## 2. Clarifying questions a

The problem

Problem, as an interviewer would state it: "Implement a simplified produce(base, recipe) — like Immer — letting the recipe mutate a 'draft' object naturally, while producing a genuinely NEW immutable result with STRUCTURAL SHARING: unchanged nested parts of the object must be the EXACT SAME reference as the original, not just equal-looking copies."

Examples:

Code

const result = produce(base, draft => { draft.count = 2; });
result.user === base.user; // true -- untouched, structurally shared
result.count === 2 && base.count === 1; // true -- original unmutated

Clarifying questions expected:

Does "structural sharing" specifically mean REFERENCE equality for untouched parts, not just deep equality?
If a deeply nested field changes, do all its ANCESTOR objects on the path to it also need new references?
Should this handle arrays the same way as plain objects?

Code / implementation expected: Yes — real, direct proof that an untouched nested field returns the EXACT SAME reference as the original, while a genuinely modified field (and its ancestors) get new references — this was caught failing on a first attempt and fixed.

js-coding
utility
algorithm

Try it yourself

Sketch your approach before you read the solution. That is what the interview tests.

Stuck? Get a hint.

A short nudge toward the approach. It will not give the answer away.

Solution

Target Audience: Engineers preparing for practical JavaScript coding interviews. Difficulty: Hard

How to read this doc: this doc own first implementation attempt was caught FAILING the real structural-sharing requirement during verification — it deep-cloned every nested object regardless of whether it changed, satisfying deep EQUALITY but not reference IDENTITY. The corrected version below was then verified to genuinely return the SAME object reference for every untouched field, at every level.

1. The problem, restated

produce(base, recipe) lets a recipe function mutate a "draft" object using ordinary, natural-looking assignment syntax (draft.count = 2), while genuinely producing a NEW result object where: (1) the original base is never mutated, and (2) any part of the structure the recipe never touched is the EXACT SAME object reference in the result as in th

The solution is hidden so you can try first

9 min read · 9 sections

Run the code

Edit the code and run it here. Each console line with an expected value becomes a test.

JavaScriptReal, direct proof: produce() achieves genuine structural sharing — untouched fields, siblings, and nested branches all return the exact same reference