Skip to content

[perf] Export theme.ts / create-theme directly #1489

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
theogravity opened this issue Sep 16, 2024 · 4 comments · Fixed by #1498
Closed

[perf] Export theme.ts / create-theme directly #1489

theogravity opened this issue Sep 16, 2024 · 4 comments · Fixed by #1498
Assignees
Labels
🚀 enhancement New feature or request

Comments

@theogravity
Copy link

theogravity commented Sep 16, 2024

Development under Next.js slows down in dev mode initial startup when importing from the root flowbite-react because it has to compile all exports since we're importing directly from flowbite-react.

It would really help if theme.ts can be directly imported:

https://github.com/themesberg/flowbite-react/blob/main/packages/ui/src/theme.ts

And same with the helpers / create-theme:

https://github.com/themesberg/flowbite-react/blob/main/packages/ui/src/helpers/create-theme.ts

For reference, see:

vercel/next.js#48748

Quote:

react-icons, material icons, etc. Most of these libraries publish barrel files with a lot of re-exports. E.g. material-ui/icons ships 5500 module re-exports, which causes all of them to be compiled. You have to add modularizeImports to reduce it, here's an example: vercel/next.js#45529 (comment)

Unfortunately, optimizePackageImports / modularizeImports doesn't work as it claims to that we had to refactor out react-icons and use the specific icon library that we were using out of it. Now we're seeing the same issues with flowbite-react. The refactor out of react-icons saved us around 40s of initial startup time, and we're seeing around 5-10s with flowbite-react.

Anything that isn't exported directly should be so we can directly reference it instead of the main flowbite-react import.

@theogravity theogravity changed the title Export theme.ts / create-theme directly [perf] Export theme.ts / create-theme directly Sep 16, 2024
@theogravity
Copy link
Author

I also see a reference to react-icons in the bundler that also may contribute to compile times too, so just adding support for more direct imports may not fix the issue entirely.

@rluders
Copy link
Collaborator

rluders commented Sep 16, 2024

Probably related to (some performance issues, and react-icons)
#1197 #1447

@theogravity
Copy link
Author

theogravity commented Sep 16, 2024

This report is with optimizePackageImports: ["flowbite-react"] being used. I'm on Next.js 15 RC if that matters.

@theogravity
Copy link
Author

theogravity commented Jan 9, 2025

just FYI - management has directed us to gradually switch over to shadcn due to the long load times around the nextjs dev experience with flowbite-react.

We are flowbite pro customers, and I unfortunately cannot recommend flowbite to anyone right now.

@SutuSebastian SutuSebastian self-assigned this Mar 13, 2025
@SutuSebastian SutuSebastian added the 🚀 enhancement New feature or request label Mar 13, 2025
@SutuSebastian SutuSebastian linked a pull request Mar 13, 2025 that will close this issue
24 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🚀 enhancement New feature or request
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants