Hi I am using Vue. But after installing inertia with Vue I got a really big size of js. How to optimize?

[JenuelDev]

So I created a very simple basic project. But it seems I get a big transfer size.

I did code splitting, and followed what it says on the docs. But I am wondering how can we optimize this files, so that it will be lesser file size. I'm hoping to get at least 1MB or less transferred size.

here is my app js

import { createApp, h } from 'vue'
import { createInertiaApp } from '@inertiajs/inertia-vue3'
import { InertiaProgress } from '@inertiajs/progress'

InertiaProgress.init({
    // The delay after which the progress bar will
    // appear during navigation, in milliseconds.
    delay: 250,

    // The color of the progress bar.
    color: '#29d',

    // Whether to include the default NProgress styles.
    includeCSS: true,

    // Whether the NProgress spinner will be shown.
    showSpinner: false,
})

createInertiaApp({
    resolve: name => import(`./Pages/${name}`),
    setup({ el, App, props, plugin }) {
        createApp({ render: () => h(App, props) })
            .use(plugin)
            .mount(el)
    },
})

[Tofandel]

You left out the most important factor in your question. How are you building your app and what is this injected.js file?

Also if you want to check your build size, do it in production mode, dev mode doesn't tree shake for a faster build

[JenuelDev]

sory about this, I did not came back to update... I actualy figured out how to optimize it.. it same with vuejs.