Skip to content

[all components] Reduce bundle size#4813

Draft
atomiks wants to merge 3 commits into
mui:masterfrom
atomiks:codex/reduce-bundle-size
Draft

[all components] Reduce bundle size#4813
atomiks wants to merge 3 commits into
mui:masterfrom
atomiks:codex/reduce-bundle-size

Conversation

@atomiks
Copy link
Copy Markdown
Contributor

@atomiks atomiks commented May 12, 2026

This trims bundle size mostly by keeping public APIs intact while letting internal component entrypoints import smaller implementation paths. The root package savings are modest after dropping the docs-breaking data-attribute enum conversion, but several popup-heavy component entrypoints still get measurable cuts.

Changes

  • Split public Floating UI hooks from smaller core hooks used by internal popup components.
  • Added a smaller internal store entrypoint for Base UI components while keeping @base-ui/utils/store as the full public barrel.
  • Shared popup trigger/focus plumbing and reused lighter portal helpers where components do not need the full public portal surface.
  • Trimmed popup, safe polygon, browser, visibility, and scroll-lock helper paths that are pulled into many popup-heavy entrypoints.

Bundle size

Measured with pnpm size:snapshot against upstream/master (221282c8c). Entry deltas are independent bundles, so the component rows do not sum into the root package delta.

Entry Upstream gzip PR gzip Delta
@base-ui/react 148,822 B 148,592 B -230 B
Tooltip 32,964 B 30,665 B -2,299 B
Preview Card 31,899 B 29,701 B -2,198 B
Dialog 20,621 B 19,794 B -827 B
Popover 37,570 B 36,785 B -785 B
Menu 48,559 B 46,358 B -2,201 B
Select 42,316 B 40,827 B -1,489 B
Combobox 45,666 B 45,166 B -500 B
Drawer 31,891 B 31,157 B -734 B
Toast 26,207 B 24,376 B -1,831 B
@base-ui/utils/store 7,403 B 7,391 B -12 B

Why it saves size

Change Why it saves bundle size Main affected entrypoints
Core useDismiss and useListNavigation hooks Keeps public wrappers available, but lets internal components skip wrapper-only option code and imports. Tooltip, Preview Card, Dialog, Popover, Menu, Select, Combobox
Internal @base-ui/utils/store/core path Internal bundles use StoreCore/ReactStoreCore without public convenience methods like .use() and .observe(); the public @base-ui/utils/store barrel remains full-featured. Root package, popup components, Select, Combobox
Lighter portal helpers Shares portal node/context work and uses the smaller portal path where components do not need the full public FloatingPortal surface. Dialog, Popover, Menu, Select, Combobox, Preview Card, Tooltip
Popup trigger/helper consolidation Moves repeated trigger press, focus guard, and popup state plumbing into shared smaller helpers. Tooltip, Preview Card, Popover, Menu, Select, Combobox
Safe polygon and visibility trimming Simplifies hover intent and visibility helper code that is pulled through popup interactions. Tooltip, Preview Card, Menu
Browser and scroll-lock utility trimming Removes duplicated or heavier helper paths from code used by modal and dismissable components. Dialog, Drawer, Popover, Menu, Select, Combobox

@atomiks atomiks added type: enhancement It’s an improvement, but we can’t make up our mind whether it's a bug fix or a new feature. performance scope: all components Widespread work has an impact on almost all components. package: utils Specific to the utils package. the great shave off https://www.notion.so/mui-org/eng-Issue-bounty-149cbfe7b660802695d8ec7eb97696cb labels May 12, 2026
@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new Bot commented May 12, 2026

commit: d7b8c66

@code-infra-dashboard
Copy link
Copy Markdown

code-infra-dashboard Bot commented May 12, 2026

Bundle size

Bundle Parsed size Gzip size
@base-ui/react ▼-1.78KB(-0.38%) ▼-251B(-0.17%)

Details of bundle changes

Performance

Total duration: 1,350.84 ms +158.65 ms(+13.3%) | Renders: 50 (+0) | Paint: 2,065.36 ms +230.71 ms(+12.6%)

Test Duration Renders
Tabs mount (200 instances) 278.20 ms 🔺+49.92 ms(+21.9%) 4 (+0)
Scroll Area mount (300 instances) 104.29 ms 🔺+22.78 ms(+27.9%) 3 (+0)
Menu open (500 items) 87.98 ms 🔺+16.99 ms(+23.9%) 12 (+0)

details


Check out the code infra dashboard for more information about this PR.

@netlify
Copy link
Copy Markdown

netlify Bot commented May 12, 2026

Deploy Preview for base-ui ready!

Name Link
🔨 Latest commit d7b8c66
🔍 Latest deploy log https://app.netlify.com/projects/base-ui/deploys/6a02cc369edaee0008992bee
😎 Deploy Preview https://deploy-preview-4813--base-ui.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

@github-actions github-actions Bot added the PR: out-of-date The pull request has merge conflicts and can't be merged. label May 14, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

package: utils Specific to the utils package. performance PR: out-of-date The pull request has merge conflicts and can't be merged. scope: all components Widespread work has an impact on almost all components. the great shave off https://www.notion.so/mui-org/eng-Issue-bounty-149cbfe7b660802695d8ec7eb97696cb type: enhancement It’s an improvement, but we can’t make up our mind whether it's a bug fix or a new feature.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant