Skip to content

Conversation

@mfranzke
Copy link
Collaborator

@mfranzke mfranzke commented Dec 4, 2025

Proposed changes

Replacing a CSS selector (:is(:root, :host)) with a simpler one (:root, :host) that consistently appeared in the CSS Selectors stats as the lowest performer (and is the most low-hanging fruit of all).

image

Types of changes

  • Bugfix (non-breaking change that fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Refactoring (improvements to existing components or architectural decisions)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • Documentation Update (if none of the other choices apply)

Further comments

🔭🐙🐈 Test this branch here: https://design-system.deutschebahn.com/core-web/review/refactor-css-replacing-slow-selector

@changeset-bot
Copy link

changeset-bot bot commented Dec 4, 2025

🦋 Changeset detected

Latest commit: 3d5cb46

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

This PR includes changesets to release 9 packages
Name Type
@db-ux/core-foundations Patch
@db-ux/core-components Patch
@db-ux/ngx-core-components Patch
@db-ux/react-core-components Patch
@db-ux/wc-core-components Patch
@db-ux/v-core-components Patch
@db-ux/core-stylelint Patch
@db-ux/core-migration Patch
@db-ux/agent-cli 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

@mfranzke mfranzke self-assigned this Dec 4, 2025
@mfranzke mfranzke added the 🍄🆙improvement New feature or request label Dec 4, 2025
@mfranzke mfranzke moved this from 🏗 In progress to 🎁 Ready for review in UX Engineering Team Backlog Dec 4, 2025
@mfranzke mfranzke enabled auto-merge (squash) December 4, 2025 15:05
@github-actions github-actions bot added the 📕documentation Improvements or additions to documentation label Dec 4, 2025
@mfranzke mfranzke requested a review from Copilot December 4, 2025 20:42
Copilot finished reviewing on behalf of mfranzke December 4, 2025 20:44
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR optimizes CSS selector performance by replacing the slower :is(:root, :host) pseudo-class syntax with the equivalent but faster :root, :host multi-selector syntax across the foundations package.

  • Replaces :is(:root, :host) with :root, :host in 5 SCSS files
  • Maintains identical functionality and specificity
  • Addresses performance bottleneck identified in CSS Selectors stats

Reviewed changes

Copilot reviewed 6 out of 6 changed files in this pull request and generated no comments.

Show a summary per file
File Description
packages/foundations/scss/defaults/default-root.scss Updated root/host selector for default styles
packages/foundations/scss/defaults/default-required.scss Updated root/host selector in variables layer
packages/foundations/scss/defaults/_default-variables.scss Updated root/host selector for CSS custom properties
packages/foundations/scss/defaults/_default-container-variables.scss Updated root/host selector for container variables
packages/foundations/scss/colors/_default-color-mappings.scss Updated root/host selector in color mappings
.changeset/rich-baboons-compete.md Added changeset documenting the refactor across all affected packages

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

Labels

📕documentation Improvements or additions to documentation 🏗foundations 🍄🆙improvement New feature or request

Projects

Status: 🎁 Ready for review

Development

Successfully merging this pull request may close these issues.

2 participants