✨ feat: optimize bundle

.github/workflows/lint.yml

@@ -153,17 +153,3 @@ jobs:
 
       - name: Lint
         run: pnpm storage lint
-
-  svg-renderer:
-    name: Lint SVG Renderer
-    needs: [build]
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v5
-
-      - name: Setup dependencies
-        uses: ./.github/actions/setup-deps
-
-      - name: Lint
-        run: pnpm svg-renderer lint

UPSTREAM

@@ -7,5 +7,4 @@ scratch-paint 6d241ec
 scratch-storage 80b258d
 scratch-parser 7244904
 scratch-audio 50b7ade
-scratch-svg-renderer 5ad1d41
 eslint-config-scratch 87ee420

package.json

@@ -13,7 +13,7 @@
     "start": "pnpm run gui start",
     "prepare": "husky",
     "build:dist": "cross-env NODE_ENV=production pnpm run build:full",
-    "build:full": "pnpm l10n build && pnpm audio build && pnpm storage build && pnpm svg-renderer build && pnpm render build && pnpm block build && pnpm vm build && pnpm paint build && node packages/gui/scripts/prepublish.mjs && pnpm gui build",
+    "build:full": "pnpm l10n build && pnpm audio build && pnpm storage build && pnpm render build && pnpm block build && pnpm vm build && pnpm paint build && node packages/gui/scripts/prepublish.mjs && pnpm gui build",
     "build": "pnpm block build && pnpm gui build",
     "test": "pnpm gui test:unit && pnpm block test && pnpm vm test",
     "performance": "pnpm vm performance",
@@ -28,7 +28,6 @@
     "block": "pnpm --filter clipcc-block",
     "l10n": "pnpm --filter clipcc-l10n",
     "render": "pnpm --filter clipcc-render",
-    "svg-renderer": "pnpm --filter clipcc-svg-renderer",
     "lint-config": "pnpm --filter eslint-config-clipcc",
     "storage": "pnpm --filter clipcc-storage",
     "paint": "pnpm --filter clipcc-paint",

packages/audio/webpack.config.js

@@ -30,6 +30,8 @@ module.exports = {
         'startaudiocontext': true
     },
     plugins: [
-        new NodePolyfillPlugin()
+        new NodePolyfillPlugin({
+            includeAliases: ['events']
+        })
     ]
 };

packages/gui/.babelrc

