How to handle videos properly with Vite and React?

Question

I migrated my React app to a Vite project. I have a video that used to start immediately before using Vite. Now, it takes at least 10 seconds after the page has finished loading before it starts.

<video
     autoPlay
     playsInline
     muted
     loop
     controls={false}
     poster="./test.jpg"
     >
     <source src={videoLogo} type="video/mp4" />
     Your browser does not support the video tag
</video>

This is the vite.config.mts

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import svgr from "vite-plugin-svgr";
// import svgLoader from "vite-svg-loader";
import dns from "dns";
// localhost part
dns.setDefaultResultOrder("verbatim");
export default defineConfig({
  base: "/",

  server: {
    open: true,
    port: 3000,
  },
  define: {
    "process.env": {},
    global: "globalThis",
  },
  build: {
    outDir: "build",
  },
  plugins: [
    react({
      jsxImportSource: "@emotion/react",
      babel: {
        plugins: ["@emotion/babel-plugin"],
      },
    }),
    svgr(),

  ],
  resolve: {
    alias: {
      // Configura gli alias se necessario
    },
    extensions: [".mjs", ".js", ".mts", ".ts", ".jsx", ".tsx", ".json"],
  },
});

The version of Vite is v5.0.10. The version of React is v17.0.1.

Is there a way to load my video before the page is fully loaded? I would like the video to start automatically as soon as the page is rendered. Is there something I missed? Is there a correct setup or a plugin for Vite that can help with this? Thanks