Skip to content

perf: import MUI icons by path instead of the barrel - #93

Open
saurabhraghuvanshii wants to merge 1 commit into
layer5io:masterfrom
saurabhraghuvanshii:perf/deep-mui-icon-imports
Open

saurabhraghuvanshii wants to merge 1 commit into
layer5io:masterfrom
saurabhraghuvanshii:perf/deep-mui-icon-imports

Conversation

@saurabhraghuvanshii

@saurabhraghuvanshii saurabhraghuvanshii commented Sep 13, 2026

Copy link
Copy Markdown
Member

Seven components imported icons from the @mui/icons-material barrel. The rollup build keeps dependencies external, so dist/index.js shipped a require('@mui/icons-material') for 11 icons, and every consumer's bundler then had to resolve and parse the ~10,800 modules that barrel re-exports.

Import each icon by path and add a no-restricted-imports lint rule so the barrel cannot come back. The built bundle now has zero barrel requires and 11 deep ones. All 236 tests pass; the 8 remaining lint errors are pre-existing class-field parsing errors, identical on master.

Notes for Reviewers

This PR fixes #

Signed commits

  • Yes, I signed my commits.

Summary by CodeRabbit

  • Refactor

    • Updated internal icon imports across several interface components for improved consistency and maintainability.
    • Standardized icon loading to use individual modules rather than bundled exports.
  • Chores

    • Added a linting rule to prevent future use of bundled icon imports.
    • No user-facing functionality or visual behavior has changed.

@coderabbitai

coderabbitai Bot commented Sep 13, 2026

Copy link
Copy Markdown

Review Change StackReview Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Advanced

Run ID: be16bf77-1341-469b-9c1b-897a9b08849b

📥 Commits

Reviewing files that changed from the base of the PR and between 329ae57 and 2a2f3e5.

📒 Files selected for processing (8)
  • eslint.config.js
  • src/components/ExpandButton.js
  • src/components/Popover.js
  • src/components/TableHeadCell.js
  • src/components/TableSearch.js
  • src/components/TableToolbar.js
  • src/components/TableToolbarSelect.js
  • src/plug-ins/DebounceSearchRender.js

Included review availability: Your plan provides up to 1 included review per hour; 0 remain after this review.


📝 Walkthrough

Walkthrough

The ESLint configuration now rejects @mui/icons-material barrel imports. Affected components and the debounce search plug-in now import icons from individual modules without changing their local identifiers or reported behavior.

Changes

MUI icon import migration

Layer / File(s) Summary
Import restriction
eslint.config.js
Adds an error-level no-restricted-imports rule for @mui/icons-material barrel imports.
Icon import migration
src/components/ExpandButton.js, src/components/Popover.js, src/components/TableHeadCell.js, src/components/TableSearch.js, src/components/TableToolbar.js, src/components/TableToolbarSelect.js, src/plug-ins/DebounceSearchRender.js
Replaces grouped or named icon imports with individual module imports. Existing local icon identifiers remain unchanged.

Priority: ⬇️ Low

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Refactor

Merge Risk: ⚪ Minimal · up to fb83a

The PR changes only icon import paths and lint enforcement. Tests pass, with no identified user-facing or operational regression.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 8 files. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly and concisely describes the main change: importing MUI icons by individual paths instead of the barrel package.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

Seven components imported icons from the `@mui/icons-material` barrel. The
rollup build keeps dependencies external, so `dist/index.js` shipped a
`require('@mui/icons-material')` for 11 icons, and every consumer's bundler
then had to resolve and parse the ~10,800 modules that barrel re-exports.

Import each icon by path and add a `no-restricted-imports` lint rule so the
barrel cannot come back. The built bundle now has zero barrel requires and
11 deep ones. All 236 tests pass; the 8 remaining lint errors are
pre-existing class-field parsing errors, identical on master.

Signed-off-by: saurabhraghuvanshii <saurabhsraghuvanshi@gmail.com>

@banana-three-join banana-three-join left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

LGTM!

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

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants