Cookies vs Local Storage: Quais são as principais diferenças?

As ✅cookies e o ✅local storage desempenham um papel crucial na melhoria da experiência dos utilizadores, fornecendo conteúdo personalizado e permitindo várias funcionalidades nos websites. Mas sabes quais as principais diferenças entre estas duas alternativas?

O que são cookies?

No contexto da navegação na Web, as cookies são pequenos ficheiros de texto que os websites armazenam no dispositivo de um utilizador. Contêm informações como as preferências, o histórico de navegação, as credenciais de início de sessão, entre outros dados. As cookies são utilizadas principalmente💥️ para melhorar a experiência do utilizador, recordando as suas preferências e fornecendo conteúdos personalizados.

As cookies funcionam como um canal de comunicação entre um website e o browser. Quando o utilizador visita um website, o servidor envia uma cookie para o seu browser, que a armazena no seu dispositivo. Posteriormente, sempre que visitar novamente o mesmo website, o seu browser envia a cookie armazenada de volta para o servidor. Isto permite que o website o reconheça.

1. Criação e armazenamento de cookies:

Quando um utilizador visita um website, o servidor pode definir uma cookie incluindo "Set-Cookie" no ✅header da resposta HTTP. O seguinte código demonstra como uma cookie chamada "username" é definida com o valor "RuiJorge":

 HTTP/1.1 200 OKSet-Cookie: username=RuiJorge

O browser do utilizador recebe esta resposta e armazena a cookie localmente. A partir desse momento, sempre que o utilizador fizer pedidos subsequentes ao mesmo website, a cookie será automaticamente incluída nos ✅headers do pedido.

2. Aceder aos valores das cookies:

Para aceder ao valor da cookie armazenada em JavaScript, é possível utilizar a propriedade ✅document.cookie. Esta propriedade retorna uma ✅string que contém todas as cookies associadas ao site atual. Eis um exemplo de acesso ao valor da cookie "username":

 // Retorna uma string com todas as cookiesconst cookies = document.cookie; // Output: "username=RuiJorge"console.log(cookies); 

3. Alterar e eliminar cookies:

As cookies podem ser modificadas ou eliminadas definindo uma nova cookie com valores atualizados ou dando instruções ao browser para a remover. Para alterar uma cookie, pode seguir um processo semelhante ao da definição de uma nova cookie:

 document.cookie = "username=RuiJorge"; // Altera o valor da cookie "username"

Para eliminar uma cookie, pode definir a sua data de expiração para uma que já passou:

 document.cookie = "username=; expires=Thu, 01 Jan 2000 00:00:00 UTC"; // Apaga a cookie "username"

Lembre-se de que, ao alterar ou apagar cookies, tem de se certificar de que o nome e o ✅path da cookie correspondem à cookie original. Compreender os princípios de funcionamento das cookies é fundamental para compreender a sua funcionalidade💥️ e utilizá-las eficazmente no desenvolvimento Web. Ao utilizar os cookies de forma adequada, pode criar experiências personalizadas, implementar a gestão de sessões e melhorar as interações do utilizador no seu website.

O que é o Local Storage?

Embora as cookies sejam amplamente usadas e tenham sido o mecanismo de referência para armazenar dados no lado do cliente, elas têm as suas limitações. Uma dessas limitações é o tamanho relativamente pequeno da quantidade de dados que podem ser armazenados. 💥️É aqui que o local storage entra em ação.

O local storage (armazenamento local) é um mecanismo de armazenamento na Web que permite aos websites armazenar uma maior quantidade de dados no dispositivo de um utilizador, para além das limitações de tamanho das cookies tradicionais. Ao contrário das cookies, que são enviadas para o servidor com cada pedido, os dados do local storage permanecem no lado do cliente e não são enviados automaticamente para o servidor.

Isto permite um acesso mais rápido às informações armazenadas, reduzindo a necessidade de pedidos frequentes ao servidor💥️ e melhorando assim a performance do sistema.

 // Guarda dadoslocalStorage.setItem(& key& , & value& );// Retorna dadoslocalStorage.getItem(& key& );// Remove dadoslocalStorage.removeItem(& key& );

Benefícios e casos de utilização do local storage

O local storage oferece várias vantagens em relação às cookies tradicionais, tornando-a uma escolha apelativa para os programadores. Eis alguns dos principais benefícios e casos de uso:

Quais as principais diferenças?

Para concluir, deixamos uma tabela retirada do website GeeksForGeeks que resume de forma bastante simplificada o tema abordado.

💥️Leia também:

Google lança versão paga do popular browser Chrome

O que você está lendo é [Cookies vs Local Storage: Quais são as principais diferenças?].Se você quiser saber mais detalhes, leia outros artigos deste site.