Passer au contenu principal

Plug-in de minification 25.11

Ouvrir dans ChatGPT

Le plug-in de minification webforJ minifie et optimise automatiquement les ressources CSS et JavaScript pendant le processus de compilation. Il détecte les ressources référencées par les annotations de ressources webforJ et les minifie dans le résultat de compilation, réduisant ainsi la taille des fichiers et améliorant les temps de chargement, sans modifier vos fichiers source d’origine.

La minification est intégrée au bundler

Le bundler frontend minifie les fichiers CSS et JavaScript lors de sa compilation de production. Un projet qui utilise le bundler n’a donc pas besoin de ce plug-in. Le plug-in reste disponible et pris en charge pour les projets qui chargent des ressources au moyen des annotations de ressources sans utiliser le bundler. Les configurations existantes continuent de fonctionner comme avant, sans modification nécessaire.

Configuration​

La configuration du minificateur nécessite deux éléments : un processeur d’annotations pour détecter les ressources pendant la compilation et un plug-in pour effectuer la minification.

Ajoutez ce qui suit à votre pom.xml :

<build>
<plugins>
<!-- Configuration du processeur d'annotations -->
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<configuration>
<annotationProcessorPaths>
<path>
<groupId>com.webforj</groupId>
<artifactId>webforj-minify-foundation</artifactId>
<version>${webforj.version}</version>
</path>
</annotationProcessorPaths>
</configuration>
</plugin>

<!-- Configuration du plug-in de minification -->
<plugin>
<groupId>com.webforj</groupId>
<artifactId>webforj-minify-maven-plugin</artifactId>
<version>${webforj.version}</version>
<executions>
<execution>
<goals>
<goal>minify</goal>
</goals>
</execution>
</executions>
<dependencies>
<!-- Minification CSS -->
<dependency>
<groupId>com.webforj</groupId>
<artifactId>webforj-minify-phcss-css</artifactId>
<version>${webforj.version}</version>
</dependency>
<!-- Minification JavaScript -->
<dependency>
<groupId>com.webforj</groupId>
<artifactId>webforj-minify-closure-js</artifactId>
<version>${webforj.version}</version>
</dependency>
</dependencies>
</plugin>
</plugins>
</build>

Utilisation du plug-in​

Une fois configuré, le plug-in fonctionne automatiquement. Il vous suffit d’utiliser les annotations de ressources webforJ dans votre code :

package com.example;

import com.webforj.annotation.StyleSheet;
import com.webforj.annotation.JavaScript;

@StyleSheet("ws://css/app.css")
@JavaScript("ws://js/app.js")
public class MyApp extends App {
// Code de votre application
}

Lors de la compilation de votre projet, le plug-in effectue automatiquement les opérations suivantes :

  1. Détecte les ressources référencées dans les annotations pendant la compilation
  2. Minifie les fichiers CSS et JavaScript détectés
  3. Indique la réduction de taille et le temps de traitement

Résolution des protocoles d’URL​

Le plug-in reconnaît les protocoles d’URL webforJ et les résout en chemins d’accès au système de fichiers :

ProtocoleRésolutionExemple
ws://src/main/resources/static/ws://css/app.css → static/css/app.css
context://src/main/resources/context://styles/app.css → styles/app.css

Les URL sans protocole ne sont pas prises en charge par le minificateur et sont ignorées.

Minificateurs intégrés​

webforJ inclut deux minificateurs prêts pour la production, pour CSS et JavaScript.

MinificateurFonctionnalitésFichiers ignorés
CSSSupprime les espaces et les commentaires, et optimise les valeurs des propriétés.min.css
JavaScriptRenommage des variables, élimination du code mort, optimisation de la syntaxe.min.js, .min.mjs

Options de configuration​

Le plug-in propose des options permettant de désactiver la minification, de personnaliser l’optimisation JavaScript et de traiter des fichiers supplémentaires.

Désactivation de la minification​

Vous pouvez désactiver la minification pendant le développement ou à des fins de débogage.

En ligne de commande :

mvn package -Dwebforj.minify.skip=true

Dans la configuration du plug-in :

<plugin>
<groupId>com.webforj</groupId>
<artifactId>webforj-minify-maven-plugin</artifactId>
<configuration>
<skip>true</skip>
</configuration>
</plugin>

Options du minificateur JavaScript​

Le minificateur JavaScript propose plusieurs options de configuration pour contrôler le comportement d’optimisation.

Prise en charge de Gradle

À partir de la version 25.12, le plug-in Gradle permet de transmettre des options au minificateur JavaScript.

OptionValeur par défautDescription
compilationLevelSIMPLE_OPTIMIZATIONS
  • WHITESPACE_ONLY - supprime uniquement les espaces et les commentaires
  • SIMPLE_OPTIMIZATIONS - renomme les variables et supprime le code mort
  • ADVANCED_OPTIMIZATIONS - optimisation agressive avec renommage des fonctions et des propriétés
languageInECMASCRIPT_NEXTVersion JavaScript en entrée : ECMASCRIPT3, ECMASCRIPT5, ECMASCRIPT_2015 à ECMASCRIPT_2021, ECMASCRIPT_NEXT
languageOutECMASCRIPT5Version JavaScript en sortie : mêmes valeurs que pour languageIn, plus NO_TRANSPILE
prettyPrintfalseDéfinissez cette option sur true pour conserver la mise en forme à des fins de débogage

Configurez ces options dans la section de configuration :

