Config make rebuilding background faster

[ducan-ne]

Hi, currently I'm using wxt for a heavy extension, my bundle is about 40mb in development and 10mb in production

Is there any way to make the build process faster? Right now every time I save, it has to wait ~5-7s (100% cpu) to rebuild the background, but content script/ page work great (I think it's because we're using Vite dev server + hot reload, and small bundle size).

My ideas:

• Prebuilt dependencies which are heavy (2 of my dependencies have bundle size ~ 10MB) and use the code use it as in UMD mode (via globalThis.Dep1 / globalThis.Dep2)
• Leverage importScripts, https://stackoverflow.com/questions/18651620/multiple-js-files-in-chrome-extension-how-to-load-them mentioned it's possible, but I'm not sure it is, probably need to make some kind of minimal example. And not sure how to implement it with wxt too
• Hot reload background scripts: I'm not sure if this is possible but if importScripts is working, somehow we can make a concept of hot reload the background script, like deps will be rebundling but the application code is preload via importScripts, run defineBackground.main, defineBackground.main also return a function which contains teardown logic.

[ducan-ne]

53 is an interesting approach, IMHO, I would love to use an older version of Chrome if it solves the problem, it's really a pain point to me 😅

[ducan-ne]

another idea: put the background logic to offscreen and gets hot reload in there, I assume it has dom api therefore will support Vite's hot reload:

offscreen: hold the logic, any chrome.xxx.xxx API will call background through an RPC provider (learn from TRPC's idea). Only on dev server, in production we will remove offscreen's permission background: hold the RPC, in production, it will hold the RPC backend for chrome's api calls

I've made a side project a few months ago that does this (for calling browser apis in Raycast extension) https://github.com/ducan-ne/raycast-browser