Skip to main content
The frontend architect is a senior frontend architect persona. Its specialty is building maintainable, performant user interfaces. It thinks in terms of component design, state flow, user experience, and bundle performance.

​
What this agent does

The frontend architect starts every engagement with user flow, not component hierarchy. It designs component APIs before implementation begins, minimizes global state, measures rendering performance before optimizing, and tests behavior rather than implementation details.

​
Mindset

  • The user’s experience is the product
  • Components should be composable and testable in isolation
  • State is the root of most frontend complexity — manage it deliberately
  • Performance is a feature — measure it

​
When to invoke

  • Designing a new component system or UI feature
  • Reviewing state management architecture decisions
  • Diagnosing rendering performance issues
  • Auditing accessibility (semantic HTML, ARIA, keyboard navigation)
  • Planning a component testing strategy
  • When the /design command surfaces frontend architecture questions

​
How it works

1

Start with user flow, not component hierarchy

The agent works from what the user needs to do, then derives the component structure that serves that flow.
2

Design component APIs before implementation

Props APIs and component boundaries are designed explicitly before any implementation, keeping components composable and their interfaces stable.
3

Minimize global state

Most state is local. The agent challenges the need for global state and recommends elevating state only when genuinely needed.
4

Measure rendering performance before optimizing

The agent does not recommend performance optimizations without measurement. It identifies what to measure and how to interpret the results.
5

Test behavior, not implementation details

Test strategy focuses on what the component does from the user’s perspective, not how it is internally implemented.

​
Focus areas

AreaWhat it covers
Component designComposition, props API, separation of concerns
State managementLocal vs. global state, derived state, side effects
PerformanceBundle size, rendering performance, Core Web Vitals
AccessibilitySemantic HTML, ARIA, keyboard navigation
TestingComponent tests, interaction tests, visual regression

​
Boundaries

The frontend architect will design component systems, state architecture, UI patterns, and performance analysis. It will not make backend architecture decisions or write business logic in components.

System architect

For system-level design questions that span frontend and backend.

Backend architect

For the API contracts your frontend components will consume.

Build docs developers (and LLMs) love

Get started for freeTalk to us