You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
This PR optimizes performance for uncontrolled Field.Control inputs by removing unnecessary internal state updates on every keystroke. Previously, the component used useControlled hook's setter to track value changes even for uncontrolled inputs, causing the component to rerender on each keystroke.
The fix recognizes that for uncontrolled inputs, React doesn't need to track the value in state - the DOM element manages it via defaultValue. Now, only setDirty and setFilled state updates occur, which stabilize after the first keystroke (React's state setter bailout optimization prevents rerenders when setting the same value). This makes Base UI Input compatible with React Hook Form's performance expectations for uncontrolled inputs.
Key changes:
Removed useStableCallback wrapper around value setter
Eliminated unnecessary setValueUnwrapped calls for uncontrolled inputs
Simplified value handling: controlled inputs get value prop, uncontrolled get defaultValue
Added comprehensive test validating the rerender optimization
Confidence Score: 5/5
This PR is safe to merge with minimal risk
The change is a focused performance optimization that simplifies the code by removing unnecessary state tracking for uncontrolled inputs. The implementation correctly leverages React's standard uncontrolled input pattern using defaultValue, and includes a comprehensive test that validates the performance improvement. The change does not affect controlled input behavior and maintains backward compatibility.
No files require special attention
Important Files Changed
Filename
Overview
packages/react/src/field/control/FieldControl.tsx
Removes unnecessary state tracking for uncontrolled inputs by eliminating the setValue wrapper and directly calling onValueChange, significantly reducing rerenders
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
component: fieldChanges related to the field component.type: enhancementIt’s an improvement, but we can’t make up our mind whether it's a bug fix or a new feature.
3 participants
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.
The
useControlled/setValuewrapper was an unnecessary layer hereFixes #3819