[GUIDA] Ottenere punteggio 100/100 "Leverage Browser Caching" in Google Page Speed

marcocarrieri

Sono arrivato ad 86 qua il locale...
Pero ancora non ho attivato la compressione gzip e il fatto della cache delle immagini..
Ho tenuto l'installazione principale di XAMP...
Vedremo quando lo metto in internet quanto mi dara...

klyde

Io non riesco proprio a migliorare la velocità del mio sito, nonostante i tuoi consigli!!!! ho dato uno sguardo ai tool di Yslow ma non ci capisco nulla.

cardy

@klyde said:

Scusate l'assenza ma sono alle prese con un restyling di un portale turistico per cui il tempo per rispondere scarseggia in questo periodo...
Comunque che cosa non ti è chiaro? Dai inizia con il dirmi un punto non chiaro che partiamo da lì...

cardy

Per inciso,con un adeguata ottimizzazione, una pagina da 790k con 130 immagini e jquery si carica in 7 secondi. 94/100 con google page speed e 91/100 (A) con YSlow

redemption

Cardy, sapresti dirmi come ottimizzare un sito su aruba (non su dedicato)?

Sto testando il tema nuovo per pausaxn.it ecco i miei problemi:

[INDENT]Page Speed Score: 69/100
[Significant performance improvements are possible]

[Score: 19/100]

Leverage browser caching
[Score: 0/100]

Minimize DNS lookups
[Score: 47/100]

Minimize request size
[Score: 0/100]

Specify image dimensions
[Score: 0/100]

Parallelize downloads across hostnames
[Score: 79/100]

Avoid bad requests
[Score: 65/100]

Combine external CSS
[Score: 79/100]

Combine external JavaScript
[Score: 55/100]

Optimize the order of styles and scripts
[Score: 79/100]

Remove unused CSS
[Score: 0/100]

Serve static content from a cookieless domain
[Score: 0/100]

Use efficient CSS selectors
[/INDENT]
Grazie per il tempo.

cardy

@Redemption said:

Cardy, sapresti dirmi come ottimizzare un sito su aruba (non su dedicato)?

Sto testando il tema nuovo per pausaxn.it ecco i miei problemi:
[INDENT]Page Speed Score: 69/100
[Significant performance improvements are possible]

[Score: 19/100]
Non lo rilevo con il mio pagespeed

Leverage browser caching
[Score: 0/100]
**Questo è spiegato sopra... aggiungi la regola inserendo nel FileMatch le estensioni delle immagini, dei javascript e dei file flash
**
Minimize DNS lookups
[Score: 47/100]
Cerca di servire i files del sito dallo stesso dominio o cmq limita il numero di domini esterni (l'ideale sarebbe non + di 4 compreso il tuo)

Minimize request size
[Score: 0/100]
**Non lo rilevo cn il mio pagespeed
**
Specify image dimensions
[Score: 0/100]
Qui modifica il template e il codice html dei post... tutte le immagini devono avere l'altezza e la larghezza specificata
[HTML]<img width='50' height='100 src="immagine.ext" />[/HTML]

Parallelize downloads across hostnames
[Score: 79/100]
Questo è in parte in conflitto con quanto detto sopra...Poter scaricare i files da domini diversi porta all'aumento dei downloads in parallelo (con l'ultima versione di FF è 12 files alla volta). L'ideale sarebbe avere dei domini di 3° livello che ospitino i tuoi files. Ad esempio css[punto]tuodominio[punto]it x i css, images[punto]tuodominio[punto]it x le immagini e via dicendo...Essendo un dominio di 3° livello il lookup dei DNS è sempre a carico del tuo server, x cui se non si esagera può portare dei vantaggi (l'ideale è fare delle prove)

Avoid bad requests
[Score: 65/100]
Questo potrebbe dipendere da un url con troppi parametri passati con il GET.

Combine external CSS
[Score: 79/100]
Dove possibile unisci i css in un unico file. Controlla che i nomi non vadano in conflitto

Combine external JavaScript
[Score: 55/100]
Idem come sopra. Limita anche dove possibile l'utilizzo di troppi script. Considera che tutti i framework javascript fanno le stesse cose, x cui per esempio orientati su uno e sfrutta solo quello (ad es. jquery) invece che utilizzarne molteplici...>(può anke dipendere dai plugin che utilizzi in Wordpress)

