mirror of
https://github.com/jellyfin/jellyfin-vue.git
synced 2025-06-14 10:02:55 +00:00
cf82a146ae
Code-split the application (but without lazy loading, aka dynamic imports aka async modules, so all the assets are loaded on app load, not when requested: this is needed for ensuring an smooth experience over slow networks) Lighthouse performance score went from 66 to 77 There's still a lot of work to do, but this is a good start. Signed-off-by: Fernando Fernández <ferferga@hotmail.com>
45 lines
1.3 KiB
TypeScript
45 lines
1.3 KiB
TypeScript
import type { Plugin } from 'vite';
|
|
|
|
/**
|
|
* Creates the Rollup's chunking strategy of the application (for code-splitting)
|
|
*/
|
|
export function JellyfinVueChunking(): Plugin {
|
|
return {
|
|
name: 'Jellyfin_Vue:chunking',
|
|
config: () => ({
|
|
build: {
|
|
rollupOptions: {
|
|
output: {
|
|
/**
|
|
* This is the first thing that should be debugged when there are issues
|
|
* withe the bundle. Check these issues:
|
|
* - https://github.com/vitejs/vite/issues/5142
|
|
* - https://github.com/evanw/esbuild/issues/399
|
|
* - https://github.com/rollup/rollup/issues/3888
|
|
*/
|
|
manualChunks(id) {
|
|
const match = /node_modules\/([^/]+)/.exec(id)?.[1];
|
|
|
|
if (id.includes('virtual:locales') || ((id.includes('vuetify') || id.includes('date-fns')) && id.includes('locale'))) {
|
|
return 'localization/meta';
|
|
}
|
|
|
|
if (id.includes('@intlify/unplugin-vue-i18n/messages')
|
|
) {
|
|
return 'localization/messages';
|
|
}
|
|
|
|
/**
|
|
* Split each vendor in its own chunk
|
|
*/
|
|
if (match) {
|
|
return `vendor/${match.replace('@', '')}`;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
})
|
|
};
|
|
}
|