Drop, Replace, Inline, DIY, or Minimize Dependencies

[aklinker1]

Feature Request

I really want to decrease the size of WXT. As of 0.21.2, here's it's install size (excluding peers):

22MB / 156 packages

• https://pkg-size.dev/wxt@%5E0.21?no-peers
• https://npmgraph.js.org/?q=wxt@^0.21
• https://node-modules.dev/grid/depth#install=wxt@^0.21

There's a couple options for cleaning these up:

1. Is the dependency actually needed anymore? No? Drop it
2. Can the dependency be replaced with a smaller alternative? Yes? Do it
3. Is the dependency small and not likely to have a vulnerability? Yes? Inline it
4. Is the dependency something that can be replaced by a single function? Yes? DIY it
5. After reviewing, could the package be cleaned up? Yes? Contribute to it

Dependencies

This is a list of all of WXT's 37 direct dependencies, and what, if anything, we can do to reduce it's size:

High Priority

• import-meta-resolve (79KB / 1 package, ESM) - Drop, not needed in Node 22
  • chore(deps): Drop import-meta-resolve #2526
• publish-browser-extension (933KB / 7 packages, ESM)
  • Released v6 → 333KB / 4 packages
  • Explored inlining final deps, but decided not to: chore: Inline deps aklinker1/publish-browser-extension#87
• @aklinker1/rollup-plugin-visualizer (1.7MB / 23 packages, CJS) - Replace with https://sonda.dev or DIY it (how hard can it be? lol). What does nuxt's analysis tool and devtools use? OR trim down my fork to remove yargs and open
  • Issue for sonda already exists: Support WXT Natively filipsobol/sonda#195
  • Rolldown provide's it's own bundle analysis tool, though it is experimental and this would lock us into Vite even more. We would just have to render a UI: https://rolldown.rs/builtin-plugins/bundle-analyzer
  • I got an extension working with vite's environment API, Play around with new Vite environment APIs #1046 (comment), but rollup-plugin-visualizer didn't work when building in series, only in parallel, meaning it's getting lucky with a race condition. So my fork is still necessary

Medium Priority

• open (83KB / 12 packages, ESM) - Replace with tiny-open?
  • chore(deps): Replace open with tiny-open #2527
• prompts (203KB / 3 packages, CJS) - Replace with @topcli/prompts
  • chore(deps): Replace prompts with @topcli/prompts #2528
• async-mutex (153KB / 2 packages, ESM + CJS) - replace with superlock
  • chore(deps): Replace async-mutex with superlock #2529
• @wxt-dev/storage (1.1MB / 8 packages, ESM) - Inline dequal, replace async-mutex with superlock
  • chore(deps): Replace async-mutex with superlock #2529
  • chore(deps): Inline dequal #2530
• jszip (1.8MB / 13 packages, CJS) - There's got to be a zero-dependency zip library we can replace this with...
  • uzip is tiny and might work
  • But maybe node:zlib can do it in a few lines? More than a few, but yes: https://share.gemini.google/gYafpOMSmyfo
  • Or spawn zip subprocesses 🤔
  • fflate was suggested: Drop, Replace, Inline, DIY, or Minimize Dependencies #2523 (comment)
  • chore(deps): Replace jszip with @aklinker1/zero-zip #2538
  • chore(deps): Inline small deps #2560

Low Priority

• scule (30KB / 1 package, ESM + CJS) - Inline to tree-shake CJS
  • chore(deps): Inline small deps #2560
• ci-info (30KB / 1 package, CJS) - Inline to tree-shake everything we don't use|
  • chore(deps): Replace ci-info with custom isCI function #2543
• get-port-please (29KB / 1 package, ESM + CJS) - Inline to tree-shake CJS out
• filesize (58KB / 1 package, ESM + CJS) - Inline or DIY it. 58 kB is a bit large for a few if statements...
• is-wsl (10KB / 3 packages, ESM) - Is this apart of ci-info? If not, inline.
  • chore(deps): Inline small deps #2560
