Live Preview: Reduce file size

[taipeicoder]

Description

See p1705629726572469-slack-CRWCHQGUB. Currently, the file size for wpcom-live-preview-notice.js exceeds 3mb pre-processed. While lazy loaded, it would be good to look into how could we reduce the file size by removing some of the package imports.

• @fushar also proposes to move these files to jetpack-mu-wpcom.
• You can use Bundle Analyzer Add Bundle Analyzer to wpcom-block-editor #86629 to identify the bottlenecks.

[jsnajdr]

This is strange, the plugin imports a few string constants from calypso-products, and yet it bundles the entire package, plus @tanstack/query. It's like there wasn't sideEffects: false in calypso-products/package.json, but it's there.

[jsnajdr]

It's caused by #85013 (by @okmttdhr) which includes the ThemeUpgradeModal component from Calypso, dragging a sizable piece of Calypso into the block editor: the React Query client, products library, UI components, ...

[taipeicoder]

Hey @jsnajdr thanks for looking this!
For more context, we currently lazy load this file, which after processing should be around 290kb.

Lazy loading introduced another issue on its own, which was that the file did not contain any cache buster. We addressed it in this PR #86691.

If there are still any concerns about lazy loading this file, we can look into making the ThemeUpgradeModal leaner. cc: @Automattic/lego

[jsnajdr]

Thanks for the update! Downsizing ThemeUpgradeModal looks like an uneasy task. Now when we know where the bundle size is coming from, and when we manage it by lazy loading, there is probably nothing straightforward we can do to improve this.