<plugin>
<groupId>com.webforj</groupId>
<artifactId>webforj-minify-maven-plugin</artifactId>
<version>${webforj.version}</version>
<configuration>
<minifierConfigurations>
<closureJs>
<compilationLevel>SIMPLE_OPTIMIZATIONS</compilationLevel>
<languageIn>ECMASCRIPT_2020</languageIn>
<languageOut>ECMASCRIPT5</languageOut>
<prettyPrint>false</prettyPrint>
</closureJs>
</minifierConfigurations>
</configuration>
<executions>
<execution>
<goals>
<goal>minify</goal>
</goals>
</execution>
</executions>
<dependencies>
<dependency>
<groupId>com.webforj</groupId>
<artifactId>webforj-minify-closure-js</artifactId>
<version>${webforj.version}</version>
</dependency>
</dependencies>
</plugin>

Minification de fichiers supplémentaires​

Pour minifier des fichiers qui n’ont pas été détectés par les annotations, créez un fichier de configuration indiquant des motifs glob :

src/main/resources/META-INF/webforj-minify.txt
# Motifs d'inclusion
**/*.css
**/*.js

# Motifs d'exclusion (préfixés par !)
!**/*.min.css
!**/*.min.js

Minificateurs personnalisés​

Le plug-in prend en charge les minificateurs personnalisés au moyen de l’interface Java Service Provider Interface (SPI). Vous pouvez ainsi ajouter la prise en charge d’autres types de fichiers ou utiliser d’autres bibliothèques de minification.

Création d’un minificateur personnalisé​

Implémentez l’interface AssetMinifier pour créer votre propre minificateur. L’exemple suivant présente un minificateur JSON qui utilise Gson pour supprimer les espaces :

src/main/java/com/example/minifier/JsonMinifier.java
package com.example.minifier;

import com.google.gson.Gson;
import com.google.gson.GsonBuilder;
import com.google.gson.JsonElement;
import com.google.gson.JsonSyntaxException;
import com.webforj.minify.common.AssetMinifier;
import com.webforj.minify.common.MinificationException;
import java.nio.file.Path;
import java.util.Map;
import java.util.Set;
import java.util.logging.Logger;

public class JsonMinifier implements AssetMinifier {

private static final Logger logger = Logger.getLogger(JsonMinifier.class.getName());
private final Gson gson = new GsonBuilder().create();

@Override
public String minify(String content, Path sourceFile) throws MinificationException {
try {
JsonElement element = gson.fromJson(content, JsonElement.class);
return gson.toJson(element);
} catch (JsonSyntaxException e) {
logger.warning("Malformed JSON in " + sourceFile + ", skipping: " + e.getMessage());
return content;
} catch (Exception e) {
throw new MinificationException("Failed to minify JSON file: " + sourceFile, e);
}
}

@Override
public Set<String> getSupportedExtensions() {
return Set.of("json");
}

@Override
public boolean shouldMinify(Path filePath) {
String filename = filePath.getFileName().toString();
// Ignorer les fichiers de configuration et les fichiers déjà minifiés
if (filename.equals("package.json") || filename.equals("tsconfig.json")) {
return false;
}
if (filename.endsWith("-lock.json") || filename.endsWith(".min.json")) {
return false;
}
return true;
}

@Override
public void configure(Map<String, Object> options) {
// Options de configuration, le cas échéant
}
}

Enregistrement de votre minificateur​

Créez un fichier de configuration de fournisseur de service :

src/main/resources/META-INF/services/com.webforj.minify.common.AssetMinifier
com.example.minifier.JsonMinifier

Utilisation de votre minificateur personnalisé​

Empaquetez votre minificateur dans un JAR séparé et ajoutez-le comme dépendance du plug-in :

<plugin>
<groupId>com.webforj</groupId>
<artifactId>webforj-minify-maven-plugin</artifactId>
<dependencies>
<dependency>
<groupId>com.example</groupId>
<artifactId>json-minifier</artifactId>
<version>1.0.0</version>
</dependency>
<!-- Minificateurs standard (facultatif) -->
<dependency>
<groupId>com.webforj</groupId>
<artifactId>webforj-minify-phcss-css</artifactId>
<version>${webforj.version}</version>
</dependency>
</dependencies>
</plugin>

Problèmes courants​

[WARN] No minifiers registered via SPI. Skipping minification.
[WARN] Ensure ph-css and/or closure-compiler are on the classpath.

Ajoutez les dépendances des modules de minification à la configuration du plug-in. Pour CSS, ajoutez webforj-minify-phcss-css. Pour JavaScript, ajoutez webforj-minify-closure-js.

Si le plug-in indique Processed 0 files, vérifiez que :

  1. Le processeur d’annotations est configuré dans maven-compiler-plugin, avec webforj-minify-foundation dans annotationProcessorPaths
  2. Des annotations de ressources webforJ sont présentes dans votre code source
  3. Le fichier target/classes/META-INF/webforj-resources.json existe après la compilation
[WARN] File not found: /path/to/static/css/app.css (referenced as 'ws://css/app.css')

Vérifiez que le fichier existe à l’emplacement correct sous src/main/resources/static et que le protocole de l’URL correspond à la structure des répertoires.

[WARN] Error minifying file /path/to/app.css: parse error at line 42

Le plug-in émet un avertissement, mais poursuit la compilation sans l’interrompre. En cas d’échec de la minification, le contenu d’origine est conservé. Pour corriger les erreurs de syntaxe, validez le CSS ou le JavaScript à l’aide d’un linter.


Continuez à apprendre.