Utilizzo parziale di una CDN per velocizzare sito web

studio77

Utilizzo parziale di una CDN per velocizzare sito web

Ciao a tutti,
approfondendo il tema della diminuzione del tempo di caricamento di una pagina web mi sono imbattuto nelle CDN (dopo aver notato che alcuni siti molto spinti usando le CDN).

Ma in particolare sul discorso di utilizzarle in modo parziale (per far fronte ai nuovi contenuti che cambiano) e cioè utilizzarle solo per richiamare determinate risorse pesanti e/o statiche lasciando le risorse dinamiche fuori dalla CDN.

E' corretto come ragionamento ? Oppure è consigliabile un'altra configurazione ?

Se sì, servizi free come quello a disposizione di CloudFlare lo permettono ? Oppure questi servizi free permettono SOLO il collegamento DNS del dominio ma di tutto il servizio (in tal caso se cambia un contenuto nel sito cosa succede ?) ?

Mi date qualche dritta per favore ? Grazie.

fda

Ciao studio77,
tipicamente sulla CDN carichi alcune risorse quali fogli di stile css, javascript, immagini, documenti. Il tuo sito continua ad avere vita propria sull'hosting/server, ma viene stabilita una connessione per cui queste risorse statiche vengono servite dalla CDN. Si tratta di risorse che hanno una vita "non breve", come appunto i fogli di stile, che si ipotizza non cambino dall'oggi al domani.

Il principio della CDN è di fornire alcune risorse utili alla navigazione in maniera veloce, quindi come se fossero lì pronte per essere fornite, scaricabili facilmente anche in virtù di una elevata disponibilità "in prossimità" dell'utente che naviga.

Tradotto, significa che se pure è vero che potrebbe essere un vantaggio avere una CDN lato cache, è anche vero che probabilmente tale vantaggio non ne giustifica l'utilizzo se il pubblico proviene da un unico paese e/o se il carico è limitato o comunque compatibile con il tuo server/hosting. In molti casi, al posto di una CDN può convenire usare un buon sistema di caching (salvo casi specifici, il caching andrebbe sempre usato).

Così come la CDN non equivale a sistema di cache, allo stesso modo non è la soluzione universale per servire le risorse da un diverso dominio. Da questo punto di vista potresti misurare performance diverse tra HTTP/1.1 e HTTP/2. Ci sono casi in cui un sito web senza CDN è più veloce.

Servizi come CloudFlare (e altri, non è il solo) offrono anche altri vantaggi, ma ti consiglio di focalizzarti sulle scelte fondamentali. Un buon motivo per valutare il ricorso della CDN potrebbe essere il seguente: sito web con molti utenti serviti in paesi diversi, con accessi contemporanei. Più in generale, la maniera giusta per capire se il tuo sito può giovarsi di una CDN è testare. tieni anche conto, però, che prima di passare a una CDN per il miglioramento delle performance, andrebbero ottimizzate le performance intervenendo sui colli di bottiglia, il codice inutile, ecc.

Spero di esserti stato utile. Buon tuning!

studio77

Ciao e grazie mille per la risposta.
Mi hai stimolato però diverse domande piene di infinita curiosità, eccole:

Per un sito multilingua vorrei usare la CDN ma vorrei usare la CDN solo per i contenuti statici quali CSS, JS e immagini (le immagini magari che so che non cambieranno mai, o quasi). Il mio problema è, come faccio a dire o settare la CDN in modo che non tutto il contenuto del sito venga condiviso sulla CDN ? Vorrei lasciare fuori dalla CDN quei contenuti che possono cambiare o sono dinamici.
Se per qualche raro motivo devo cambiare un CSS o JS o immagine che ho condiviso sulla CDN (e che pensavo non cambiassero mai) come devo fare o cosa succede a questa risorsa in cache sulla CDN ? Cosa succede all'utente che vede quel contenuto presente nella CDN ?
Se non usassi la CDN (in quei siti che ad esempio sono solo in lingua italiana) ma sfruttassi il caching del server, tramite attivazione con htaccess, come faccio a dire (anche in questo caso quindi) quali risorse devo lasciare in cache e quali no visto che alcuni contenuti cambiano di frequente ? Vorrei evitare che un utente non visualizzi l'aggiornamento di tale modifica
Ho sentito parlare di HTTP2, ma di cosa si tratta nello specifico ? Che vantaggi porta o in quali casi conviene ?
Quali sono i "colli di bottiglia" sui quali consigli di controllare/modificare ?

