DEV Community

Cover image for CACHE NO LADO DO CLIENTE
feitoza
feitoza

Posted on • Updated on

CACHE NO LADO DO CLIENTE

O armazenamento no lado do cliente é crucial para evitar sobrecarga no servidor e proporcionar maior velocidade na entrega de informações ao usuário. Existem várias formas de realizar isso, considerando o contexto da web.

COOKIES

Este é um dos primeiros métodos de armazenamento no lado do cliente, sendo usado, na época, de forma geral para cache. Atualmente, é empregado para armazenar informações relacionadas a sessões de usuários, estados e outros dados menores.

WEB STORAGE

Os cookies apresentam um problema de desempenho, enviando dados a cada nova requisição do cliente de volta ao servidor para verificação. Por isso, surgiram novos métodos, como o Web Storage, que armazena dados com a estrutura de chave e valor, permanentemente ou temporariamente (os dados são apagados ao fechar o navegador). É excelente para armazenar dados simples, como nome e foto de perfil de um usuário.

INDEXED DB

Esta opção oferece um sistema de banco de dados completo, sendo facilmente utilizado para armazenar estruturas de dados mais complexas, como postagens recorrentes em uma rede social.

CACHE API

O funcionamento deste método de armazenamento é um pouco diferente, pois apenas armazena respostas HTTP do servidor. No entanto, há algo especial: os service workers. São processos diretamente relacionados ao seu domínio/site de origem, interceptando as requisições do cliente e respostas do servidor, podendo tratá-las conforme desejado pelo desenvolvedor. Assim, os service workers podem interceptar as respostas do servidor e usar o Cache API para armazenamento, permitindo um site completamente offline.

CONCLUSÕES

Claro que poderíamos nos utilizar de outras ferramentas para tal, como o Redis; contudo, temos um grande leque de soluções disponíveis no contexto de sites web, quase que nativamente (pois essas soluções são, em sua grande maioria, APIs escritas em JavaScript) para economia de recursos, melhoria de desempenho e maior satisfação do cliente. That's all, folks!

REFERÊNCIAS

https://developer.mozilla.org/pt-BR/docs/Learn/JavaScript/Client-side_web_APIs/Client-side_storage#offline_asset_storage
https://redis.io/docs/manual/client-side-caching/
https://developer.mozilla.org/pt-BR/docs/Web/API/Service_Worker_API
https://developer.mozilla.org/pt-BR/docs/Web/API/Cache
https://developer.mozilla.org/pt-BR/docs/Web/API/IndexedDB_API
https://developer.mozilla.org/pt-BR/docs/Web/API/Web_Storage_API

Top comments (0)