tsParticles has worse performance on live-server

Question

I am currently stuck and unable to locate the error. After building my react application containing the react-tsParticles package, I noticed a immense worse performance after publishing it on my nginx-based webserver. While in local development performance is fine, but the performance when visiting the live page is bad and not comparable to other examples on the internet.

I am not interested in advertising my page, but this is the link to it. The Code can be found here on Github.

Any advice is appreciated :)

Answer 1

If anyone comes across this in 2024 and you are using react-vite project, using browserlist etc. won't help much I tried everything. what worked for me is to change vite.config file and using chunking stragery it impacts how node_modules are bundled and served.

 build: {
    rollupOptions: {
      output: {
        manualChunks(id) {
          if (id.includes("node_modules")) {
            return "vendor";
          }
        },
      },
    },
  },

Answer 2

I had this problem too

there is a problem with the build tool or bundle file that occurs when using the npm run build command.

also may be solved by changing the browserslist in package.json.

you can refer to this answer : https://stackoverflow.com/a/70625114/8730051