L’ottimizzazione di un sito web è uno di quegli aspetti che prima o poi un buon webmaster deve affrontare, non è un lavoro facilissimo e ci vuole tempo, ma i risultati ottenuti la maggior parte delle volte danno delle soddisfazioni che ripagano il duro lavoro svolto. Ottimizzare la velocità di un sito web non è solo importante per il posizionamento del proprio sito, in quanto avrebbe un punteggio di maggiore qualità, ma diventa essenziale per dare un buon servizio al visitatore.

Infatti, molte volte di fronte ad una pagina lenta potrebbe con grande facilità uscirne ancora prima di averla visualizzata, senza tenere conto che se gli accessi al sito web dovessero aumentare, il calo di performance sarebbe ancora più grave. Ovviamente ci sono dei casi dove l’ottimizzazione non è sufficiente e il problema cade sulle componenti hardware e la potenza dei server dove il sito risiede, ma in base alla mia esperienza prima di arrivare ad avere una condizione di questa natura si può fare molto tramite alcune tecniche di ottimizzazione che andremo ad analizzare.

Come già detto, mettere mano a tutti gli aspetti che possono migliorare i tempi di elaborazione del nostro sito web non è facilissimo, in quanto i componenti e gli aspetti da analizzare sono tantissimi e bisognerebbe avere una buona cultura su centinaia di particolari, io mi sono trovato spesso ad affrontare questo problema e mi sono creato un schemino che mi indica le zone dei tempi dove dovrei intervenire, e per ogni zona ho stilato un’elenco delle azioni da svolgere. Sicuramente, perdonatemi se ho semplificato di molto, infatti capisco che le azioni da svolgere potrebbero essere molte di più da quelle che vi riporterò, però posso dirvi che ho avuto molte soddisfazioni e sono riuscito a migliorare sensibilmente molti siti web che ho analizzato.

Schema e descrizione dei tempi da analizzare

Tempo A (Richiesta)

Indica il tempo necessario da quando l’utente richiede la visualizzazione di una pagina web a quando questa richiesta arriva al nostro server web. Questa zona di tempo non è sempre facile da ottimizzare, anche perchè molti aspetti non dipendono da noi, ma dipendono dal traffico internet presente in quel momento tra i vari nodi, il nostro provider di collegamento da dove eseguiamo la richiesta e molti altri fattori che dipendono dalla rete in generale. In ogni caso ci sono degli aspetti che possiamo migliorare, come ad esempio la scelta di un DNS veloce e la replica di istanze web su diverse zone per una maggiore vicinanza al richiedente e quindi un miglioramento della latenza.

Tempo B (Server web)

Una volta che la richiesta della pagina da servire arriva al nostro web server, quest’ultimo eseguirà vari controlli di configurazione e provvederà alla creazione del risultato da spedire indietro al browser che ha eseguito la richiesta. In questa zona di tempo la cosa più importante è la scelta del software che deve fungere da server web, io personalmente uso apache ma ci possono essere dei casi dove possono essere prese in considerazioni anche scelte diverse. Una volta scelto il software bisogna analizzare bene i moduli che necessitiamo e non installare tutto, in quanto i moduli occupano memoria e risorse del nostro server. Ogni web server ha un file di configurazione che andrà analizzato in dettaglio per controllare le regole di rewrite, di autorizzazione accesso, alias, cache control e molto altro. In questa zona di tempo le cose da fare sono tantissime.

Tempo C (Elaborazione)

Nei primi siti internet che ebbi la fortuna di lavorare il 90% del lavoro consisteva nella creazione di pagine statiche HTML e qualche immagine di decorazione, quindi il grosso del lavoro del server web era quello di distribuire dei file statici così come venivano trovati sul file system senza ulteriori elaborazioni. Le cose ovviamente sono cambiate ed oggi è difficile sviluppare un sito web che non necessiti di elaborazioni di scripting come PHP, ASP etc, basti pensare al numero di blog che usano wordpress e quindi php e database mysql per la memorizzazione degli articoli. Quindi questa zona rappresenta il tempo necessario da quando il web server delega l’elaborazione della pagina ad un modulo di scripting a quando quest’ultimo finisce la sua elaborazione con accessi al database compresi e ritorna il risultato. Anche per questa zona di tempo approfondiremo meglio.

Tempo D (Risposta)

E’ il tempo necessario da quando il server web inizia a spedire la risposta a quando questa arriva totalmente al browser del richiedente. In questa zona di tempo la cosa più ovvia per migliorare le velocità è quella di spedire meno byte,  quindi dovremo attivare le regole di compressione e minimizzare i file statici come javascript e CSS. Dato che la pagina web richiesta per essere visualizzata avrà bisogno di più di una richiesta e quindi multiple risposte, in quanto conterrà immagini, file di stile esterni, componenti javascript come jQuery e altro ancora, la cosa migliore sarà quella di ridurre dove possibile il numero totale delle richieste o usare una CDN per la distribuzione di contenuti statici ad alta velocità come ad esempio Amazon S3.

Tempo E (Rendering)

E’ il tempo necessario al browser che una volta ricevuto il codice visualizzerà il contenuto finale all’utente. Ovviamente il primo aspetto deriva dalla qualità del browser, infatti chi usa Google Chrome sicuramente effettuerà un rendering più veloce rispetto a chi utilizza Internet Explorer. In ogni caso ci sono degli aspetti che possiamo migliorare noi, e sono la tecnica CSS con un utilizzo appropriato di selettori e il miglioramento di selezione DOM tramite linguaggio di programmazione javascript, dove quest’ultimo con l’avvento dello standard HTML5 sta sostituendo anche molte funzioni che prima venivano usate tramite Flash.

Testare le performance

Sicuramente quando inizieremo questo lavoro, avremo bisogno di poter controllare i risultati ottenuti, io personalmente uso google pagespeed e GTMetrix due tools internet fantastici, dove sarà possibile vedere molti dettagli consigliati con un punteggio di qualità, che cambiano man mano che effettuerete le vostre modifiche. Invece per molti problemi specifici consiglio di installare Firebug su Firefox o utilizzare l’opzione network su Chrome.

Indice generale della guida ottimizzazione sito web

• Guida – Ottimizzazione sito web – Introduzione
• Guida – Ottimizzazione sito web – Tempo (A) Richiesta
• Guida – Ottimizzazione sito web – Tempo (B) Server Web
• Guida – Ottimizzazione sito web – Tempo (C) Elaborazione
• Guida – Ottimizzazione sito web – Tempo (D) Risposta
• Guida – Ottimizzazione sito web – Tempo (E) Rendering