Part 06 · Execution · 6.3A

JavaScript và TypeScript: execution labs

Dự đoán trước khi chạy, pin runtime và biến timing/type assumptions thành assertions. Chạy local/staging cô lập, không dùng secret thật.

Evidence rule: ghi runtime/version, expected-vs-actual, command/fixture, deterministic gate và cleanup; không dùng sleep mù để “chờ cho pass”.

Lab A · Event loop ordering

console.log('sync-1'); setTimeout(() => console.log('timer'), 0); Promise.resolve().then(() => console.log('promise')); queueMicrotask(() => console.log('microtask')); console.log('sync-2');
  1. Ghi expected order rồi chạy trên pinned Node và browser.
  2. Thêm nested microtasks/timers và I/O callback; giải thích khác biệt runtime nếu có.
  3. Tạo microtask starvation có bound rồi đo timer delay.

Gate: output có timestamp/runtime, giải thích được checkpoint và không để loop starvation chạy vô hạn.

Lab B · Fetch race và cancellation

let current = 0;
async function search(query) {
  const request = ++current;
  const response = await fetch(`/search?q=${encodeURIComponent(query)}`);
  const data = await response.json();
  if (request !== current) return;
  render(data);
}
  1. Mock query A chậm, B nhanh; chứng minh A overwrite B.
  2. Sửa bằng request identity rồi bằng AbortController.
  3. Abort khi navigation/unmount; assert AbortError không hiển thị như lỗi người dùng.
  4. Test timeout và retry chỉ cho safe operation.

Gate: stale response không render, underlying request được abort/cleanup và test không phụ thuộc sleep.

Lab C · TypeScript runtime boundary

type PaymentResult = {type: 'paid'; transactionId: string} | {type: 'declined'; reason: string};
function parsePayment(value: unknown): PaymentResult {
  // validate object, discriminator and required fields; never `as PaymentResult`
  throw new Error('implement');
}
  1. Validate missing/extra/wrong enum/null/unsafe number payloads.
  2. Dùng exhaustive switch với never.
  3. Compile với strict flags; kiểm tra emitted JavaScript không còn type.
  4. Test backward-compatible field addition và unknown discriminator policy.

Gate: invalid input bị reject ở runtime, type assertion không thay validation và generated artifact tái chạy được.

Lab D · Memory/resource cleanup

  1. Tạo listener/timer/closure giữ large object.
  2. Chụp heap snapshot trước/sau repeated mount/navigation.
  3. Cleanup listener/timer/abort request; chứng minh retained objects giảm.

Gate: retained path biến mất sau cleanup, listener/timer count không tăng qua cycles và không dựa vào gọi GC thủ công.

Deliverables