Skip to content
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

Compiling content script with many modules is painfully slow #67

Open
Merlin04 opened this issue Feb 21, 2022 · 4 comments
Open

Compiling content script with many modules is painfully slow #67

Merlin04 opened this issue Feb 21, 2022 · 4 comments

Comments

@Merlin04
Copy link

Hello, I'm using vitesse-webext to develop a fairly large browser extension where the majority of the code is in the content script (using React and other libraries like MUI and Framer Motion). However, the build times for my content script have become painfully slow, taking between 10 and 25 seconds per rebuild:

build started...
✓ 11020 modules transformed.
../extension/dist/contentScripts/index.global.js   744.09 KiB / gzip: 230.18 KiB
../extension/dist/contentScripts/index.global.js.map 3180.64 KiB
built in 17941ms.

Most of the time spent building is after it has printed out the "modules transformed" message - it sits there without any output for a considerable amount of time, then prints rendering chunks (1)..., then a half a second later prints out the rest of the output.

Is there any way I can make this build faster?

@sixers
Copy link

sixers commented Jun 6, 2022

I experience the same issue, once I migrated to monorepo, the build times increased dramatically.

@seomikewaltman
Copy link

I experience the same issue, once I migrated to monorepo, the build times increased dramatically.

Which monorepo did you use? Turborepo? I'd love to see how you configured it.

@HenriChabert
Copy link

Hello @Merlin04,
Sorry to reopen the topic so late, but dod you find anything to improve the build time? I face the same problem...
Cheers !

@Merlin04
Copy link
Author

it's been a while so I don't entirely remember how it worked, but I think I made my own rollup configs/bundling system for development that compiled dependencies separately to an output folder with a file for each dependency in the package.json, wrote a babel plugin to transform imports in my content script to reference these new files, and used a custom implementation of systemjs to actually import these dependencies. this way the content script is compiled separate from dependencies and so it rebuilds really fast when you make changes. it's a pretty terrible hack, but it worked alright!

here's the code if you want to reference what I did: https://github.com/Merlin04/bandcamp

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants