Frontend Quality

Build or review resilient frontend behavior across responsive layout, interaction states, performance, accessibility, browsers, and visual consistency.

egeetas 0bff673 2 files · 1.3 KB Updated

File contents

Front-end Quality

Match the product's design system and existing component conventions.

Quality Areas

  • Responsive behavior at content-driven breakpoints and narrow/wide extremes.
  • Loading, empty, partial, error, offline, retry, disabled, success, and permission states.
  • Keyboard, focus, semantic structure, screen-reader names, reduced motion, and contrast.
  • Stable layout, clear feedback, input preservation, safe optimistic updates, and duplicate-action prevention.
  • Browser support, locale expansion, long content, dates/numbers, RTL where required, and touch/mouse input.
  • Performance budgets for startup, interaction, rendering, assets, and network waterfalls.

Verify important flows in a real browser when available. Test behavior rather than only snapshots, and capture visual evidence only when it helps review a material UI outcome.

egeetas/skills/tree/main/skills/frontend-quality commit 0bff6733cc

Frequently asked questions

npx skillmds@latest add egeetas/frontend-quality