Por que minha página da Web tem metade do tamanho no navegador do que no disco rígido?

Por que minha página da Web tem metade do tamanho no navegador do que no disco rígido?

Minha página da web com todos os seus ativos tem 1,7 MB em disco. E apenas 700kb na ferramenta de desenvolvimento do Chrome (guia rede). Por exemplo, meu CSS de 140 KB agora tem, de acordo com o Google, apenas 26 KB. O mesmo acontece com meu pacote js, ele vai de 330 kb a 90. Além disso, eu estava testando em uma sessão privada, sem cache do navegador.

Cabeçalhos de resposta que posso ver no chrome:

Connection:Keep-Alive
Date:Wed, 30 Sep 2015 14:25:35 GMT
ETag:"e621f4-42c5-520f72d888210"
Keep-Alive:timeout=3, max=100
Server:Apache/2.2.16 (Debian)
Vary:Accept-Encoding

linha do tempo da rede

tamanho real

problema de gzip

Responder1

Parece que você não está vendo tudo nas suas ferramentas de desenvolvimento.

Não use linhas de solicitação pequenas, caso contrário você verá SOMENTE o tamanho compactado dos seus arquivos da web.

  1. O tamanho do arquivo compactado enviado do servidor
  2. Seu navegador extraiu o arquivo gzipado e ele contém esta quantidade de KB

insira a descrição da imagem aqui


A razão pela qual suas imagens estão mostrando um tamanho de compactação maior é porque PNG e JPG são um formato compactado, então seu servidor web está realmente criando sobrecarga desnecessária ao tentar recompactá-lo e essa sobrecarga extra está sendo traduzida em desperdício de tempo de CPU e adicional KB.

Se você estiver executando o Apache e tiver acesso a httpd.confele, sugiro adicionar uma linha semelhante a esta:

# Não comprima essas imagens
SetEnvIfNoCase Request_URI .(?:gif|jpe?g|jpg|ico|png) no-gzip não varia

Isso vale para imagens que já estão fortemente otimizadas e compactadas.

Na minha captura de tela você pode ver que 1 + 2 são imagens maiores e não otimizadas, mas 3.jpg já está reduzido ao básico, então a compactação não ajudou no # 3, mas ajudou 1 + 2:

insira a descrição da imagem aqui

informação relacionada