:sparkles: feat: optimize bundle by SimonShiki · Pull Request #182 · Clipteam/clipcc

SimonShiki · 2026-03-08T09:25:24Z

Description

Reduce bundle size and make load time shorter.

Proposed Changes

Remove unused polyfills
Balance chunk size
Use our optimized version of scratch-render-fonts (reduced size & scf AGPL-3.0 avoidance)
Use our optimized version of scratch-sb1-convertor (reduced size & scf AGPL-3.0 avoidance)
Move clipcc-svg-renderer out of monorepo, Since we haven't modify it before and it slow downs the total build time
Optimize image assets size in production mode
Remove broken service worker registration script since we don't have write it. the PWA support should be done in further works

Test Coverage

None

Additional Context

Chunk split changes are split into another pr, i still think they're necessary.
A discussion about compatability issues should be considered. Web Baseline: Widely Usable make a good start point?

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

cloudflare-workers-and-pages · 2026-03-08T09:30:57Z

Deploying clipcc-preview with Cloudflare Pages

Latest commit:	`c3b8619`
Status:	✅ Deploy successful!
Preview URL:	https://7f02bf35.clipcc-preview.pages.dev
Branch Preview URL:	https://feat-bundle-opt.clipcc-preview.pages.dev

View logs

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

alexcui03

Split dependencies changes to another pr, the remaining still needs to be discussed.

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

SimonShiki · 2026-03-09T13:24:45Z

Split dependencies changes to another pr, the remaining still needs to be discussed.

Lazy to split pr, let's have the discussion

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

Copilot

Pull request overview

This PR reduces initial bundle size and load time by lazy-loading heavyweight editor modules (blocks/paint/extensions), trimming polyfills, and moving clipcc-svg-renderer out of the monorepo in favor of a prebuilt external dependency.

Changes:

Convert built-in extension loading to async import() with webpack chunk naming.
Add lazy-loaders/HOCs for clipcc-block and clipcc-paint, including dynamic reducer injection for paint.
Remove in-repo packages/svg-renderer and update build/test wiring + dependencies accordingly; add production image minimization and updated browsers/Babel targets.

Reviewed changes

Copilot reviewed 80 out of 107 changed files in this pull request and generated 6 comments.

Show a summary per file

