Como os Navegadores Armazenam Dados

Os navegadores fazem mais do que apenas exibir sites. Eles atuam como gerenciadores de dados locais. Eles armazenam informações no seu dispositivo para tornar a navegação mais rápida e fácil.

Você deve conhecer as três principais maneiras pelas quais os navegadores armazenam dados:

• Cookies • Cache do Navegador • Web Storage

Cookies Cookies são pequenos arquivos de texto. Os sites os utilizam para lembrar de você. Eles armazenam suas sessões de login e configurações de idioma.

Como funcionam:

  • Você visita um site.
  • O site envia um cookie para o seu navegador.
  • O seu navegador o salva.
  • Na sua próxima visita, o seu navegador envia esse cookie de volta para o servidor.

Tenha em mente:

  • Cookies têm um limite minúsculo de 4KB.
  • Eles são enviados com cada requisição, o que pode tornar as coisas mais lentas.
  • Nunca armazene senhas em cookies.

Cache do Navegador O cache armazena arquivos pesados, como imagens, CSS e JavaScript. Seu objetivo é a velocidade.

Como funciona:

  • Você visita um site pela primeira vez.
  • O seu navegador baixa todos os arquivos e os salva no cache.
  • Na próxima vez que você visitar, o navegador carregará os arquivos do seu dispositivo em vez da internet.

Benefícios:

  • As páginas carregam muito mais rápido.
  • Utiliza menos largura de banda de internet.
  • Reduz a carga no servidor.

Web Storage Este é um recurso do HTML5. Ele permite que os sites armazenem dados como pares chave-valor. É mais eficiente do que os cookies porque não é enviado ao servidor com cada requisição.

Existem dois tipos:

  • Local Storage: Os dados permanecem mesmo se você fechar o navegador. Armazena cerca de 5MB a 10MB.
  • Session Storage: Os dados desaparecem quando você fecha a aba.

Casos de uso:

  • O Local Storage é ótimo para configurações de modo escuro.
  • O Session Storage funciona bem para dados temporários de formulários.

Resumo

  • Use Cookies para sessões de login e comunicação com o servidor.
  • Use o Cache para acelerar o carregamento do site com recursos estáticos.
  • Use o Web Storage para maiores quantidades de dados no lado do cliente.

Fonte: https://dev.to/dailycodetools/how-browser-stores-data-cookies-cache-storage-25-jun-0346-m7h