post

Calculando Peso Total das Imagens Carregadas em uma Página

Publicado em: 21/11/2023

Categorias: BlogJavaScriptJS

Para medir o peso total das imagens em uma página da web, você pode seguir algumas abordagens diferentes, porem neste artigo, vamos usar o console do navegador para ajudar nessa tarefa:

1 – Abra o console do desenvolvedor no seu navegador (normalmente, pressionando F12 ou clicando com o botão direito e selecionando “Inspecionar” e, em seguida, indo para a guia “Console”).

2 – Use JavaScript para percorrer todas as imagens na página e somar seus tamanhos.

var totalSize = 0;
document.querySelectorAll('img').forEach(function(img) {
    totalSize += img.naturalWidth * img.naturalHeight * 4; // Considerando 4 bytes por pixel (RGBA)
});
console.log('Peso total das imagens: ' + (totalSize / (1024 * 1024)).toFixed(2) + ' MB');

Essa abordagem usa o tamanho natural das imagens, o que nem sempre é preciso, mas pode dar uma boa estimativa.

Use este recurso com moderação, apenas para comparação e analise interna.


Link de compartilhamento

Compartilhe esse conteudo nas redes sociais ou por mensagem usando o link curto abaixo. Basta clicar em cima do link para copiar.

bruno.art.br/pb/3902

ID de Referência: 3902

Sugira uma publicação

Envie uma mensagem para mim, e sugira alguma publicação de algum tema que tenha dificuldades de resolver.

Clique aqui e entre em contato


Comentários