File	Description
packages/vm/webpack.config.js	Add `text-encoding` alias; stop copying svg-renderer web build artifacts
packages/vm/src/virtual-machine.js	Remove unused core-extension boot loop; lazy-load SB1 converter on demand
packages/vm/src/import/load-costume.js	Whitespace-only formatting changes
packages/vm/src/extensions/scratch3_gdx_for/index.js	Switch `@vernier/godirect` import path to package root
packages/vm/src/extension-support/extension-manager.js	Split core vs builtin extensions; lazy-load builtin extensions via dynamic import
packages/vm/package.json	Update deps (godirect, sb1 converter, render fonts) and svg-renderer versioning
packages/svg-renderer/webpack.config.js	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/tsconfig.node.json	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/tsconfig.json	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/sanitize-svg.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixup-svg-string.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/svg-tag-prefixes.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/script.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/script.sanitized.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/scratch_cat_bitmap_within_svg.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/scratch_cat_bitmap_within_svg.sanitized.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/reserved-namespace.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/reserved-namespace.sanitized.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/red-and-white-carousel-pound-in-href.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/red-and-white-carousel-pound-in-href.sanitized.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/onload-script.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/metadata-onload.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/metadata-onload.sanitized.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/metadata-body.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/hearts.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/embedded-cat-xlink.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/embedded-cat-foo.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/embedded-cat-foo.sanitized.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/css-import.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/fixtures/css-import.sanitized.svg	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/test/bitmapAdapter_getResized.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/util/log.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/types/transformation-matrix.d.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/types/scratch-render-fonts.d.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/types/global.d.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/transform-applier.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/svg-renderer.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/svg-element.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/serialize-svg-to-string.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/sanitize-svg.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/playground/index.html	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/load-svg-string.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/index.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/font-inliner.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/font-converter.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/fixup-svg-string.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/src/bitmap-adapter.ts	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/renovate.json5	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/package.json	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/eslint.config.js	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/TRADEMARK	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/README.md	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/LICENSE	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/.npmignore	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/.gitignore	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/.github/workflows/commitlint.yml	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/.github/workflows/ci-cd.yml	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/.github/PULL_REQUEST_TEMPLATE.md	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/.github/ISSUE_TEMPLATE.md	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/.github/CONTRIBUTING.md	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/.gitattributes	Removed (svg-renderer moved out of monorepo)
packages/svg-renderer/.editorconfig	Removed (svg-renderer moved out of monorepo)
packages/storage/webpack.config.js	Adjust externals mapping for text encoding polyfill package
packages/storage/package.json	Remove unused Babel runtime transform plugin devDependency
packages/render/test/integration/index.html	Update svg-renderer script path to come from `node_modules`
packages/render/test/integration/cpu-render.html	Update svg-renderer script path to come from `node_modules`
packages/render/src/SVGSkin.js	Post-process serialized SVG text before creating data URI
packages/render/package.json	Swap render-fonts dep; pin svg-renderer to external version
packages/paint/webpack.config.js	Remove now-unneeded Babel plugin configuration
packages/paint/src/playground/playground.jsx	Switch to `clipcc-render-fonts` import
packages/paint/package.json	Swap render-fonts dep; remove Babel proposal plugin devDependency
packages/paint/.babelrc	Remove object-rest-spread plugin from Babel config
packages/l10n/webpack.config.js	Simplify Babel loader options
packages/l10n/package.json	Adjust Babel devDependency versions
packages/l10n/.babelrc	Update preset-env targets to modern browsers
packages/gui/webpack.config.js	Add image minimization, analyzer option, updated splitChunks strategy, remove some includes/plugins
packages/gui/tsconfig.json	Switch TS module/JSX settings for ESM + React emit
packages/gui/src/types.d.ts	Add module declarations for asset imports used by TS
packages/gui/src/reducers/utils.ts	Add dynamic reducer injection utilities
packages/gui/src/playground/index.jsx	Remove legacy polyfills and service worker registration
packages/gui/src/lib/paint-loader.ts	Lazy loader for `clipcc-paint`
packages/gui/src/lib/paint-loader-hoc.tsx	HOC to inject paint module + reducer when loaded
packages/gui/src/lib/make-toolbox.js	Defer ScratchBlocks localization usage until blocks are loaded
packages/gui/src/lib/blocks.js	Pass ScratchBlocks instance in; remove compareStrings override
packages/gui/src/lib/blocks-loader.ts	Lazy loader for `clipcc-block`
packages/gui/src/lib/blocks-loader-hoc.tsx	HOC to inject blocks module when loaded
packages/gui/src/lib/backpack/sound-thumbnail.jpg	Replace/optimize backpack asset
packages/gui/src/lib/backpack/block-to-image.js	Make async and load ScratchBlocks lazily
packages/gui/src/lib/app-state-hoc.jsx	Remove eager paint reducer; enable dynamic reducer injection wiring
packages/gui/src/index.js	Remove eager paint reducer from exported reducer set
packages/gui/src/containers/paint-editor-wrapper.jsx	Load paint editor lazily via HOC
packages/gui/src/containers/gui.jsx	Preload paint editor when entering full editor (non-player)
packages/gui/src/containers/custom-procedures.jsx	Lazy-load ScratchBlocks for mutator workspace setup
packages/gui/src/containers/blocks.jsx	Lazy-load ScratchBlocks for blocks workspace; add error logging in toolbox generation
packages/gui/src/components/loader/scoped-loader.tsx	Add scoped loader UI for lazy-loading states
packages/gui/src/components/loader/loader.css	Add styling for scoped loader variant
packages/gui/package.json	Add bundle analyze script; update deps (remove legacy polyfills, add imagemin tooling)
packages/gui/.browserslistrc	Update browser support policy to modern targets
packages/gui/.babelrc	Remove now-unneeded Babel plugins; simplify preset-env config
packages/block/src/utils.ts	Optimize string comparison by reusing a single Intl.Collator
package.json	Remove svg-renderer from full build and workspace shortcuts
UPSTREAM	Remove scratch-svg-renderer upstream pin
.github/workflows/lint.yml	Remove svg-renderer lint job

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.

        const svgTag = loadSvgString(svgData);
-        const svgText = serializeSvgToString(svgTag, true /* shouldInjectFonts */);
+        let svgText = serializeSvgToString(svgTag, true /* shouldInjectFonts */);
+        svgText = svgText.replace(/&quot;/g, "'");
        this._svgImageLoaded = false;


+                        src={topBlock}
+                    />
+                    <img
+                        className={styles.middleBlock}
+                        src={middleBlock}
+                    />
+                    <img
+                        className={styles.bottomBlock}
+                        src={bottomBlock}


Signed-off-by: SimonShiki <sinangentoo@gmail.com>

SimonShiki added 4 commits March 8, 2026 15:14

🔧 chore: remove our svg-renderer

