Jednym ze sposob??w na optymalizacje ilo??ci request??w do strony, oraz zmniejszenie ilo??ci przesy??anych danych z serwera jest ??Ä?czenie i kompresowanie plik??w ze skryptami java script. Jest to mo??liwe gdy przeglÄ?darka obs??uguje taki format skompresowanych plik??w js.
Musimy postÄ?powaÄ? w trzech krokach. Pierwszy z nich polega na utworzeniu regu?? w pliku .htaccess by przekierowywaÄ? js na pliki js.gz, gdy przeglÄ?darka obs??uguje kompresje gzip. Natomiast kolejny krok polega na utworzeniu zbioru archiw??w naszych skrypt??w by obni??yÄ? wielko??Ä? transferu. Na dok??adkÄ? mo??emy po??Ä?czyÄ? wszystkie g????wne skrypty, kt??re ??adujÄ? siÄ? na ka??dej stronie w jedno du??e archiwum.
By wyszukaÄ? wszystkie pliki js i skompresowaÄ? je wystarczy ??e u??yjemy prostej pÄ?tli for
for file in `find js -type f \( -name \*.js \)`; do echo -ne "Generating $file.gz\n\r" gzip -c -f $file > $file.gz done |
W zbiorze na kt??rym dzia??a pÄ?tla wywo??ujemy polecenie find i wyszukujemy wszystki plik??w katalogu zdefiniowanym na sztywno ( w naszym przypadku js/ )
By po??Ä?czyÄ? g????wne skrypty w jedno du??e archiwum pos??u??ymy siÄ? listÄ? plik??w zapisanÄ? w pliku tekstowym, z kt??rej bÄ?dziemy odczytywaÄ? linia po linii kolejne pliki do po??Ä?czenia.
#!/bin/bash if [ "$1" = "--help" ]; then echo -ne " " else if [ -n "$2" ]; then outputfile="js/merged/$2" echo -ne "--merging files -- \n\r" jslist="$1.txt" if [ -f "$jslist" ]; then index=0 if [ -f "$outputfile" ]; then echo -ne "Deleting existing merged file\n\r" unlink $outputfile else touch $outputfile fi while read line ; do #MYARRAY[$index]="$line" echo -ne "Merging: $line \n\r" if [ -f "$line" ]; then cat $line >> $outputfile else echo -ne "ERROR: File $line does not exists\n\r" fi index=$(($index+1)) done < $jslist gzip -fc $outputfile > $outputfile.gz echo -ne "SUCCESS: Generated: $outputfile.gz \n\r" else echo -ne "ERROR" exit fi else echo -ne "ERROR: Parameter expected try --help to get help" fi fi |
Kroki algorytmu:
- Sprawdzamy czy user wpisa?? –help. Je??eli tak to wy??wietlamy pomoc. W przeciwnym wypadku id?? do kroku 2.
- Definiujemy plik wyj??ciowy oraz listÄ? plik??w do po??Ä?czenia
- Je??eli istnieje plik z listÄ? przejd?? do kroku 4. W przeciwnym wypadku wy??wietl b??Ä?d.
- Je??eli istnieje plik wyj??ciowy to usu?? plik w przeciwnym wypadku utw??rz pusty plik wyj??ciowy.
- Dop??ki read line z pliku $jslist, to je??eli plik ??r??d??owy istnieje, to jego zawarto??Ä? przeka?? do pliku wyj??ciowego. W przeciwnym wypadku wy??wietl b??Ä?d
- Spakuj plik wyj??ciowy
Konfiguracja .htaccess
By zmniejszyÄ? transfer mo??emy wymusiÄ? na apache’u aby wysy??a?? pliki js skompresowane, je??eli przeglÄ?darka akceptuje skompresowane javascripty.
<IfModule mod_headers.c> <FilesMatch "\.js.gz$"> ForceType text/javascript Header set Content-Encoding: gzip </FilesMatch> </IfModule> <IfModule mod_rewrite.c> RewriteCond %{HTTP:Accept-Encoding} gzip RewriteCond %{REQUEST_URI} \.js$ RewriteCond %{REQUEST_FILENAME}.gz -f RewriteRule (.*)$ $1\.gz [L,QSA] </IfModule>
DziÄ?ki wielkie za dostarczone informacje, dziÄ?ki nim uda??o mi siÄ? zoptymalizowaÄ? ilo??Ä? odwo??a do JSa na stronie. W Google Page Speed uda??o mi siÄ? przeskoczyÄ? o 8 oczek w g??rÄ?. BÄ?dÄ? wraca?? do twojego sposobu przy kolejnych wdro??eniach.
Nie ma sprawy