Derived state — compute during render, not in effect

What does this output?

// Anti-pattern: derived state stored redundantly
let items = ['a', 'b', 'c'];
let count = 0; // duplicated derived state

// Every time items changes, you'd need to sync count with useEffect
// But count is always derivable — just compute it

// Correct: derive during render
function render(items) {
  const count = items.length;   // derived, not stored
  const isEmpty = count === 0;  // also derived
  return { count, isEmpty };
}

const view = render(items);
console.log(view.count);
console.log(view.isEmpty);

items = [];
const view2 = render(items);
console.log(view2.count);
console.log(view2.isEmpty);

Correct Output

3
false
0
true

Why this output?