Scusa se mi sono dilungato ma sono troppo curioso di conoscere ed imparare questo argomento.
Graziiiieeee

fda

Ciao,
per 1) e 2) ti consiglio di studiare il pannello della CDN.
Il modo più semplice per iniziare è provare a installare una CDN su un sito di test. Crea ad esempio su un dominio (puoi usare anche un 3° livello come sottodominio . tuodominio . com) un sito di prova, può andare bene un'installazione di un cms come wordpress; crea un account su Cloudflare per il servizio base gratis e prendi dimestichezza con le risorse da mettere su CDN. Il pannello è abbastanza intuitivo ma all'inizio potresti penare un poco per capire. Sii paziente e usa gli how-to che trovi in rete.

Nota: la CDN è utile se gli utenti provengono da paesi diversi, indipendentemente dalla lingua. L'enfasi è sulla dislocazione geografica e non sulla lingua. Ovviamente l'utilità di una CDN è maggiore all'aumentare del carico, soprattutto quando gli utenti sono dislocati in diverse aree geografiche (Asia, Americhe, Europa, ecc..).

Sul caching si apre un mondo. Ti consiglio di iniziare da qualcosa di semplice e intuitivo, sempre facendo qualche test.
Ecco un esempio di istruzioni in *htaccess *per diverse estensioni di file:


<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css A604800
ExpiresByType text/x-component A3600
ExpiresByType application/x-javascript A604800
ExpiresByType application/javascript A604800
ExpiresByType text/javascript A604800
ExpiresByType text/x-js A3600
ExpiresByType text/html A3600
ExpiresByType text/richtext A3600
ExpiresByType image/svg+xml A3600
ExpiresByType text/plain A3600
ExpiresByType text/xsd A3600
ExpiresByType text/xsl A3600
ExpiresByType text/xml A3600
ExpiresByType video/avi A31536000
ExpiresByType image/bmp A31536000
ExpiresByType video/divx A31536000
ExpiresByType image/gif A31536000
ExpiresByType application/x-gzip A31536000
ExpiresByType image/x-icon A31536000
ExpiresByType image/jpeg A31536000
ExpiresByType application/json A31536000
ExpiresByType audio/midi A31536000
ExpiresByType video/quicktime A31536000
ExpiresByType audio/mpeg A31536000
ExpiresByType video/mp4 A31536000
ExpiresByType video/mpeg A31536000
ExpiresByType audio/ogg A31536000
ExpiresByType application/pdf A31536000
ExpiresByType image/png A31536000
ExpiresByType audio/x-realaudio A31536000
ExpiresByType image/svg+xml A31536000
ExpiresByType image/tiff A31536000
ExpiresByType application/x-font-ttf A31536000
ExpiresByType audio/wav A31536000
ExpiresByType audio/wma A31536000
ExpiresByType application/zip A31536000
</IfModule>

Tutte le righe iniziano con ExpiresByType a cui segue il tipo di file e la durata espressa in secondi e preceduta dalla lettera A.
Esempio: A3600 corrisponde a 1h (3600 secondi).

Considera che esistono diverse versioni di Apache, tra una versione e l'altra le istruzioni possono differire.
Ti lascio il link alla documentazione di Apache per una pagina dedicata al mod_expires per Apache 2.4 : http://httpd.apache.org/docs/current/mod/mod_expires.html

HTTP/2 è il nuovo standard ed è generalmente più performante. Su HTTP/2 e sulle istruzioni da inserire in htaccess ti consiglio di cercare discussioni già presenti sul ForumGT oppure di aprirne di nuove, specifiche, nelle sezioni giuste. Per *htaccess *cerca / scrivi qui: http://www.giorgiotave.it/forum/mod-rewrite-e-tecniche-di-url-redirect/

Esempi di colli di bottiglia: troppe risorse nella pagina (immagini, fogli di stile, javascript), immagini pesanti, risorse che richiedono altre risorse (tipicamente css e js), video con e senza autoplay, iframe, troppi e/o inutili redirect.
Ma i problemi possono essere tanti e talvolta non sono facili da risolvere oppure richiedono un compromesso, soprattutto per andare incontro agli utenti mobile e agli "standard di Google". Potresti trovarti a dovere alleggerire le pagine e il sito, ad eliminare plugin e codice inutile, a fare caricare in alto poche risorse per permettere agli utenti di iniziare a navigare la tua pagina senza fare ricorso a css e javascript esterni, a intervenire per eliminare query che rallentano il sito in alcune situazioni.

