Utilizando cache nos navegadores para otimizar requisições
O cache de recursos é uma prática comum para otimizar o desempenho de páginas da web, reduzindo a quantidade de dados transferidos e melhorando o tempo de carregamento. Neste contexto, a utilização de cache nos navegadores é uma estratégia eficaz para minimizar o número de requisições feitas ao servidor.
Um exemplo disso é adicionar parâmetros diferentes a URLs de imagens para evitar o carregamento de versões em cache.
<div class="gallery-img">
<img
src="http://source.unsplash.com/random/360x360"
alt="random image from unsplash"
/>
</div>
<div class="gallery-img">
<img
src="http://source.unsplash.com/random/360x360"
alt="random image from unsplash"
/>
</div>
Ambas as imagens têm URLs idênticas, o que leva ao carregamento em cache da mesma imagem. Para contornar isso, pode-se adicionar parâmetros diferentes à URL, forçando o navegador a considerar cada URL como única:
<div class="gallery-img">
<img
src="http://source.unsplash.com/random/360x360?r=1"
alt="random image from unsplash"
/>
</div>
<div class="gallery-img">
<img
src="http://source.unsplash.com/random/360x360?r=2"
alt="random image from unsplash"
/>
</div>
Essa abordagem cria URLs únicas para cada imagem, evitando o carregamento em cache e garantindo que o navegador faça uma nova requisição ao servidor para cada imagem. Ao adicionar um parâmetro de consulta diferente, você contorna o cache existente para essas imagens específicas.