Utilizziamo la libreria PHP Minifier per comprimere file CSS e JAVASCRIPT e rendere più veloce il nostro sito web.
In presenza di elevato traffico simultaneo sul sito web, occorre mettere in atto ogni accorgimento utile a ridurre il carico di lavoro del server e quindi a ridurre il tempo di apertura delle pagine. In questo articolo ci occupiamo di come ridurre il peso dei file CSS e JAVASCRIPT, riducendoli ai minimi termini, eliminando i capo riga, gli inutili spazi, i commenti...
Per raggiungere questo obiettivo utilizzeramo una libreria già pronta all'uso: Minify, scritta da Matthias Mullie.
Installazione della libreria Minify
Per prima cosa scarichiamo la libreria Minify dal repository di GitHub in formato ".zip". Dezippa la cartella e, così com'è, spostala nello spazio web del tuo sito.
Per utilizzare questa libreria dovete scaricare anche una dipendenza, Path Converter, che scarichiamo sempre in formato ".zip". Dezippa e spostala nel tuo spazio web.
Includi la libreria, e la dipenza scariata, nel tuo PHP file, usando "require_once". La variabile "$path" rappresenta il percorso alla cartella che contiene la libreria Minify e la sua dipendenza Path Converter
<?php
.........
$path = '/path/to/library';
require_once $path.'/minify/src/Minify.php';
require_once $path.'/minify/src/CSS.php';
require_once $path.'/minify/src/JS.php';
require_once $path.'/minify/src/Exception.php';
require_once $path.'/minify/src/Exceptions/BasicException.php';
require_once $path.'/minify/src/Exceptions/FileImportException.php';
require_once $path.'/minify/src/Exceptions/IOException.php';
require_once $path.'/path-converter/src/ConverterInterface.php';
require_once $path.'/path-converter/src/Converter.php';
...........
?>Bene, siete pronti ad utilizzare Minify. Vediamo come utilizzare questa libreria per minimizzare file Javascript e Css
Minimizzare file JAVASCRIPT
Nel nostro file php, dopo avere incluso la libreria, vediamo come operare per ottenere un un file javascript minimizzato partendo da uno o più file javascript.
"$sourcePath" rappresenta il path al file da minimizzare. Nel caso volessimo creare un file minimizzato, partendo da più file javscript, è possibile aggiungere più files ($sourcePath2, $sourcePath3...), come potete vedere nell'esempio.
E' anche possibile aggiungere direttamente del codice js, invece che includere un file.
Salviamo il file minimizzato oppure presentiamo a video il codice ottenuto.
use MatthiasMullie\Minify;
// il path al file css che vuoi minimizzare
$sourcePath = '/path/to/firstfile.js';
$minifier = new Minify\JS($sourcePath);
// se vuoi aggiungere altri file css da minimizzare, ripeti questa funzione per ogni file da elaborare
$sourcePath2 = '/path/to/secondfile.js';
$minifier->add($sourcePath2);
// se vuoi aggiungere direttamente il codice javascript da minimizzare
$codicejs = 'var pippo=1';
$minifier->add($codicejs);
// salviamo l'output ottenuto in un nuovo file
$minifiedPath = '/path/to/minified_file.js';
$minifier->minify($minifiedPath);
// oppure visualizza a video l'output
echo $minifier->minify();Nota: se stai utilizzando la libreria all'interno di una funzione, devi porre "use MatthiasMullie\Minify;" al di fuori della funzione.
Minimizzare file CSS
Per minimizzare uno o più file css, la procedura è praticamente la medesima, con alcune differenze che possiamo vedere in questo esempio
use MatthiasMullie\Minify;
// il path al file css che vuoi minimizzare
$sourcePath = '/path/to/firstfile.css';
$minifier = new Minify\CSS($sourcePath);
// se vuoi aggiungere altri file css da minimizzare, ripeti questa funzione per ogni file da elaborare
$sourcePath2 = '/path/to/secondfile.css';
$minifier->add($sourcePath2);
// se vuoi aggiungere direttamente il codice javascript da minimizzare
$codicecss = 'body {color:#000000;text:#ffffff;}';
$minifier->add($codicecss);
// salviamo l'output ottenuto in un nuovo file
$minifiedPath = '/path/to/minified_file.css';
$minifier->minify($minifiedPath);
// oppure visualizza a video l'output
echo $minifier->minify();Per ulteriori dettagli sull'utilizzo della libreria, visita il progetto su GitHub
Esistono altre librerie che si occupano di minimizzare file css e js, anche più efficienti, come ad esempio la libreria SQUEEZE, forse la più utilizzata per compressione di file javascript. Si rimanda per questo ad altri articoli.
That's all!
Potrebbe interessarti
- YUI Compressor: minimizzare i file CSS e Javascript
- Grunt: come minimizzare file css e javascript, ed ottimizzare le immagini
- Gulp: come minimizzare file css e javascript, compilare file scss, ed ottimizzare le immagini.
- Utilizziamo Squeeze, la più famosa libreria PHP per comprimere file JAVASCRIPT e rendere quindi più veloce il nostro sito web.
