Skip to content

Add repeatable performance benchmarks for list, tree and button stress cases #8714

Open

Description

@mattcosta7

Part of #8676. The P1 render-cost work depends on this.

Problem

The measurements in #8676 came from throwaway Vitest browser tests that counted renders and recorded React Profiler commit times. Nothing in the repo reproduces them, so P1 PRs can't report before and after numbers.

Proposed approach

  • Add repeatable benchmarks for these scenarios:
    • Typing one character in a SelectPanel with 1,000 items, with both stable and inline items.
    • Toggling one row in a 1,000-row DataTable.
    • Focusing an expanded TreeView parent with 10, 100 and 400 children.
    • Mounting and unmounting a page of 300, 1,000 and 3,000 IconButtons.
  • Record render counts, which don't depend on the build, and commit times, which are relative only.
  • Run each benchmark on React 18 and 19.
  • Build on existing stress infrastructure where it fits: utils/StressTest.tsx, *.stress.dev.stories.tsx (ActionList, Button, TreeView, Pagination) and PageLayout.performance.stories.tsx. Either Vitest browser benchmarks or Playwright traces over those stories would work.

Acceptance criteria

  • Each scenario above can be run locally with one documented command.
  • The output includes render counts and commit times.
  • Runs on both React 18 and 19 are documented.
  • The README or contributor docs explain how to report before and after numbers in a PR.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions