Servire risorse statiche con una policy di cache efficiente (3 metodi)

Quando fornisci risorse statiche con un criterio di cache efficiente, il browser dell'utente memorizzerà questi file localmente e sarà necessario meno tempo per caricare la pagina. Normalmente non appena una pagina viene caricata, tutte le risorse di quella pagina, come HTML, CSS, JavaScript e immagini, devono essere scaricate.

La memorizzazione nella cache del browser consente al browser di recuperare risorse statiche come CSS, JavaScript e immagini dalla sua cache locale. Di conseguenza, le pagine si caricano più rapidamente. Il contenuto memorizzato nella cache significa che le visite successive a una pagina saranno più veloci della prima visita di un utente, ma non alla prima visita.

Cos'è la cache?

Una cache è un livello di archiviazione dati ad alta velocità nell'informatica che salva una parte di dati che è spesso di natura temporanea in modo che le richieste successive di tali dati possano essere soddisfatte più rapidamente rispetto all'accesso alla posizione di archiviazione principale dei dati. La memorizzazione nella cache consente di riutilizzare rapidamente i dati che sono stati precedentemente recuperati o calcolati.

Come funziona effettivamente la memorizzazione nella cache?

I dati in una cache sono solitamente conservati in hardware ad accesso rapido come la RAM (memoria ad accesso casuale), ma possono anche essere utilizzati insieme a un componente software. L'obiettivo di base di una cache è accelerare il recupero dei dati eliminando la necessità di contattare il livello di archiviazione più lento dietro di essa.

A differenza dei database, che memorizzano dati interi e di lunga durata, una cache spesso archivia una parte dei dati in modo transitorio.

Vantaggi della memorizzazione nella cache

Esaminiamo alcuni vantaggi della memorizzazione nella cache.

Migliora le prestazioni della tua applicazione

La lettura dei dati da una cache in memoria è incredibilmente veloce perché la memoria è di ordini di grandezza più veloce del disco (magnetico o SSD) (sotto il millisecondo). Questo accesso ai dati sostanzialmente più veloce migliora le prestazioni complessive dell'applicazione.

Il carico di back-end dovrebbe essere ridotto

Spostando una parte del carico di lettura dal database back-end al livello in-memory, la memorizzazione nella cache riduce lo stress sul database, impedendogli di subire prestazioni deboli sotto carico pesante o addirittura di andare in crash in caso di picchi.

Gli hotspot nel database dovrebbero essere eliminati

Molte applicazioni tendono a recuperare un sottoinsieme di dati più frequentemente rispetto al resto. Di conseguenza, potrebbero verificarsi punti critici nel database e potrebbe essere necessario eseguire un provisioning eccessivo delle sue risorse in base ai requisiti di velocità effettiva per i dati utilizzati più di frequente. Per i dati ad accesso frequente, una cache in memoria riduce i requisiti di overprovisioning offrendo prestazioni veloci e prevedibili.

Riduci il costo del tuo database

Le operazioni di input/output al secondo (IOPS) possono essere eseguite da una singola istanza della cache, consentendo di sostituire più istanze di database e di ridurre significativamente i costi. Questo è fondamentale se il database primario addebita la quantità di dati. Potrebbe esserci una grande differenza di prezzo in determinate condizioni.

Prestazioni prevedibili

La gestione dei picchi nell'utilizzo delle applicazioni è un problema prevalente nei sistemi moderni. L'aumento del carico del database provoca tempi di recupero dei dati più lunghi, rendendo imprevedibili le prestazioni complessive dell'applicazione. Questo problema può essere risolto utilizzando una cache in memoria ad alta velocità.

Aumenta il numero di persone che leggono (IOPS)

I sistemi in memoria hanno tassi di richiesta (IOPS) sostanzialmente più elevati rispetto a un database basato su disco comparabile, oltre ad avere una latenza ridotta. Se utilizzata come cache laterale distribuita, una singola istanza può soddisfare centinaia o addirittura migliaia di richieste al secondo.

Che cos'è la memorizzazione nella cache delle risorse?

La memorizzazione nella cache è un concetto semplice. Quando un browser scarica una risorsa, utilizza la politica del server per determinare se deve scaricarla nuovamente nelle visite successive. Se il server non fornisce un criterio, il browser è predefinito, il che di solito significa memorizzare nella cache i file per quella sessione.

Che cos'è la memorizzazione nella cache degli asset statici?

specificare per quanto tempo il browser deve conservare temporaneamente o memorizzare nella cache la risorsa. Eventuali richieste successive per quella risorsa vengono servite dalla copia locale del browser anziché dalla rete.

Ogni volta che un visitatore del tuo sito recupera una nuova versione di qualcosa che non è già memorizzato nella cache all'interno del browser o del server, stai utilizzando una politica della cache inefficiente. Quando, in realtà, potresti servire loro contenuto memorizzato nella cache e pronto per l'uso.

Leggi anche: Come riparare i permalink rotti in WordPress

Che cos'è una politica della cache efficiente?

Se i tuoi file statici non cambiano (o hai un meccanismo di busting della cache accettabile), ti suggeriamo di impostare la tua politica della cache su 6 mesi o 1 anno.

Elementi come file CSS/JS globali, loghi, grafica e così via cambiano raramente sui siti Web finiti, quindi 6 mesi o un anno è una buona scadenza della cache con cui lavorare.

Ovviamente, se modifichi frequentemente i file statici di cui sopra, puoi scegliere un tempo di scadenza della cache più breve purché superiore a 3 mesi.

Servi risorse statiche con una politica della cache efficiente

Esistono diversi modi in cui possiamo servire file statici utilizzando un'efficiente politica della cache, discuteremo 3 metodi

1. Usando il file .htaccess se stai usando LiteSpeed ​​Enterprise o Apache
2. Utilizzo della cache LiteSpeed
3. Utilizzo del plug-in W3 Total Cache

Servi risorse statiche utilizzando il file .htaccess su Apache e LiteSpeed ​​Enterprise

Nota: se stai utilizzando OpenLiteSpeed ​​o NGINX, questo metodo non funzionerà.

Accedi alla dashboard di WordPress

Fare clic su Plugin -> Aggiungi nuovo dal menu a sinistra

Cerca "Gestione file". Installa e attiva il plugin

Fare clic su "File Manager" dal menu a sinistra

Nella cartella public_html, fai clic con il pulsante destro del mouse su .htaccess e fai clic su rinomina

Cambia il nome del file (.htaccess-error)

Fare clic sull'icona "nuovo file" dall'alto

Assegna un nome al file ".htacess"

Incolla il codice seguente, salva e chiudi

 <IfModule mod_expires.c> ExpiresActive On # CSS, JavaScript ExpiresByType text/css "access plus 1 year" ExpiresByType text/javascript "access plus 1 year" ExpiresByType application/javascript "access plus 1 year" # Fonts ExpiresByType font/ttf "access plus 1 year" ExpiresByType font/otf "access plus 1 year" ExpiresByType font/woff "access plus 1 year" ExpiresByType font/woff2 "access plus 1 year" ExpiresByType application/font-woff "access plus 1 year" # Images ExpiresByType image/jpeg "access plus 1 year" ExpiresByType image/gif "access plus 1 year" ExpiresByType image/png "access plus 1 year" ExpiresByType image/webp "access plus 1 year" ExpiresByType image/svg+xml "access plus 1 year" ExpiresByType image/x-icon "access plus 1 year" # Video ExpiresByType video/webm "access plus 1 year" ExpiresByType video/mp4 "access plus 1 year" ExpiresByType video/mpeg "access plus 1 year" # Others ExpiresByType application/pdf "access plus 1 year" ExpiresByType image/vnd.microsoft.icon "access plus 1 year" </IfModule>

Servi risorse statiche utilizzando LiteSpeed ​​Cache

È necessario installare e attivare il plug-in LiteSpeed ​​Cache, una volta installato, seguire la guida di seguito:

• Vai alla dashboard di WordPress

• Fare clic su LiteSpeed ​​Cache -> Cache dal menu a sinistra

• Fai clic sulla scheda "Browser" dall'alto

• Attiva l'interruttore "Cache del browser".

• Fai clic su "Salva modifiche"

Servire risorse statiche utilizzando W3 Total Cache

Installa e attiva prima il plug-in W3 Total Cache e poi segui la guida di seguito.

• Vai alla dashboard di WordPress

• Fare clic su Prestazioni -> Cache del browser dal menu a sinistra

• Scorri verso il basso fino a "Media e altri file". Modificare "Scade la durata dell'intestazione" in almeno 15552000 (180 giorni).

• Fare clic su "Salva tutte le impostazioni"

Conclusione

Quando fornisci risorse statiche con una strategia di cache efficiente, il browser dell'utente salverà questi file localmente, riducendo il tempo necessario per il caricamento della pagina. Tutte le risorse di una pagina, come HTML, CSS, JavaScript e immagini, devono essere scaricate non appena viene caricata.