• normalize-path (9.2KB / 1 package, CJS) - Inline or DIY
  • chore(deps): Inline normalize-path #2557
• ohash (20KB / 1 package, ESM) - Inline or DIY
  • chore(deps): Inline small deps #2560
• picomatch (93KB / 1 package, CJS) - Can this be dropped?
• nanospinner (17KB / 2 packages, CJS) - Inline
  • chore(deps): inline funtion for cli spinner #2567
• nano-spawn (45KB / 1 package, ESM) - vs tinyexec? don't need both, tinyexec is smaller...
  • chore(deps): Replace nano-spawn with tinyexec #2544
• dotenv-expand (123KB / 2 packages, CJS) - Inlining it should remove the dependency on dotenv, will be tree-shaken out?
• magicast (5.3MB / 6 packages, ESM) - Only tool that includes babel, would like to replace, maybe with https://oxc.rs/docs/guide/usage/transformer.html?
• @webext-core/fake-browser (1.1MB / 6 packages, ESM) - Simplify the base object to a proxy
• c12 (404KB / 8 packages, ESM) - There's a lot of dependencies here that probably aren't required for our use-case. Might want to DIY it now that node can import TS files
• unimport (3MB / 30 packages, ESM) - No idea how this can be simplified, but it should be. Probably would need to contribute to it.

Fine As-is

• @1natsu/wait-element (46KB / 3 packages, ESM) - Small enough as-is, though I would like to see it have 0 dependencies
• @webext-core/isolated-element (13KB / 2 packages, ESM) - could DIY this
• @webext-core/match-patterns (9.9KB / 1 package, ESM) - small, zero deps, it's fine
• @wxt-dev/browser (870KB / 4 packages, ESM) - Fine, kinda big, but not much can be done about it
• cac (41KB / 1 package, ESM) - Fine, could inline it, but it's fine.
• chokidar (105KB / 2 packages, ESM) - fine for now. readdirp doesn't seem necessary anymore, could contribute to it's removal
• consola (322KB / 1 package, ESM + CJS) - Kinda big, but fine for now. Don't like that it still ships CJS
• defu (21KB / 1 package, ESM + CJS) - Small, could inline, but probably fine
• giget (184KB / 1 package, ESM) - Kinda large, but it does it's job well.
• hookable (24KB / 1 package, ESM) - Could inline, but it's fine as-is for now.
• json5 (235KB / 1 package, FAUX) - Small-ish, one package, probably fine as is.
• linkedom (3.6MB / 20 packages, ESM) - Parsing the entrypoint HTML files could be accomplished with htmlparser2, but I don't think the fake browser environment can be created without a library like this...
• nypm (160KB / 4 packages, ESM) - We don't need it's CLI, so having to download citty is a bit of a waste, but it's not very large for the trouble.
• tinyglobby (186KB / 3 packages, ESM + CJS) - Necessary, could contribute to drop CJS

[rxliuli]

If you want to replace jszip, you can try using fflate. I've used it in a website before and it worked pretty well.

[aklinker1]

If you want to replace jszip, you can try using fflate. I've used it in a website before and it worked pretty well.

They say it's only 8kb... but why is the node_modules size nearly 800 kB lol

High performance (de)compression in an 8kB package

https://pkg-size.dev/fflate - 797KB / 1 package

We can try inlining it to trim it down to just the one ESM file we need, which is still 91 kb 🤔

[aklinker1]

I created this: https://github.com/aklinker1/zero-zip

3.77 kB unpacked. Would inline it to reduce it to ~1.38 kB

[aklinker1]

Here's the comparison between fflate and @aklinker1/zero-zip

Metric	jszip	fflate	@aklinker1/zero-zip
Speed to zip packages/wxt-demo	53 ms	65 ms	27 ms
Size of zip	97.65 kB	98.23 kB	97.1 kB
Max memory used	415912	366556	407784
Install footprint	1.8MB / 13 packages	797KB / 1 package	3.8KB / 1 package

Gonna go with my package.

[aklinker1]

As long as we use unbundle mode, we can't inline any dependencies, which is unfortunate...