Cache di memoria di Chrome vs cache del disco

Sono interessato alla cache di memoria di Chrome e alla cache del disco? Uso webpack, plugin per blocchi comuni e generano tutti i miei file con chunkhash.

In che modo la memoria differisce dalla cache del disco. Quando ricarico la mia pagina, alcuni file vengono caricati dalla cache di memoria e alcuni dalla cache del disco (bundle.js e image.jpg dalla cache di memoria e CSS dalla cache del disco). A volte è diverso. Possiamo controllarlo, scegliere cosa caricare da dove? La cache di memoria sembra essere più veloce della cache su disco.

google-chrome caching webpack

— Igor-Vuk
fonte

Ciao Igor, questo ha causato problemi di caricamento con webpack? Come l'hai risolto?

— Goditi il

Non ci sono stati problemi. Questa è solo una funzionalità di cache del browser che memorizza nella cache i file del pacchetto webpack.

— Igor-Vuk

Ciao Igor, vedo che questo è un problema quando alcuni file in bundle vengono caricati dal disco e alcuni dalla memoria. Genera un errore JSONP, quando ciò accade. Ciò accade solo in rari casi.

— Goditi il

se / SuperUser

— chharvey

Risposte:

Come dicevano i loro nomi:

"Memory Cache" archivia e carica le risorse da e verso la memoria (RAM). Quindi questo è molto più veloce ma non è persistente. Il contenuto è disponibile fino alla chiusura del browser.

"Disk Cache" è persistente. Le risorse memorizzate nella cache vengono archiviate e caricate su e dal disco.

Test semplice: apri Chrome Developper Tools / Network. Ricarica una pagina più volte. La colonna della tabella "Dimensione" vi dirà che alcuni file vengono caricati "dalla cache di memoria". Ora chiudi il browser, apri di nuovo Developper Tools / Network e carica di nuovo quella pagina. Tutti i file memorizzati nella cache vengono caricati "dalla cache del disco" ora, perché la cache della memoria è vuota.

— Ruwen
fonte

Beh, non sapevo che fosse così semplice.

— Faizan Anwer Ali Rupani

in che modo il browser determina quali risorse archiviare nella cache di memoria rispetto a quella su disco?

— chharvey

possiamo configurare cosa dovrebbe essere memorizzato nella cache della memoria cache?

— Igor-Vuk

Ho alcuni contenuti sulla mia app angolare che vengono caricati da disco quando lo eseguo localmente, su questi file di produzione non vengono memorizzati nella cache. Solo la cache dalla memoria funziona nell'ambiente di produzione. Ragazzi, sapete cosa potrebbe causarlo?

— Rafael Andrade

@RafaelAndrade Tieni presente che angular fornisce più ambienti (in src / environment / *. Ts). environment.prod.ts definisce il tuo ambiente di build produttivo dove environment.ts definisce il tuo ambiente di sviluppo locale. Nell'ambiente di sviluppo locale per lo più non vuoi file memorizzati nella cache in modo che le modifiche locali si applichino sempre alla tua app.

— Ruwen

Chrome implementa le cache a molti livelli di astrazione. Al centro c'è la cache HTTP (browser), un backend per altri meccanismi di caching. Generalmente le cache potrebbero essere suddivise in:

Cache HTTP
Cache di Service Worker
Blink cache

Cache HTTP

Ogni richiesta effettuata sulla rete viene inviata tramite proxy dalla cache HTTP che aderisce a RFC . Quando richiesto per la prima volta, la cache viene sovrascritta. Le risorse sono codificate dall'URL di origine.

Cache di Service Worker

Per gestire correttamente gli errori di connessione di rete è possibile utilizzare Service Workers . Le cache e l'archiviazione cache verrebbero nuovamente prelevate dal disco.

Blink Cache

Blink utilizza Http Cache come backend in due modalità di creazione: in memoria e semplice (filesystem). Quale viene utilizzato dipende dal limite impostato globalmente per le cache la quantità di memoria che possono occupare. Anche l'attuale cache del renderer ottiene la maggior parte delle condivisioni. Ciò che viene memorizzato nella cache sono i caratteri, le immagini e gli script. Se l'utilizzo della memoria globale raggiunge una soglia specificata, viene utilizzato il backend del file system.

Forzatura nella cache di memoria

Se desideri che i tuoi file vengano serviti dalla memoria che sovrascrive il meccanismo predefinito, puoi implementare il tuo Service Worker. Utilizzando File Api, le risorse possono essere lette e archiviate in un oggetto in memoria. Quindi l'override dell'evento fetch sopprimerebbe la rete e le letture dei file con il contenuto servito da questo oggetto globale.

— Dominik G
fonte