Optimize the order of styles and scripts
[Score: 79/100]
Inserisci nel <head> prima tutti i css e poi tutti i js. Se possibile inserisci addirittura i js prima di </body> in modo da velocizzare al max la pagina...

Remove unused CSS
[Score: 0/100]
Controlla di non avere dei css inutilizzati, che sprecano banda inutilmente. Rimuovi quelli non necessari.

Serve static content from a cookieless domain
[Score: 0/100]
**Questo può dipendere da molti fattori. §Se il tuo dominio invia dei cookie questi vengono ritrasmessi ad ogni richiesta. Un esempio palese è quello dei cookie di google analytics
**
Use efficient CSS selectors
Ottimizza i css raggruppando gli attributi comuni ai selettori e utilizza gli id o le classi dove possibile. Es non ottimizzato:
[HTML]
.classe{
color:red
float:left;
height:30px;
}
.classe2{
color:blue
float:left;
height:30px;
}
/*esempio ottimizzato+/
.classe{
color:red

}
.classe2{
color:blue;
}
.classe,.classe2{
float:left;
height:30px;
}

[/HTML]
[/INDENT]Grazie per il tempo.

Figurati;)

redemption

Cardy sei stato veramente fenomenale. Grazie.

Comunque il tema nuovo non è visibile, per questo non lo riscontri. Io vorrei eliminare il problema del Leverage browser caching, ma anche seseguendo le tue istruzioni non riesco. Il mio sito non è su un dedicato ma su un condiviso di Aruba. C'è un modo per risolvere il problema?

cardy

@Redemption said:

Cardy sei stato veramente fenomenale. Grazie.

Comunque il tema nuovo non è visibile, per questo non lo riscontri. Io vorrei eliminare il problema del Leverage browser caching, ma anche seseguendo le tue istruzioni non riesco. Il mio sito non è su un dedicato ma su un condiviso di Aruba. C'è un modo per risolvere il problema?
Chiedi al supporto di aruba se è attivo il mod_expire, eventualmente fattelo attivare... (penso sia fattibile). Idem per la compressione gzip...

redemption

Cardy sei stato davvero gentilissimo. Grazie.
Spero di riuscire ad arrivare ad un punteggio quantomeno decente .

redemption

Ciao Cardy,
ho chiesto ad Aruba e mi hanno detto che non possono attivare il mod_expire. C'è un altro modo per aumentare il leverage c. ? Magari tramite metatag?
Grazie.

cardy

@Redemption said:

Ciao Cardy,
ho chiesto ad Aruba e mi hanno detto che non possono attivare il mod_expire. C'è un altro modo per aumentare il leverage c. ? Magari tramite metatag?
Grazie.
L'unica soluzione che mi viene in mente è quella di caricare i files (immagini, css, swf ecc) su un altro dominio che supporti il mod_expire...

redemption

In questo modo funziona? Grazie.

cardy

@Redemption said:

In questo modo funziona? Grazie.
Certo sennò non te lo proponevo

lionard84

Salve a me esce sul blog
Page Speed Score: 74/100

Enable compression

Leverage browser caching

Parallelize downloads across hostnames

Serve resources from a consistent URL

Serve static content from a cookieless domain

Minify CSS

Specify image dimensions

Remove unused CSS

e sul sito 72/100:

Enable compression

Leverage browser caching

Minify CSS

Parallelize downloads across hostnames

Serve static content from a cookieless domain

Specify image dimensions

Minify JavaScript

Remove unused CSS

ho un dominio aruba e sopra ho letto che non si possono fare tante modiche, cosa potrei fare?

lionard84

Salve, ho fatto alcune prove ma non ho capito come modificare il : "Leverage browser caching" avendo Aruba, se scrivo:

<FilesMatch "\.(jpg|jpeg|png|gif)$">

Header set Cache-Control "max-age=37739520, public"
</FilesMatch>

Il sito non si vede più ed esce un errore.
Quali soluzioni posso adottare?
Grazie

cardy

@Lionard84 said:

Salve, ho fatto alcune prove ma non ho capito come modificare il : "Leverage browser caching" avendo Aruba, se scrivo:

><FilesMatch "\.(jpg|jpeg|png|gif)$">

Header set Cache-Control "max-age=37739520, public"
</FilesMatch>
>```Il sito non si vede più ed esce un errore.
Quali soluzioni posso adottare?
Grazie

Cambiare hosting :D?
No dai apparte le battute, se sei su un hosting condiviso dovresti informarti se puoi utilizzare il comando nel .htaccess poiche magari esistono delle limitazioni... Se senza le direttive nel file le pagine si vedono, e inserendo le direttive per la cache ti viene restituita una pagina senza codice sorgente allora il problema è proprio nell'hosting...

lionard84

Risposta aruba:

Gentile cliente,
mod_headers non è disponibile in hosting condiviso. Per quanto riguarda mod_expires, stiamo valutando la possibilità di implementarlo sul webserver Apache.

Per quanto riguarda la compressione gzip, può creare nella radice del dominio un file .htaccess che attiva le funzionalità del mod_deflate.

Il codice da inserire è il seguente:

SetOutputFilter DEFLATE
AddOutputFilter DEFLATE text/html text/plain text/xml text/css application/javascript application/x-javascript application/x-httpd-php application/rss+xml application/atom_xml text/javascript
# Netscape 4.x has some problems...
BrowserMatch ^Mozilla/4 gzip-only-text/html

# Netscape 4.06-4.08 have some more problems
BrowserMatch ^Mozilla/4\.0[678] no-gzip

# MSIE masquerades as Netscape, but it is fine
 BrowserMatch \bMSIE !no-gzip !gzip-only-text/html

# NOTE: Due to a bug in mod_setenvif up to Apache 2.0.48
# the above regex won't work. You can use the following
# workaround to get the desired effect:
BrowserMatch \bMSI !no-gzip !gzip-only-text/html


# Don't compress images
SetEnvIfNoCase Request_URI \
\.(?:gif|jpe?g|png)$ no-gzip dont-vary

Che ne dici?
Ciao

cardy

@Lionard84 said:

Risposta aruba:

Gentile cliente,
mod_headers non è disponibile in hosting condiviso. Per quanto riguarda mod_expires, stiamo valutando la possibilità di implementarlo sul webserver Apache.

Per quanto riguarda la compressione gzip, può creare nella radice del dominio un file .htaccess che attiva le funzionalità del mod_deflate.

Il codice da inserire è il seguente:

>SetOutputFilter DEFLATE
AddOutputFilter DEFLATE text/html text/plain text/xml text/css application/javascript application/x-javascript application/x-httpd-php application/rss+xml application/atom_xml text/javascript
# Netscape 4.x has some problems...
BrowserMatch ^Mozilla/4 gzip-only-text/html

# Netscape 4.06-4.08 have some more problems
BrowserMatch ^Mozilla/4\.0[678] no-gzip

# MSIE masquerades as Netscape, but it is fine
 BrowserMatch \bMSIE !no-gzip !gzip-only-text/html

# NOTE: Due to a bug in mod_setenvif up to Apache 2.0.48
# the above regex won't work. You can use the following
# workaround to get the desired effect:
BrowserMatch \bMSI !no-gzip !gzip-only-text/html


# Don't compress images
SetEnvIfNoCase Request_URI \
\.(?:gif|jpe?g|png)$ no-gzip dont-vary
>```Che ne dici?
Ciao

Puoi copiare pari pari il codice inviato da Aruba. In questo modo abiliti solo la compressione dei file testuali e non il caching. Sicuramente è già un passo in avanti  :-).  Il resto non è implementabile visto che sei su hosting condiviso...:ciauz:

lionard84

Si effettivamente mi ha portato all' 85% il codice aruba (da 82%), è strano che non ci sia la possibilità (magari mettendo un codice dentro la pagina web) o qualcosa di alternativo? Siamo così tanti ad avere hosting condiviso, possibile che google non abbia pensato a noi?

lionard84

Per wordpress c'è qualche plugin che svolga tale funzione (mi riferisco alla cache delle immagini)?