mirror of
https://github.com/Psychotoxical/psysonic.git
synced 2026-07-21 23:05:46 +00:00
Frank Stellmacher
aa0776e811
Cold-start bundle was a single 1.88 MB / 577 KB-gzipped chunk that
parsed every page in the app before first paint, including pages a
typical session never opens.
Two-part fix:
1. Lazy-load 10 rarely-visited pages via React.lazy() — each becomes
its own chunk that only downloads when the route is hit:
Settings, Statistics, Help, WhatsNew, DeviceSync, OfflineLibrary,
LabelAlbums, AdvancedSearch, FolderBrowser, InternetRadio.
Whole <Routes> tree is wrapped in <Suspense fallback={null}> — no
visible loading state, the browser cache hits on subsequent visits.
2. Vite manualChunks splits dependencies that change rarely from app
code: react/react-dom/react-router, the @tauri-apps/* family, and
i18next. Tauri auto-updater pulls smaller deltas when only app
code changed (vendor chunks stay byte-identical and cached).
Build output:
Before: 1.88 MB / 577 KB gz monolithic
After cold start: ~450 KB gz (index 370 + react 54 + tauri 6 + i18n 20)
= 22% smaller initial download
Plus 11 lazy chunks. Notably WhatsNew's bundled CHANGELOG (215 KB /
76 KB gz) is now off the cold-start path entirely.
Co-authored-by: Psychotoxical <dev@psysonic.app>
Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
52 lines
1.4 KiB
TypeScript
52 lines
1.4 KiB
TypeScript
/// <reference types="node" />
|
|
import { defineConfig } from "vite";
|
|
import react from "@vitejs/plugin-react";
|
|
|
|
const host = process.env.TAURI_DEV_HOST;
|
|
|
|
export default defineConfig({
|
|
plugins: [react()],
|
|
clearScreen: false,
|
|
server: {
|
|
port: 1420,
|
|
strictPort: true,
|
|
host: host || false,
|
|
hmr: host
|
|
? {
|
|
protocol: "ws",
|
|
host,
|
|
port: 1421,
|
|
}
|
|
: undefined,
|
|
watch: {
|
|
ignored: ["**/src-tauri/**"],
|
|
},
|
|
},
|
|
envPrefix: ["VITE_", "TAURI_ENV_*"],
|
|
build: {
|
|
target: process.env.TAURI_ENV_PLATFORM === "windows" ? "chrome105" : "safari13",
|
|
minify: !process.env.TAURI_ENV_DEBUG ? "esbuild" : false,
|
|
sourcemap: !!process.env.TAURI_ENV_DEBUG,
|
|
rollupOptions: {
|
|
output: {
|
|
// Vendor chunks isolate dependencies that change rarely from app code,
|
|
// so a normal app update doesn't invalidate the cached vendor bundles
|
|
// (helps especially with the Tauri updater pulling deltas).
|
|
manualChunks: {
|
|
react: ["react", "react-dom", "react-router-dom"],
|
|
tauri: [
|
|
"@tauri-apps/api",
|
|
"@tauri-apps/plugin-shell",
|
|
"@tauri-apps/plugin-dialog",
|
|
"@tauri-apps/plugin-fs",
|
|
"@tauri-apps/plugin-process",
|
|
"@tauri-apps/plugin-store",
|
|
"@tauri-apps/plugin-updater",
|
|
],
|
|
i18n: ["i18next", "react-i18next"],
|
|
},
|
|
},
|
|
},
|
|
},
|
|
});
|