Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add vite-plugin-compression for asset compression in production builds #53

Open
4 tasks
karthic-keyan opened this issue Sep 8, 2024 · 1 comment
Open
4 tasks
Labels
enhancement New feature or request

Comments

@karthic-keyan
Copy link

Summary

To improve the performance of our Electron-based project, we should add the vite-plugin-compression plugin to compress static assets (JavaScript, CSS, etc.) during production builds.

This will help reduce the size of the assets sent to clients, improving load times and overall performance.

Tasks

  1. Install vite-plugin-compression as a dev dependency:

    npm install vite-plugin-compression --save-dev
  2. Configure the plugin in vite.config.ts:

    import viteCompression from 'vite-plugin-compression';
    
    export default defineConfig({
      plugins: [
        viteCompression({
          algorithm: 'brotliCompress',  // You can choose 'gzip' as well
          ext: '.br',                   // or '.gz' for gzip
          threshold: 10240,             // Compress files larger than 10kb
          deleteOriginFile: false       // Keep original uncompressed files
        })
      ]
    });
  3. Update the README.md to include information about vite-plugin-compression and how it's used to compress assets.

  4. Test the build process by running:

    npm run build
  5. Ensure that compressed files (.br or .gz) are created in the dist folder.

Acceptance Criteria

  • vite-plugin-compression is installed as a dev dependency.
  • vite.config.ts is updated to include compression for production builds.
  • Documentation in README.md is updated.
  • Successful build with compressed assets.
@codinginbarn
Copy link

I do not find the "vite.config.ts". Only see:

image

Rookie Electron user and interested in Vite :)

@LuanRoger LuanRoger added the enhancement New feature or request label Oct 1, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

3 participants