@@ -1,13 +1,10 @@
 {
     "plugins": [
-        "@babel/plugin-syntax-dynamic-import",
-        "@babel/plugin-transform-async-to-generator",
-        "@babel/plugin-proposal-object-rest-spread",
         ["react-intl", {
             "messagesDir": "./translations/messages/"
         }]],
     "presets": [
-        ["@babel/preset-env", {"targets": {"browsers": ["last 3 versions", "Safari >= 8", "iOS >= 8"]}}],
+        "@babel/preset-env",
         "@babel/preset-react",
         "@babel/preset-typescript"
     ]

packages/gui/.browserslistrc

@@ -1,3 +1,6 @@
-last 3 versions
-Safari >= 8
-iOS >= 8
+Chrome >= 63
+Edge >= 15
+Firefox >= 57
+Safari >= 11
+Android >= 63
+iOS >= 11

packages/gui/package.json

@@ -14,6 +14,7 @@
     "default": "./dist/scratch-gui.js"
   },
   "scripts": {
+    "analyze": "cross-env ANALYZE=1 pnpm build",
     "build:types": "tsc --project ./tsconfig.dts.json",
     "build": "pnpm run clean && pnpm run build:types && webpack --color --bail",
     "clean": "rimraf ./build && mkdirp build && rimraf ./dist && mkdirp dist",
@@ -38,17 +39,16 @@
     "clipcc-paint": "workspace:~",
     "clipcc-render": "workspace:~",
     "clipcc-storage": "workspace:~",
-    "clipcc-svg-renderer": "workspace:~",
+    "clipcc-svg-renderer": "2.5.49",
     "clipcc-vm": "workspace:~",
     "computed-style-to-inline-style": "3.0.0",
-    "core-js": "2.5.7",
+    "copy-webpack-plugin": "^14.0.0",
+    "css-loader": "6.7.3",
     "dapjs": "2.3.0",
-    "es6-object-assign": "1.1.0",
     "fastestsmallesttextencoderdecoder": "^1.0.22",
     "get-float-time-domain-data": "0.1.0",
     "get-user-media-promise": "1.1.4",
     "immutable": "5.1.5",
-    "intl": "1.2.5",
     "js-base64": "2.4.9",
     "keymirror": "0.1.1",
     "lodash.bindall": "4.4.0",
@@ -76,7 +76,6 @@
     "react-virtualized": "9.20.1",
     "redux": "3.7.2",
     "redux-throttle": "0.1.1",
-    "scratch-render-fonts": "1.0.252",
     "startaudiocontext": "1.2.1",
     "to-style": "1.3.3",
     "wav-encoder": "1.3.0",
@@ -90,9 +89,6 @@
     "@babel/cli": "7.28.6",
     "@babel/core": "7.29.0",
     "@babel/eslint-parser": "7.28.6",
-    "@babel/plugin-proposal-object-rest-spread": "7.14.7",
-    "@babel/plugin-syntax-dynamic-import": "7.2.0",
-    "@babel/plugin-transform-async-to-generator": "7.14.5",
     "@babel/preset-env": "7.29.2",
     "@babel/preset-react": "7.14.5",
     "@babel/preset-typescript": "^7.28.5",
@@ -116,7 +112,7 @@
     "chromedriver": "146.0.1",
     "copy-webpack-plugin": "^14.0.0",
     "cross-fetch": "^3.1.8",
-    "css-loader": "6.7.3",
+    "css-minimizer-webpack-plugin": "^8.0.0",
     "enzyme": "3.11.0",
     "enzyme-adapter-react-16": "1.15.7",
     "eslint": "^9.39.2",
@@ -127,6 +123,12 @@
     "eslint-plugin-react": "7.37.5",
     "globals": "^16.5.0",
     "html-webpack-plugin": "^5.6.6",
+    "image-minimizer-webpack-plugin": "^5.0.0",
+    "imagemin": "^9.0.1",
+    "imagemin-gifsicle": "^7.0.0",
+    "imagemin-jpegtran": "^8.0.0",
+    "imagemin-optipng": "^8.0.0",
+    "imagemin-svgo": "^12.0.0",
     "jest": "catalog:",
     "jest-environment-jsdom": "^30.3.0",
     "jest-junit": "7.0.0",
@@ -139,14 +141,14 @@
     "raf": "3.4.1",
     "react-test-renderer": "16.2.0",
     "redux-mock-store": "1.5.3",
-    "regenerator-runtime": "0.14.1",
     "rimraf": "2.7.1",
     "rule-inheritance-webpack-plugin": "^0.4.0",
     "selenium-webdriver": "3.6.0",
     "style-loader": "^4.0.0",
     "terser-webpack-plugin": "^5.3.17",
     "typescript": "catalog:",
     "webpack": "catalog:",
+    "webpack-bundle-analyzer": "^5.2.0",
     "webpack-cli": "^6.0.1",
     "webpack-dev-server": "^5.2.3",
     "yauzl": "2.10.0"

packages/gui/src/components/connection-modal/update-peripheral-step.jsx

@@ -1,4 +1,3 @@
-import 'regenerator-runtime/runtime';
 import {FormattedMessage} from 'react-intl';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';

packages/gui/src/index.js

@@ -2,16 +2,14 @@ import GUI from './containers/gui.tsx';
 import AppStateHOC from './lib/app-state-hoc.tsx';
 import GuiReducer, {guiInitialState, guiMiddleware, initEmbedded, initFullScreen, initPlayer} from './reducers/gui';
 import LocalesReducer, {localesInitialState, initLocale} from './reducers/locales';
-import {ScratchPaintReducer} from 'clipcc-paint';
 import {setFullScreen, setPlayer} from './reducers/mode';
 import {remixProject} from './reducers/project-state';
 import {setAppElement} from 'react-modal';
 import totallyNormalStrings from './lib/l10n.js';
 
 const guiReducers = {
     locales: LocalesReducer,
-    scratchGui: GuiReducer,
-    scratchPaint: ScratchPaintReducer
+    scratchGui: GuiReducer
 };
 
 export {

packages/gui/src/lib/type-traits.ts

@@ -1 +1,7 @@
+import type {Reducer} from 'redux';
+
 export type PropsOf<C> = C extends React.ComponentType<infer P> ? P : never;
+
+export type ReducerMap<S extends object> = {
+    [P in keyof S]: Reducer<S[P]>;
+};

packages/gui/src/playground/index.jsx

@@ -1,9 +1,3 @@
-// Polyfills
-import 'es6-object-assign/auto';
-import 'core-js/fn/array/includes';
-import 'core-js/fn/promise/finally';
-import 'intl'; // For Safari 9
-
 import React from 'react';
 import ReactDOM from 'react-dom';
 
@@ -22,19 +16,6 @@ const appTarget = document.createElement('div');
 appTarget.className = styles.app;
 document.body.appendChild(appTarget);
 
-if ('serviceWorker' in navigator) {
-    window.addEventListener('load', () => {
-        navigator.serviceWorker.register('/service-worker.js').then(registration => {
-            // eslint-disable-next-line no-console
-            console.log('SW registered: ', registration);
-        })
-            .catch(registrationError => {
-            // eslint-disable-next-line no-console
-                console.log('SW registration failed: ', registrationError);
-            });
-    });
-}
-
 if (supportedBrowser()) {
     // require needed here to avoid importing unsupported browser-crashing code
     // at the top level