Event Loop and Source Panels

Task Result Slots

Store two task results in separate variables before summarizing them.

task-result-slots Separate result slots make it clear which task produced each value. This is the single-thread JavaScript form of the replay composition model.

Task Result Slots

seed
task_result_slots.js
Replay: real traced execution (multi-file project)
const seed = 5;
let readResult = 0;
let writeResult = 0;

function readTask(value) {
  readResult = value + 10;
}

function writeTask(value) {
  writeResult = value * 3;
}

readTask(seed);
writeTask(seed);

const total = readResult + writeResult;
console.log("read=" + readResult);
console.log("write=" + writeResult);
console.log("total=" + total);

const seed = 2;
let readResult = 0;
let writeResult = 0;

function readTask(value) {
  readResult = value + 10;
}

function writeTask(value) {
  writeResult = value * 3;
}

readTask(seed);
writeTask(seed);

const total = readResult + writeResult;
console.log("read=" + readResult);
console.log("write=" + writeResult);
console.log("total=" + total);

const seed = 8;
let readResult = 0;
let writeResult = 0;

function readTask(value) {
  readResult = value + 10;
}

function writeTask(value) {
  writeResult = value * 3;
}

readTask(seed);
writeTask(seed);

const total = readResult + writeResult;
console.log("read=" + readResult);
console.log("write=" + writeResult);
console.log("total=" + total);

  1. seed ← 5, readResult ← 0, writeResult ← 0

    1const seed→ 5 = 5; //@seed=2, 82let readResult→ 0 = 0;3let writeResult→ 0 = 0;45function readTask(value) {6  readResult = value + 10;7}89function writeTask(value) {10  writeResult = value * 3;11}1213readTask(seed5);14writeTask(seed);

  2. readResult ← 15, value ← 5

    2let readResult = 0;3let writeResult = 0;45function readTask(value5) {6  readResult = value→ 5 + 10;7}
    values this step15readResult

  3. readTask(seed);

    10  writeResult = value * 3;11}1213readTask(seed5);14writeTask(seed5);

  4. writeResult ← 15, value ← 5

    6  readResult = value + 10;7}89function writeTask(value5) {10  writeResult = value→ 5 * 3;11}
    values this step15writeResult

  5. total ← 30, readResult ← 15

    13readTask(seed);14writeTask(seed5);1516const total→ 30 = readResult→ 15 + writeResult15;17console.log("read=" + readResult15);18console.log("write=" + writeResult15);19console.log("total=" + total30);
    outputread=15
write=15
total=30

  1. seed ← 2, readResult ← 0, writeResult ← 0

    1const seed→ 2 = 2;2let readResult→ 0 = 0;3let writeResult→ 0 = 0;45function readTask(value) {6  readResult = value + 10;7}89function writeTask(value) {10  writeResult = value * 3;11}1213readTask(seed2);14writeTask(seed);

  2. readResult ← 12, value ← 2

    2let readResult = 0;3let writeResult = 0;45function readTask(value2) {6  readResult = value→ 2 + 10;7}
    values this step12readResult

  3. readTask(seed);

    10  writeResult = value * 3;11}1213readTask(seed2);14writeTask(seed2);

  4. writeResult ← 6, value ← 2

    6  readResult = value + 10;7}89function writeTask(value2) {10  writeResult = value→ 2 * 3;11}
    values this step6writeResult

  5. total ← 18, readResult ← 12

    13readTask(seed);14writeTask(seed2);1516const total→ 18 = readResult→ 12 + writeResult6;17console.log("read=" + readResult12);18console.log("write=" + writeResult6);19console.log("total=" + total18);
    outputread=12
write=6
total=18

  1. seed ← 8, readResult ← 0, writeResult ← 0

    1const seed→ 8 = 8;2let readResult→ 0 = 0;3let writeResult→ 0 = 0;45function readTask(value) {6  readResult = value + 10;7}89function writeTask(value) {10  writeResult = value * 3;11}1213readTask(seed8);14writeTask(seed);

  2. readResult ← 18, value ← 8

    2let readResult = 0;3let writeResult = 0;45function readTask(value8) {6  readResult = value→ 8 + 10;7}
    values this step18readResult

  3. readTask(seed);

    10  writeResult = value * 3;11}1213readTask(seed8);14writeTask(seed8);

  4. writeResult ← 24, value ← 8

    6  readResult = value + 10;7}89function writeTask(value8) {10  writeResult = value→ 8 * 3;11}
    values this step24writeResult

  5. total ← 42, readResult ← 18

    13readTask(seed);14writeTask(seed8);1516const total→ 42 = readResult→ 18 + writeResult24;17console.log("read=" + readResult18);18console.log("write=" + writeResult24);19console.log("total=" + total42);
    outputread=18
write=24
total=42