01 / Guided Decision
Framework Selector
Five questions. Each one narrows the field. The recommendation shows its reasoning -- no black box answers.
02 / Visual Timeline
Rendering Strategy Visualizer
What actually happens in the browser for each strategy. Watch the timeline animate to see when content is visible vs interactive.
Client-Side Rendering
0ms
Server
Network
Browser
0ms500ms1000ms1500ms2000ms
example.com
Blank screen
03 / Performance Comparison
Reactivity Models Side-by-Side
The same component -- a filtered list -- in three different reactivity models. Increase the list size and watch how update cost scales differently.
List items: 100
React
Runtime VDOM Diffing
Update cost ~2ms
Bundle baseline~42KB
ScalingO(tree size)
ModelRe-render tree, diff for changes
Svelte
Compile-time Reactivity
Update cost ~0.5ms
Bundle baseline~2KB + components
ScalingO(changed)
ModelCompiler wires direct updates
Solid
Signals-based Reactivity
Update cost ~0.1ms
Bundle baseline~7KB
ScalingO(1)
ModelSignal updates only subscribers
04 / Constraint Filter
Elimination Bracket
Toggle your constraints. Frameworks that don't fit fade out with a reason why. What remains is your shortlist.
05 / The Real Question
The Org Structure Test
This single question predicts more about framework fit than any benchmark.
"When 10 different developers touch the same codebase over 2 years, what do you want to be true?"
Consistency enforced by the framework
"I want guardrails. The framework should make the wrong thing hard to do."
Flexibility -- we'll define our own conventions
"I want freedom. We'll build the conventions that fit our team."
Frontend Architecture Decision Playground · Companion to the Field Guide