Générateur de configuration du plugin de compression Webpack
Générez un extrait webpack.config.js prêt pour la production avec précompression GZIP et Brotli via compression-webpack-plugin. Configurez les niveaux de compression, le seuil, le minRatio et les motifs de ressources — puis copiez la configuration, installez le plugin et récupérez les directives de service Nginx correspondantes. S'exécute entièrement dans votre navigateur — sans inscription.
Configure GZIP and Brotli pre-compression for your webpack build and generate a production-ready webpack.config.jssnippet using compression-webpack-plugin. All generation runs locally in your browser.
Best compression - slowest build
Maximum - slowest build
Skip assets smaller than this size
Skip if compressed/original > this ratio (0.8 = skip if <20% savings)
Regex to match assets to compress
Pourquoi utiliser notre générateur de configuration du plugin de compression Webpack ?
Voici les principaux avantages de l'outil.
- Configuration de compression Webpack instantanée : configurez le niveau GZIP, la qualité Brotli, le seuil, le minRatio et les motifs de ressources — le générateur produit instantanément un extrait webpack.config.js complet.
- Générateur de configuration Webpack en ligne sécurisé : toute la génération de configuration s'exécute dans votre navigateur. Aucun détail de projet, chemin de fichier ou donnée de configuration n'est envoyé où que ce soit — totalement privé et fonctionne hors ligne.
- GZIP + Brotli + extrait de service Nginx : générez les plugins de compression GZIP seul, Brotli seul ou les deux dans une même configuration — ainsi que les directives Nginx gzip_static et brotli_static correspondantes pour servir les fichiers précompressés.
- 100 % gratuit pour toujours : générez des configurations de compression webpack pour autant de projets que nécessaire, entièrement gratuitement. Sans compte, sans abonnement, sans limites et sans publicité.
Qu'est-ce que le plugin de compression Webpack ?
Le plugin de compression Webpack (compression-webpack-plugin) est un plugin webpack qui précompresse la sortie de votre build au moment de la compilation, en créant des fichiers .gz et .br à côté des ressources d'origine. Lorsque votre serveur web est configuré pour servir ces fichiers précompressés (via gzip_static on dans Nginx), cela élimine le coût CPU par requête de la compression à la volée. Notre générateur de configuration gratuit produit un extrait webpack.config.js complet et prêt pour la production — le tout généré localement dans votre navigateur, sans inscription.
Comment fonctionne notre générateur de configuration du plugin de compression Webpack
Voici les trois étapes.
- Configurez vos options : sélectionnez les algorithmes GZIP, Brotli ou les deux. Réglez les niveaux de compression, le seuil, le minRatio, le motif de ressources et le format de module via les contrôles interactifs.
- Générez instantanément : cliquez sur « Générer la configuration » — le générateur produit un extrait webpack.config.js complet avec les bonnes instances de plugin, entièrement dans votre navigateur.
- Copiez et déployez : installez le plugin, ajoutez l'extrait à votre configuration webpack, lancez votre build et configurez votre serveur web pour servir les fichiers précompressés à l'aide de l'extrait Nginx inclus.
Ce que contient la configuration générée
Voici les éléments générés.
- Instances CompressionPlugin : une pour GZIP (algorithm: 'gzip') et/ou une pour Brotli (algorithm: 'brotliCompress') avec les niveaux et options configurés.
- Seuil et minRatio : évitez de compresser les ressources trop petites ou qui ne se compressent pas assez pour justifier le surcoût.
- Motif de ressources : une expression régulière qui ne correspond qu'aux types de fichiers dignes d'être compressés — JS, CSS, HTML, SVG, JSON et WOFF2 par défaut.
- Extrait de service Nginx : les directives gzip_static et brotli_static correspondantes pour servir les fichiers précompressés depuis votre serveur web.
Précompression ou compression à la volée
La compression à la volée (par ex. Nginx gzip on) compresse chaque réponse au moment de la requête — ajoutant du coût CPU et de la latence. La précompression avec le plugin de compression Webpack compresse les ressources une fois au moment du build, le serveur ne fait donc que lire et servir le fichier précompressé, avec zéro coût CPU par requête. Pour les ressources statiques à fort trafic, la précompression est toujours préférable. Le générateur de configuration du plugin de compression Webpack permet d'ajouter facilement la précompression à tout projet basé sur webpack.
Foire aux questions
Un générateur de configuration du plugin de compression Webpack produit un extrait webpack.config.js prêt à l'emploi qui ajoute la précompression GZIP et/ou Brotli à votre build webpack via le paquet compression-webpack-plugin. Configurez les niveaux de compression, le seuil, le minRatio et les motifs de ressources — le générateur produit instantanément les bonnes instances de plugin. Notre générateur en ligne gratuit s'exécute entièrement dans votre navigateur, sans inscription.
La compression à la volée (par ex. Nginx gzip on) compresse chaque réponse HTTP au moment de la requête, ce qui ajoute du coût CPU et de la latence. La précompression avec le plugin de compression Webpack compresse les ressources une seule fois au moment du build — le serveur ne fait que lire et servir le fichier .gz ou .br précompressé, sans coût CPU par requête. Pour les ressources statiques à fort trafic, la précompression est toujours préférable.
Oui. Le générateur de configuration du plugin de compression Webpack s'exécute entièrement dans votre navigateur — toute la génération de configuration se fait localement en JavaScript. Aucun détail de projet, chemin de fichier ou donnée de configuration n'est envoyé à un serveur. Vos réglages ne quittent jamais votre appareil.
Oui. Le générateur de configuration du plugin de compression Webpack est 100 % gratuit, sans inscription, sans abonnement et sans limites. Générez des configurations pour autant de projets que nécessaire.
Oui — le plugin de compression Webpack crée les fichiers .gz et .br au moment du build, mais votre serveur web doit être configuré pour les servir. Pour Nginx, ajoutez gzip_static on pour GZIP et brotli_static on pour Brotli (nécessite le module ngx_brotli). Pour Apache, utilisez mod_deflate avec service de fichiers précompressés. Le générateur inclut l'extrait Nginx dans les résultats.
Pour GZIP, le niveau 9 est recommandé en précompression statique, car le coût CPU n'est payé qu'une fois au build. Pour Brotli, la qualité 11 atteint la compression maximale — généralement 20 à 26 % meilleure que GZIP niveau 9. Pour les pipelines CI/CD où le temps de build compte, utilisez GZIP niveau 6 et Brotli qualité 6 pour équilibrer taux de compression et vitesse de build.
L'option threshold (en octets) indique au plugin d'ignorer la compression des ressources plus petites que la taille spécifiée. La valeur par défaut de 10 240 octets (10 Ko) est un bon point de départ — compresser de très petits fichiers ajoute du surcoût sans économie significative. Augmentez cette valeur pour ignorer davantage de petits fichiers, ou mettez-la à 0 pour tout compresser.
L'option minRatio indique au plugin de ne pas créer de fichier compressé si le taux de compression n'est pas suffisant. Un minRatio de 0,8 signifie : ne créer le fichier compressé que s'il représente au maximum 80 % de la taille d'origine (soit au moins 20 % d'économie). Mettez-le à 1 pour toujours créer des fichiers compressés, ou baissez-le pour exiger une meilleure compression.
Oui. Pour Create React App, utilisez react-app-rewired ou CRACO pour personnaliser la configuration webpack. Pour Angular CLI, utilisez @angular-builders/custom-webpack. Pour Vue CLI, ajoutez le plugin dans vue.config.js sous configureWebpack. Le générateur produit une configuration CompressionPlugin standard qui fonctionne avec tout outil de build basé sur webpack.