Usa questi strumenti per fare i tuoi test e migliorare le performance delle pagine web:
https://developers.google.com/speed/
http://www.giorgiotave.it/speedoo/
https://gtmetrix.com/

sermatica

Ciao
FDA ti ha spiegato benissimo il tutto. Mi accodo per dire che se hai pochi visitatori ti consiglio di lasciare da parte le Cdn e di concentrarti sui sistemi di Cache, ti consiglio W3 Total Cache.

Per pochi visitatori intendo anche qualche migliaio al mese.

studio77

@Sermatica said:

Ciao
FDA ti ha spiegato benissimo il tutto. Mi accodo per dire che se hai pochi visitatori ti consiglio di lasciare da parte le Cdn e di concentrarti sui sistemi di Cache, ti consiglio W3 Total Cache.

Per pochi visitatori intendo anche qualche migliaio al mese.

Le visite, per il sito oggetto di questa volontà di provare la CDN, sono circa 10.000 al mese e provengono da tutte le parti del mondo (è un sito in due lingue, italiano ed inglese). Gli stranieri, circa il 15% delle visite, provengono da USA, Giappone, Inghilterra, Germania, Nord Europa ...

E' un caso dove conviene provare la CDN ?

studio77

Grazie mille FDA per la spettacolare risposta!
Prometto che mi leggo e studio tutto con attenzione!

Se provassi il caching cosa succede se metto 1 settimana di tempo per le jpeg e cambio la jpeg (mantenendo nome e path) di un box in home page ? L'utente vede o meno il nuovo contenuto di tale jpeg ?
Dico bene poi se il caching porta benefici alla seconda visita dell'utente e non alla prima ? Se un sito ha la maggior parte dei visitatori nuovi e pochi di ritorno (concordo ovviamente che non è bello avere questa situazione) il caching porta pochi benefici, giusto ? O più che altro porta benefici agli occhi degli algoritmi di google e quindi migliora la SEO ?

sermatica

Ciao
io nel tuo caso **non **implementerei la Cdn ma un buon Hosting con una buona cache. Calcolando che gli accessi avvengano nelle canoniche 8 ore lavorative hai una visita al minuto.

Quello che farei è tenere tutto monitorato, in particolare i vari valori di Analitycs...

Domain lookup per nazione (Italy 0,09 sec - Spain 0,14 sec)
Tempo risposta server per nazione (Italy 0,65 sec - United States 0,77 sec)
Tempo di reindirizzamento per nazione (Italy 0,24 - United States 2,08 sec)

Ti ho messo dei valori di riferimento per un sito che gestisco, che ha solo la cache e il targhet di riferimento è solo per l'Italia.

studio77

@Sermatica said:

Ciao
io nel tuo caso **non **implementerei la Cdn ma un buon Hosting con una buona cache. Calcolando che gli accessi avvengano nelle canoniche 8 ore lavorative hai una visita al minuto.

Quello che farei è tenere tutto monitorato, in particolare i vari valori di Analitycs...

Domain lookup per nazione (Italy 0,09 sec - Spain 0,14 sec)
Tempo risposta server per nazione (Italy 0,65 sec - United States 0,77 sec)
Tempo di reindirizzamento per nazione (Italy 0,24 - United States 2,08 sec)

Ti ho messo dei valori di riferimento per un sito che gestisco, che ha solo la cache e il targhet di riferimento è solo per l'Italia.

Ciao...nel mio caso però gli accessi avvengono da tutto il mondo e quindi nell'arco delle 24 ore

sermatica

Ciao ancora meglio, sono 10.000 visite al mese / 30 giorni / 24 ore sono 13 visite all'ora... considerando che un buon hosting con un buon sistema di cache ne gestisce 50 contemporaneamente senza problemi non ti consiglio la Cdn. Valuterei prima tutti i dati monitorati e solo dopo ne valuterei l'implementazione.

studio77

@Sermatica said:

Ciao ancora meglio, sono 10.000 visite al mese / 30 giorni / 24 ore sono 13 visite all'ora... considerando che un buon hosting con un buon sistema di cache ne gestisce 50 contemporaneamente senza problemi non ti consiglio la Cdn. Valuterei prima tutti i dati monitorati e solo dopo ne valuterei l'implementazione.

Ah ok grazie!!!!
Ma allora a quante visite si comincia a preferire l'uso di una CDN ?

sermatica

Ciao
quando si inizia a parlare di cifre a 5 zeri come 100.000 visite al mese.

studio77

@Sermatica said:

Ciao
quando si inizia a parlare di cifre a 5 zeri come 100.000 visite al mese.

