Ottimizziamo le prestazioni di un sito web

20 anni di trasformazioni Sono passati circa 20 anni dalla prima pagina web, anni in cui l’utente è diventato sempre […]
Ottimizziamo le prestazioni di un sito web

20 anni di trasformazioni

Sono passati circa 20 anni dalla prima pagina web, anni in cui l’utente è diventato sempre più esigente nell’uso di internet. E’ affamato di informazioni contenenti video e immagini, fruibili da smartphone, tablet e via dicendo. Oggi carichiamo intere pagine attraverso la banda larga e con supporti hardware/software migliori di un tempo. Costruiamo siti web interattivi, pieni di effetti, grazie a nuovi linguaggi come html5 e jquery. Tutto questo ricade sulle prestazioni e su noi sviluppatori. Sì perchè oggi le prestazioni sono fondamentali e non riguardano solo l’hardware e il software, ma anche la struttura delle pagine, il design e le reti.

Consigli per ottimizzare

Vediamo qualche consiglio per velocizzare i nostri siti web:

1. Ripulisci il codice

Per prima cosa devi snellire il codice, ripulirlo di tutti quei tag html inutili. Spesso comporta rifare parte del sito, ma è necessario, la “divite” influisce sulle prestazioni.

Assicurati di includere i css in file esterni, cosi che possano essere memorizzati nella cache del browser. Quindi evita di inserire stili inline.

Un altro accorgimento da fare sui css è quello di evitare spazi vuoti, se non sei a tuo agio scrivendo codice su una sola riga esistono dei programmi che lo fanno per te, tipo MinifyCss e Procssor. Infine riesamina tutte le classi e gli id, mi è capitato personalmente che in progetti abbastanza complessi alcune non erano più necessarie per via delle modifiche apportate successivamente.

2. Scegli un buon host

Controlla quali linguaggi di scripting usa l’host (php, perl, python ecc.), se vi sono installate vecchie versioni il tuo sito ne risentirà.

E’ consigliabile avere un host geograficamente vicino al pubblico del sito, per un sito che ha un target di clienti in china di certo non è consigliabile aruba. Se sei pignolo sui tempi di latenza puoi prendere in considerazione una CDN per la distribuzione di file come immagini e script.

3. Ottimizza le immagini

Vedere un sito che carica immagini in modo “scattoso” è il miglior modo per allontanare l’utente. Occupati personalmente del ritaglio e del ridimensionamento delle immagini, purtroppo la scalatura automatica lato server non tiene conto dell’ottimizzazione. Infine ottimizzale usando i metodi di compressione disponibili in rete come Smush.it.

Considera gli sprite css per loghi, icone e bottoni. In questo modo le immagini sono presenti su un unico file e vi sarà un’unica richiesta al server, invece di tante frazionate che causeranno dei piccoli ritardi.

4. Inserisci prima i css e poi i javascript

Inserisci prima i fogli di stile, che sono necessari per la visualizzazione del sito. Le librerie javascript, che spesso sono di grandi dimensioni, conviene tenerle per ultimo in modo da consentire al sito di essere rapidamente caricato.

5. Evita dove possibile le fonti esterne

Includere i box social come “ultimi tweet”, “Mi piace” di Facebook, canale youtube e pulsanti di condivisione risulta molto utile per gli utenti ma poco performanti nella comunicazione tra server e servizi. Questo richiede molto tempo e lascia in attesa i vostri utenti. Evita quelli non necessari.

6. Limita le chiamate al Database

Avere un sistema user-friendly è l’obiettivo della maggior parte dei CMS, ma effettuano un eccessico lavoro dinamico anche per cose più semplici come il caricamento di favicon ed immagini. Se conosci il percorso puoi sostituire le chiamate al database con le chiamate effettive, così da ridurne il carico.

7. Testa la velocità del sito

Per analizzare le prestazioni del tuo sito puoi ricorrere e varie soluzioni disponibili in rete:

  • WebPageTest: con questo strumento puoi testare la velocità delle tue pagine ed intervenrie dove necessario.
  • Http Archive: su httparchive.org sono disponibili le statistiche prestazionali di oltre 170.000 siti internet. È utile per farti un’idea di come gira il web.
  • Pagespeed: oltre al plug-in firefox per firebug, page speed è disponibile online. Mostra come migliorare le prestazioni del tuo sito in ordine di priorità.

Dimenticato qualcosa?

Spero di non aver dimenticato nulla. Se hai altre soluzioni per ottimizzare un sito web e vuoi condividerle scrivi pure nei commenti o sulla nostra pagina di facebook. Alla prossima!

  • Ottimo articolo !

    Aggiungerei l’utilizzo di un servizio come Cloudflare che è differente dal solito CDN in quanto ottimizza anche il contenuto garantendo che le risorse non rallentino il rendering della pagina. Lo sto utilizzando con una certa soddisfazione da circa un anno su un paio di siti e, credimi, assieme a Litespeed fa la differenza 😆

    • Ciao Matteo,
      grazie mille per aver condiviso la tua esperienza 😉

Search
Tags
Seleziona rubrica
Seleziona rubrica
Codice Github