Skip to content

Conversation

@mattcosta7
Copy link
Contributor

@mattcosta7 mattcosta7 commented Dec 15, 2025

Summary

Performance optimizations for ActionList CSS selectors to improve INP (Interaction to Next Paint).

Changes

  1. Replace :has([aria-disabled]) with [data-disabled] - Direct attribute lookup instead of descendant scan
  2. Replace :has([data-loading]) with [data-loading] - Direct attribute lookup instead of descendant scan
  3. Scope TrailingAction loading selector - Use > [data-loading] for direct child lookup

Expected INP Impact

Scenario Before After Improvement
Worst case (large ActionList, 100+ items) ~50-100ms style recalc per interaction <5ms 90-95% reduction
Average case (typical ActionList, 10-30 items) ~10-30ms style recalc <2ms 80-90% reduction
Best case (small ActionList, <10 items) ~5-10ms style recalc <1ms ~80% reduction

Why this matters

Unscoped :has() selectors force the browser to traverse the entire subtree on every style recalculation. This happens on:

  • Hover/focus state changes
  • Item selection
  • Any DOM mutation within the list

By using data attributes and scoping selectors, we reduce O(n) traversals to O(1) lookups.


Part of the INP performance optimization effort. See #7312 for full context.

@changeset-bot
Copy link

changeset-bot bot commented Dec 15, 2025

🦋 Changeset detected

Latest commit: 830be38

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@primer/react Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions github-actions bot added the integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm label Dec 15, 2025
@github-actions
Copy link
Contributor

👋 Hi, this pull request contains changes to the source code that github/github-ui depends on. If you are GitHub staff, test these changes with github/github-ui using the integration workflow. Or, apply the integration-tests: skipped manually label to skip these checks.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants