O que é o cache storage e como os sites o usam?

O cache storage permite guardar ficheiros no browser para as páginas carregarem mais depressa e funcionarem offline. Descobre como funciona.

Rascunho

O cache storage permite aos sites guardar ficheiros diretamente no browser, para as páginas carregarem mais depressa e funcionarem mesmo offline. Descobre como funciona e como se encaixa no quadro geral do armazenamento do browser.

Lembras-te da última vez que um site carregou quase de imediato na segunda visita, apesar de a primeira ter demorado alguns segundos? Ou de uma situação em que uma aplicação continuou a funcionar mesmo depois de perderes a ligação à internet? Isso não é magia. Por trás de ambas as experiências está um mecanismo de armazenamento chamado cache storage, que guarda discretamente os ficheiros certos para o browser não ter de os ir buscar de novo.

Já leste sobre como a cache funciona em geral e como o browser guarda ficheiros para acelerar visitas repetidas. O cache storage é uma versão mais avançada e programável dessa ideia, que dá aos sites um controlo preciso sobre o que é guardado e como é servido.

O que é o cache storage?

O cache storage é um sistema de armazenamento do browser que permite aos sites guardar ficheiros específicos, páginas HTML, folhas de estilo CSS, ficheiros JavaScript, imagens e tipos de letra, diretamente no dispositivo do visitante. Ao contrário da cache normal do browser, que o browser gere automaticamente segundo as suas próprias regras, o cache storage é controlado pelo próprio site através de algo chamado service worker.

Um service worker é um script que corre em segundo plano num browser, separado da página web. Consegue intercetar pedidos de rede e decidir se vai buscar o ficheiro à internet ou o serve diretamente a partir do cache storage. Isto dá ao programador do site controlo total sobre o que é guardado em cache, durante quanto tempo e em que condições.

Em que difere o cache storage da cache normal do browser?

A cache normal do browser é automática. O browser decide o que guardar, durante quanto tempo e quando atualizar. Não a controlas como dono de um site, e os visitantes também não a conseguem gerir facilmente, além de a limparem por completo.

O cache storage é explícito e programável. O site especifica exatamente que ficheiros devem ser guardados e escreve a lógica de quando e como os usar. Esta precisão é o que faz do cache storage a ferramenta certa para criar experiências rápidas, fiáveis e capazes de funcionar offline.

Para que usam os sites o cache storage?

Visitas repetidas mais rápidas

Quando um visitante volta a um site, o service worker pode servir ficheiros em cache de imediato, em vez de esperar pela resposta do servidor. As páginas carregam mais depressa porque os ficheiros essenciais já estão no dispositivo. Isto melhora diretamente a experiência dos visitantes que regressam e reduz a carga no servidor.

Acesso offline

O cache storage é a base dos sites e das aplicações web capazes de funcionar offline. Ao guardar em cache as páginas e os ficheiros principais durante uma visita, o site pode continuar a funcionar quando o visitante perde a ligação à internet. Pode continuar a navegar pelas páginas em cache, usar as funcionalidades principais e ver o conteúdo que já carregou.

Desempenho fiável em ligações lentas

Numa ligação lenta ou instável, servir ficheiros a partir do cache storage significa que os visitantes não têm de esperar que cada recurso seja descarregado em cada carregamento de página. A experiência mantém-se fluida mesmo quando a rede não colabora.

O que significa isto para o teu site?

Na maioria dos sites de empresas comuns, o cache storage funciona discretamente em segundo plano, como parte da forma como a plataforma é construída. Não o configuras manualmente. O que importa é que a plataforma que entrega o teu site trate da cache de forma inteligente, para os visitantes que regressam terem carregamentos rápidos sem teres de gerir os detalhes técnicos.

O cache storage liga-se diretamente à velocidade do site e à fiabilidade. Também complementa a camada de CDN: a CDN entrega os teus ficheiros depressa a partir de servidores próximos, enquanto o cache storage guarda os ficheiros mais necessários diretamente no dispositivo do visitante. Em conjunto, garantem que as tuas páginas carregam o mais depressa possível, por todos os ângulos. O criador de websites da WEMASY trata da cache como parte da sua infraestrutura, para os teus visitantes beneficiarem de uma entrega rápida e fiável em cada visita.

Perguntas frequentes

O cache storage é o mesmo que a cache do browser?

Não, mas estão relacionados. A cache normal do browser é gerida automaticamente pelo browser. O cache storage é uma API programável que os sites controlam através de um service worker. Ambos guardam ficheiros localmente para acelerar o carregamento das páginas, mas o cache storage dá ao site um controlo preciso sobre o que é guardado e quando é usado. A cache do browser não exige intervenção de ninguém; o cache storage é gerido de propósito pelo site.

Os dados do cache storage persistem depois de o browser fechar?

Sim. O cache storage é persistente, tal como o local storage. Os ficheiros guardados no cache storage ficam no dispositivo até o site os remover ou o visitante limpar os dados do browser. É esta persistência que permite a um site carregar de imediato ou funcionar offline numa visita de regresso, mesmo dias depois.

O cache storage pode afetar a rapidez com que o meu site se atualiza para os visitantes?

Sim, se não for gerido com cuidado. Se um visitante tiver em cache uma versão mais antiga dos teus ficheiros e o service worker não verificar se há atualizações, pode ver conteúdo desatualizado depois de fazeres alterações. As estratégias de cache bem feitas resolvem isto ao dar versões aos ficheiros em cache e ao atualizá-los quando há novas versões. As plataformas que gerem a cache por ti tratam disto automaticamente, para os visitantes receberem sempre uma versão atualizada quando algo muda.

Quanto pode guardar o cache storage?

A capacidade do cache storage varia consoante o browser e o dispositivo, mas é geralmente muito maior do que a do local storage. Os browsers permitem normalmente aos sites usar uma parte do espaço em disco disponível, que pode ir de dezenas a centenas de megabytes. O browser pode pedir autorização ao utilizador se um site tentar guardar uma quantidade muito grande. Para a maioria dos sites, a capacidade disponível é mais do que suficiente para guardar os ficheiros necessários a carregamentos rápidos e acesso offline.

O que é um service worker?

Um service worker é um script em segundo plano que corre no browser, separado da página web. Interceta pedidos de rede e pode decidir se vai buscar um recurso à internet ou o serve a partir do cache storage. Os service workers são o que torna possíveis a funcionalidade offline e as estratégias de cache avançadas. Correm em silêncio, sem o visitante os ver ou interagir diretamente com eles.

Preciso de configurar o cache storage no meu site?

Não, se usares um criador de websites. A gestão da cache, incluindo a forma como os ficheiros são guardados e atualizados, é tratada pela plataforma. Com o criador de websites da WEMASY, a cache está integrada na infraestrutura, para os teus visitantes terem os benefícios de desempenho sem qualquer configuração da tua parte. Tu foca-te no teu conteúdo e na tua marca; a plataforma trata da eficiência com que é entregue.

Põe isto em prática
no teu próprio site.

Começa grátis com a WEMASY e cria o teu site em poucos minutos.