Comparison / Choose a boundary

Choose the mechanism for the failure.

TypeScript checks the program before it runs. A runtime validator checks the data that actually arrives. This lab uses both, then protects the workflow and asynchronous results separately.

This comparison separates the implementation pattern from the environment used to explore it. A general playground is useful for editing freely; this lab adds a fixed failure, a readable execution trace and a direct path from the result to its source.

Where each choice fits

Approach	Useful when	Tradeoff	Connection to this lab
TypeScript assertion	An invariant has already been established elsewhere.	Adds no runtime data validation.	The broken price example shows the consequence of trusting it too early.
Hand-written validator	A small, inspectable contract with a few fields.	You maintain every edge case and error message.	Used here to make the actual checks easy to follow.
Shared schema or generated API types	Many endpoints or consumers must agree on a contract.	Generated static types still need a trustworthy runtime boundary.	Extend this lab by generating types and validating the received payload.
Official TypeScript Playground	Explore compiler behavior, type relationships and emitted JavaScript.	A focused type experiment asks a different question from a complete UI workflow.	Use it beside this lab to isolate the branded-ID or conditional-type example.
StackBlitz	Edit and run a larger frontend or Node project in an online development environment.	A general IDE leaves the learning path and failure scenario to the author.	This lab supplies predetermined failures, plain-language traces and a matching source package.

Compare the same input

Choose one scenario and predict the outcome.
Run it without safeguards and retain the visible result.
Change only the implementation, then run again.
Inspect the source responsible for the difference.
Name the guarantee that changed and the guarantee that remains outside the experiment.

The React application runs real compiled TypeScript against three invented sample responses. It makes no customer API calls. The public controls choose reviewed examples; they do not execute visitor-supplied code.

Run the comparison