Refactor Knob component styles for performance - #5416
Open
MaddipatlaChetan24 wants to merge 1 commit into
Open
Conversation
Refactor styles in Knob component to use static objects instead of inline styles, improving performance by avoiding unnecessary re-creation on each render.
MaddipatlaChetan24
requested review from
DianaSuvorova,
dyesin,
hualf1995 and
lijim
as code owners
September 8, 2026 13:36
Contributor
Author
|
can you please check this !! |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fixes #1, Fixes #2
Description
Refactors two style overrides in the
Knobcomponent to use static,module-level objects instead of inline object/function literals that
were being re-created on every render.
RadioGroupRoot's style was written as a function(
({ $theme }) => ({...})) but never actually referenced$themeinits return value — it was a constant disguised as a function. Replaced
with a plain module-level
RADIO_GROUP_ROOT_OVERRIDE_STYLEobject,which baseui's
overrides.<Component>.styleaccepts directly. Thisremoves both the per-render function allocation and the function call
baseui previously had to make to resolve it.
Checkbox'sLabeloverride (style: { fontWeight: 500 }) wasalready a static shape but was being re-allocated as a new object
literal on every render. Hoisted to a module-level
CHECKBOX_LABEL_OVERRIDE_STYLEconstant so the same object referenceis reused across renders.
Both changes are behavior-identical — same resolved styles, same visual
output — just without the unnecessary re-allocation.
Left the two per-
Radiooverrides inside the enum options.map()unchanged. They do use
$themeand can't become plain objects, andwhile they could in principle also be hoisted to module scope, doing so
risks losing baseui's contextual type inference for the
$themeparameter (which is currently inferred from the JSX prop's expected
type) and could introduce a type error without knowing this project's
exact
tsconfig/baseui override type setup. Flagging as a possiblefollow-up rather than guessing at a fix that might not compile.
Scope
Patch: Bug Fix