feat: complete media player playground example

[SandroMaglione]

Summary

• turn the media player starter into a complete browser integration backed by a parallel, compound statechart
• model browser work as state-scoped Effect invocations and register the audio element through the shared React adapter runtime
• project typed transport and settings snapshots into one React-facing view atom with exhaustive path matching
• keep MachineTest.run service-free for machines with invoked effects, matching the pure planning APIs it executes
• add playback controls, live loudness visualization, machine-state inspection, responsive styling, tests, and updated documentation

Root cause

The original implementation used the removed Machine.action API, evaluated HTMLAudioElement while loading tests in Node, and retained placeholder tests for the old state/event topology. MachineTest.run also leaked invoke and internal runtime services in its public Effect requirement despite executing only pure planning.

Changeset

• Added or updated for a library or package-metadata change
• Not required because this PR does not change src/ or package.json

Added .changeset/clean-scenarios-plan.md for the MachineTest.run service-inference fix.

Validation

• pnpm check
• pnpm check in examples/playground
• Reviewed the automated type-performance report, when the public TypeScript API or inference changed

pnpm perf:types passes within every configured instantiation budget.

[github-actions]

Type performance

Measured with TypeScript 6.0.3 and skipLibCheck=true.

Scenario	Base	PR	Difference
Effect only	55	55	0 (0.0%)
Import effect-machine	55	55	0 (0.0%)
Machine.defineStates (3 states)	2,965	2,965	0 (0.0%)
Machine.make (3 states, 2 events)	8,715	8,715	0 (0.0%)
machine.handle (3 states, 2 transitions)	23,492	23,492	0 (0.0%)
machine.handle (depth 8)	117,075	117,075	0 (0.0%)
machine.handle (depth 12)	129,713	129,713	0 (0.0%)
machine.handle (depth 16)	145,055	145,055	0 (0.0%)
machine.handle (depth 24)	183,851	183,851	0 (0.0%)
machine.handle (wide depth 16)	214,189	214,189	0 (0.0%)
machine.handle (parallel/history/choice)	132,667	132,667	0 (0.0%)
machine.handle (4 successive calls)	128,674	128,674	0 (0.0%)
machine exact input/output/error/services	110,584	110,584	0 (0.0%)
execution adapter readiness	127,854	127,854	0 (0.0%)

Marginal instantiations are measured against the matching setup without that API call:

Scenario	Base	PR	Difference
Import effect-machine	0	0	0
Machine.defineStates (3 states)	2,910	2,910	0 (0.0%)
Machine.make (3 states, 2 events)	5,742	5,742	0 (0.0%)
machine.handle (3 states, 2 transitions)	14,777	14,777	0 (0.0%)
machine.handle (depth 8)	109,601	109,601	0 (0.0%)
machine.handle (depth 12)	121,039	121,039	0 (0.0%)
machine.handle (depth 16)	135,181	135,181	0 (0.0%)
machine.handle (depth 24)	171,577	171,577	0 (0.0%)
machine.handle (wide depth 16)	202,224	202,224	0 (0.0%)
machine.handle (parallel/history/choice)	114,331	114,331	0 (0.0%)
machine.handle (4 successive calls)	113,703	113,703	0 (0.0%)
machine exact input/output/error/services	100,670	100,670	0 (0.0%)
execution adapter readiness	102,092	102,092	0 (0.0%)

Check times (informational)

Scenario	Base	PR
Effect only	0.03s	0.03s
Import effect-machine	0.03s	0.03s
Machine.defineStates (3 states)	0.11s	0.09s
Machine.make (3 states, 2 events)	0.15s	0.15s
machine.handle (3 states, 2 transitions)	0.21s	0.21s
machine.handle (depth 8)	0.49s	0.49s
machine.handle (depth 12)	0.53s	0.53s
machine.handle (depth 16)	0.59s	0.58s
machine.handle (depth 24)	0.63s	0.65s
machine.handle (wide depth 16)	0.70s	0.70s
machine.handle (parallel/history/choice)	0.59s	0.59s
machine.handle (4 successive calls)	0.55s	0.55s
machine exact input/output/error/services	0.48s	0.48s
execution adapter readiness	0.54s	0.55s

Type instantiations are the comparison metric. Check time varies with runner load and is informational only.

[github-actions]

Runtime performance

Median of 5 independent benchmark processes on INTEL(R) XEON(R) PLATINUM 8573C with Node v24.18.0.

Pull request baseline

Scenario	Effect Machine	XState 5	XState 6 alpha
Plan counter transitions	148,850 transitions/s	143,443 transitions/s	16,651 transitions/s
Drain burst with terminal fence	622,829 increments/s	413,120 increments/s	181,788 increments/s
Drain burst with a change observer	576,617 increments/s	414,653 increments/s	180,747 increments/s
Lookup and send to one child	501,618 increments/s	415,384 increments/s	177,277 increments/s
Start and stop a machine	202,593 machines/s	201,450 machines/s	158,053 machines/s
Start and stop a parent with one child	52,944 families/s	77,280 families/s	52,681 families/s
Plan transitions through a compound state	132,463 transitions/s	—	—
Plan transitions through parallel regions	103,000 transitions/s	—	—
Drain burst through a compound state	551,874 events/s	367,046 events/s	179,107 events/s
Drain burst through two parallel regions	510,752 events/s	282,576 events/s	147,150 events/s
Drain a compound-state burst with a change observer	516,456 events/s	—	—

Effect runtime reference points