In ogni caso, usando una CDN, è meglio se SOLO alcune risorse le destino all'uso della CDN (tipo CSS o JS o Images statiche) ?

Inoltre ho ancora dubbi su questo:

Se provassi il caching cosa succede se metto 1 settimana di tempo per le jpeg e cambio la jpeg (mantenendo nome e path) di un box in home page ? L'utente vede o meno il nuovo contenuto di tale jpeg ?
Dico bene poi se il caching porta benefici alla seconda visita dell'utente e non alla prima ? Se un sito ha la maggior parte dei visitatori nuovi e pochi di ritorno (concordo ovviamente che non è bello avere questa situazione) il caching porta pochi benefici, giusto ? O più che altro porta benefici agli occhi degli algoritmi di google e quindi migliora la SEO ?

sermatica

Ciao se il sito è in Wordpress installa W3 Total Cache, quando fai modifiche a pagine la svuoti per quelle pagine... se le fai al sito la svuoti per tutto il sito. Correlazione velocità sito web e Seo? Forse si ma di sicuro sarà il sito lento ad essere "penalizzato" dagli utenti...

studio77

@Sermatica said:

Ciao se il sito è in Wordpress installa W3 Total Cache, quando fai modifiche a pagine la svuoti per quelle pagine... se le fai al sito la svuoti per tutto il sito. Correlazione velocità sito web e Seo? Forse si ma di sicuro sarà il sito lento ad essere "penalizzato" dagli utenti...

Ciao...no, non uso Wordpress (ma il mio CMS) ... il caching lo attiverei direttamente sul file htaccess ma non ho capito come devo fare quando una risorsa mi cambia contenuto (mantenendo stesso nome ed estensione) ... non ho capito quale scadenza mettere per ogni risorsa (se 1 settimana o 1 mese) e non ho capito cosa succede se appunto aggiorno una foto e l'utente l'ha visitata già il giorno prima e poi la visualizza il giorno dopo (vede il contenuto nuovo ?) ...

Inoltre, il caching porta vantaggi "solo" dalla seconda visita di ritorno dell'utente, giusto ?

sermatica

Ciao
se usi un altro Cms devi attenerti alle istruzioni di quel Cms.

studio77

@Sermatica said:

Ciao
se usi un altro Cms devi attenerti alle istruzioni di quel Cms.

Il CMS che uso è il mio, l'ho fatto io ...

LA DOMANDA E':

se nel file htaccess dichiaro che le jpeg devono rimanere in cache 1 mese cosa succede se il logo io lo cambio ? Il visitatore che è già stato nel mio sito lo vede cambiato o vede il vecchio finchè non passa il mese di cache ?

sermatica

Ciao in questo caso non riesco ad aiutarti, mi spiace.

altrasoluzione

Ciao studio77,
anzitutto dobbiamo distinguere le cache tra "lato server" e "lato client".

La prima è una cache che giace, appunto, sul server (per esempio Google Pagespeed) e si occupa di fornire una copia cache dei contenuti ai visitatori che accedono a una pagina già visitata da qualcun altro.

In pratica, se un visitatore vuole visualizzare una pagina, se questa è già stata visitata da un altro visitatore (o anche lo stesso), anziché ricostruire la pagina interrogando il database e leggendo i file del sito, viene fornita una copia già "elaborata", in modo da accelerare il tempo di download e alleggerire il carico del server e del database.

La cache lato client, cioè quella che configuri con le direttive Apache in .htaccess, invece, è conservata nel browser del visitatore il quale, se visita una pagina già visitata in passato (nei termini della scedenza della cache), anziché scaricare di nuovo i contenuti della pagina visualizza quelli già presenti in locale, precedentemente scaricati.

Per esempio, la direttiva ExpiresByType image/gif "access plus 1 month", chiede al browser, per un mese, di non scaricare di nuovo un'immagine gif già scaricata in precedenza ma di utilizzare quella in locale.

Quindi, rispondendo alla tua domanda, se modifichi il logo e un visitatore l'ha già scaricato in precedenza, entro i termini di scadenza della cache del browser, il visitatore continuerà a vedere la precedente versione.
Per rimediare a questo "problema", puoi modificare il nome o il percorso del file del logo oppure forzare la scadenza della cache del browser tramite direttive Apache.

Spero di essere stato d'aiuto.

studio77

Fantastico, grazie...bella risposta, molto chiara ed esauriente!
Ho capito per bene ora.

Quindi cosa conviene fare ?
Sembrerebbe meglio la cache lato server, giusto ? In tal caso però come conviene agire nel concreto ?