40e4a97

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

✨ feat(gui): load clipcc-block lazily

25b67d8

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🐛 fix(gui): split block chunk

9e6d7ad

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🔧 chore: remove outdated polyfills

02d4a42

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

SimonShiki self-assigned this Mar 8, 2026

SimonShiki added 5 commits March 8, 2026 18:29

🔧 chore: correct dependencies version

3211ae0

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🔧 chore: replace scratch-render-fonts to our version

acb3ab9

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🐛 fix: lazy block related errors

68a62ff

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🔧 chore(gui): load paint lazily

087a073

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🔧 chore(gui): remove useless context typecheck

87c56d2

alexcui03 added the need discussion The feature needs to be discussed further. label Mar 8, 2026

SimonShiki added 5 commits March 9, 2026 09:09

🔧 chore: load builtin extensions lazily

ef96465

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🔧 chore(gui): refine reducer injection logic

51af9ab

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🐛 fix: inline svg fonts

0a1d550

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🔧 chore(vm): load builtin extension esm-ify to make tap happy

12590dd

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

✨ feat(gui): optimize images on production mode

fa80f5b

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

SimonShiki marked this pull request as ready for review March 9, 2026 04:12

SimonShiki requested a review from alexcui03 March 9, 2026 04:12

SimonShiki added gui Things related to clipcc-gui. vm Things related to clipcc-vm. dependencies Pull requests that update a dependency file paint Things related to clipcc-paint. labels Mar 9, 2026

SimonShiki added 2 commits March 9, 2026 14:40

🐛 fix(gui): broken sound thumbnail

5e32476

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🔧 chore(gui): preload paint

3496755

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

alexcui03 requested changes Mar 9, 2026

View reviewed changes

Comment thread packages/gui/webpack.config.js Outdated

🔧 chore(gui): keep env var consistency

1cba991

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

SimonShiki requested a review from alexcui03 March 9, 2026 13:25

🔧 chore(gui): refine paint editor preload logic

3d1a82b

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

SimonShiki added 3 commits March 10, 2026 12:01

🚧 merge: sync with dev/3.2

7b40e95

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🔧 chore(vm): load clipcc-sb1-convertor lazily

cd0ac38

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🚧 merge: sync with dev/3.2

dc285b0

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

SimonShiki mentioned this pull request Mar 12, 2026

🔧 chore: use utility function to build webpack config #187

Closed

SimonShiki requested a review from Copilot March 13, 2026 01:45

Copilot started reviewing on behalf of SimonShiki March 13, 2026 01:45 View session

Copilot AI reviewed Mar 13, 2026

View reviewed changes

SimonShiki added 14 commits March 13, 2026 13:38

🔧 chore: make hex and large json external

7b718e6

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🔧 chore: externalize assets

7173e16

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🔧 chore(vm): bump sb1 convertor to fix tests

7d13e62

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🔧 chore: minify css

d17f266

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🔧 chore(vm): make loadExtensionURL can load core extensions

edbf78e

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🐛 fix(storage): export type individually

8ca7f61

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🚧 chore: update with dev/3.2

4d7ae79

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

⏪ chore: revert chunk split related changes

6828816

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🎨 fix(gui): extra spaces

6efc582

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🚧 merge: update with dev/3.2

6fd2d71

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🚧 merge: update with dev/3.2

5cca7de

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🎨 fix(gui): remove extra spaces [skip ci]

b3d2052

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🔧 chore: only include needed node polyfills

fc3374e

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

🚧 merge: update with dev/3.2

c3b8619

Signed-off-by: SimonShiki <sinangentoo@gmail.com>

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

✨ feat: optimize bundle#182

✨ feat: optimize bundle#182
SimonShiki wants to merge 35 commits into
dev/3.2from
feat/bundle-opt

SimonShiki commented Mar 8, 2026 •

edited

Loading

Uh oh!

cloudflare-workers-and-pages Bot commented Mar 8, 2026 •

edited

Loading

Uh oh!

alexcui03 left a comment

Uh oh!

Uh oh!

SimonShiki commented Mar 9, 2026

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Conversation

SimonShiki commented Mar 8, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Proposed Changes

Test Coverage

Additional Context

Uh oh!

cloudflare-workers-and-pages Bot commented Mar 8, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Deploying clipcc-preview with Cloudflare Pages

Uh oh!

alexcui03 left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

SimonShiki commented Mar 9, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

SimonShiki commented Mar 8, 2026 •

edited

Loading

cloudflare-workers-and-pages Bot commented Mar 8, 2026 •

edited

Loading