extension-js / extension.js

🧩 Plug-and-play, zero-config, cross-browser extension development tool.
https://extension.js.org
MIT License
3.67k stars 93 forks source link

Several performance improvements #137

Closed cezaraugusto closed 1 month ago

cezaraugusto commented 2 months ago

This is a big bundle of changes to make Extension.js lighter and more performant.

Also:

Simplified interface:

Screenshot 2024-08-06 at 15 13 20

Single utility dev tools for Extension.js browser support

Screenshot 2024-08-06 at 15 14 01
cezaraugusto commented 1 month ago

Almost finishing this up but I regressed the Vue and Preact support. @OSpoon can you help me out on this? Vue examples ./examples/content-vue and ./examples/new-vue only work in development mode and Preact examples ./examples/content-preact and ./examples/new-preact are not working with SWC at all.

OSpoon commented 1 month ago

Almost finishing this up but I regressed the Vue and Preact support. @OSpoon can you help me out on this? Vue examples ./examples/content-vue and ./examples/new-vue only work in development mode and Preact examples ./examples/content-preact and ./examples/new-preact are not working with SWC at all.

I'll try to troubleshoot the two phenomena you mentioned as soon as possible.

OSpoon commented 1 month ago

Almost finishing this up but I regressed the Vue and Preact support. @OSpoon can you help me out on this? Vue examples ./examples/content-vue and ./examples/new-vue only work in development mode and Preact examples ./examples/content-preact and ./examples/new-preact are not working with SWC at all.

I created a repo that reproduces the issue where Vue.js only works in development mode.

I tried loading these loaders and plugins in the beforeRun hook in production mode, and it seems to be effective.

What do you think about handling it this way?

OSpoon commented 1 month ago

Could you give me a hint about why ./examples/content-preact is not working?

OSpoon commented 1 month ago

For the examples ./examples/content-preact, ./examples/content-react, or ./examples/content-vue, have you encountered the following prompt when running the start command?

image image
cezaraugusto commented 1 month ago

@OSpoon regarding https://github.com/extension-js/extension.js/pull/137#issuecomment-2270311915, that sounds good to me. I'm not sure about the implications honestly but I'd take the risk since it's blocking the merge of this one. Feel free to cherry-pick the changes to this PR or I'll do it later tomorrow no problem.

regarding the browser logs in https://github.com/extension-js/extension.js/pull/137#issuecomment-2270423743, yeah seeing that too. It's likely something related to SWC, which we run twice (for the JsFrameworksPlugin and the tranformer code in ResolverPlugin).

cezaraugusto commented 1 month ago

Current items that need attention:

OSpoon commented 1 month ago

hi @cezaraugusto, Please check if new-preact, content-preact, new-less, and new-sass are working correctly.

cezaraugusto commented 1 month ago

@OSpoon new-less and and new-sass are reloading well, but it seems there is something with the resolver plugin that is preventing the scripting API from injecting styles into the page using these templates.

for new-preact, content-preact, they build properly but still can't reload the page

cezaraugusto commented 1 month ago

I'm investigating why the resolver isn't working properly

cezaraugusto commented 1 month ago

@OSpoon anything else you want to include in this PR before we merge? I'm OK having a Preact fix in a future release.

OSpoon commented 1 month ago

I spent some time looking into why new-preact is not reloading the page, but unfortunately, I haven't found the cause yet. The preact-webpack repo I created seems to be working fine.

I haven't been involved much in browser extensions and build-related work, so I don't have any good ideas at the moment. If I come up with anything new, I'll let you know right away. 😁

cezaraugusto commented 1 month ago

@OSpoon awesome, let's get this one into main