Scenario	Effect Machine	Effect runtime primitives
Start and stop a raw generic process	31,829 processes/s	—
Start and stop a raw compiled process	83,717 processes/s	—
Start and interrupt a suspended fiber	—	187,301 fibers/s
Start and stop a queue worker	—	136,091 workers/s
Start and stop an actor shell	—	124,502 actors/s
Start and stop two actor shells	—	73,249 families/s
Update an owner-only mutable snapshot	—	292,740,047 updates/s
Update a synchronized snapshot	—	1,617,403 updates/s
Create, resolve, and await a terminal latch	—	1,643,904 latches/s

Memory profile	Effect Machine	XState 5	XState 6 alpha	Effect runtime primitives
Idle machine	1.5 KiB	3.8 KiB	2.2 KiB	—
Raw generic managed process	12.1 KiB	—	—	—
Raw compiled process	2.6 KiB	—	—	—
Two independent idle machines	2.9 KiB	7.3 KiB	3.9 KiB	—
Idle parent with one child	4.8 KiB	5.5 KiB	4.0 KiB	—
Parent with observed child registry	9.0 KiB	—	—	—
Parent with observed invoked child snapshots	5.0 KiB	—	—	—
Suspended Effect fiber	—	—	—	0.6 KiB
Effect queue with waiting fiber	—	—	—	2.8 KiB
Effect mailbox actor shell	—	—	—	3.2 KiB
Two Effect actor shells	—	—	—	6.8 KiB

Effect Machine change from base

Metric	Base	Base variability	PR	PR variability	Difference
Plan counter transitions	142,569 transitions/s	1.0% MAD	148,850 transitions/s	0.9% MAD	+4.4%
Drain burst with terminal fence	613,149 increments/s	1.1% MAD	622,829 increments/s	1.1% MAD	+1.6%
Drain burst with a change observer	569,505 increments/s	1.1% MAD	576,617 increments/s	1.6% MAD	+1.2%
Lookup and send to one child	505,518 increments/s	0.3% MAD	501,618 increments/s	0.4% MAD	-0.8%
Start and stop a machine	203,046 machines/s	0.9% MAD	202,593 machines/s	0.8% MAD	-0.2%
Start and stop a parent with one child	54,472 families/s	5.5% MAD	52,944 families/s	1.4% MAD	-2.8%
Plan transitions through a compound state	133,172 transitions/s	2.3% MAD	132,463 transitions/s	0.4% MAD	-0.5%
Plan transitions through parallel regions	104,657 transitions/s	0.4% MAD	103,000 transitions/s	0.4% MAD	-1.6%
Drain burst through a compound state	579,233 events/s	1.8% MAD	551,874 events/s	3.6% MAD	-4.7%
Drain burst through two parallel regions	546,089 events/s	1.9% MAD	510,752 events/s	0.5% MAD	-6.5%
Drain a compound-state burst with a change observer	537,340 events/s	0.4% MAD	516,456 events/s	3.1% MAD	-3.9%
Idle machine heap per unit	1.5 KiB	0.3% MAD	1.5 KiB	0.1% MAD	-0.1%
Raw generic managed process heap per unit	12.1 KiB	0.0% MAD	12.1 KiB	0.0% MAD	-0.0%
Raw compiled process heap per unit	2.6 KiB	0.1% MAD	2.6 KiB	0.3% MAD	-0.3%
Two independent idle machines heap per unit	2.9 KiB	0.0% MAD	2.9 KiB	0.0% MAD	0.0%
Idle parent with one child heap per unit	4.8 KiB	0.0% MAD	4.8 KiB	0.0% MAD	+0.0%
Parent with observed child registry heap per unit	9.0 KiB	0.0% MAD	9.0 KiB	0.0% MAD	+0.0%
Parent with observed invoked child snapshots heap per unit	5.0 KiB	0.1% MAD	5.0 KiB	0.1% MAD	+0.1%

Effect runtime reference change from base

Metric	Base	Base variability	PR	PR variability	Difference
Start and stop a raw generic process	31,743 processes/s	0.6% MAD	31,829 processes/s	1.1% MAD	+0.3%
Start and stop a raw compiled process	83,984 processes/s	1.1% MAD	83,717 processes/s	1.3% MAD	-0.3%
Start and interrupt a suspended fiber	187,441 fibers/s	0.2% MAD	187,301 fibers/s	0.6% MAD	-0.1%
Start and stop a queue worker	137,024 workers/s	0.6% MAD	136,091 workers/s	0.9% MAD	-0.7%
Start and stop an actor shell	126,454 actors/s	0.2% MAD	124,502 actors/s	1.1% MAD	-1.5%
Start and stop two actor shells	78,610 families/s	2.5% MAD	73,249 families/s	0.8% MAD	-6.8%
Update an owner-only mutable snapshot	292,740,047 updates/s	0.0% MAD	292,740,047 updates/s	0.0% MAD	0.0%
Update a synchronized snapshot	1,703,058 updates/s	3.0% MAD	1,617,403 updates/s	2.1% MAD	-5.0%
Create, resolve, and await a terminal latch	1,647,134 latches/s	1.1% MAD	1,643,904 latches/s	0.1% MAD	-0.2%

Versions and interpretation

• Effect Machine: 0.3.0
• XState 5: 5.32.5
• XState 6 alpha: 6.0.0-alpha.31
• Effect runtime primitives: 4.0.0-beta.107

Higher throughput is better; lower heap is better. Variability is the median absolute deviation across independent processes, relative to their median. Runtime measurements on shared GitHub-hosted hardware remain informational, so small differences should be confirmed across multiple workflow runs.