Demandas de otimização do E-commerce depois de uma analise de desempenho e velocidade.

Reduzir o JavaScript não utilizado

• Problema
JavaScript não utilizado é um problema para o desempenho do site, considerando que o navegador fará o download, adiará o tempo de interação, para não ter nenhuma utilidade.
Foram encontrados 6 arquivos Js que podem ser otimizados.

• Necessidade
Para diminuir o consumo de bytes da atividade da rede, reduza o JavaScript não usado e adie o carregamento de scripts até que eles sejam necessários.

Reduzir o tamanho dos arquivos javascript e CSS

• Problema
Arquivos Js não compactados geram um tempo de carregamento maior, além do tempo de análise de scripts.
Foi encontrado 1 arquivo para ser minificado.

• Necessidade
Realizar a minificação do arquivo Js:

https://images.tcdn.com.br/files/1118494/themes/13/js/appreact.js?d2a9ac42bae6afd6363d51f6890bbb37

Peso Atual: 278,5 KiB
Possível Economia: 123,3 KiB

Ativar lazy load (carregamento lento) para as imagens

Temos 10 oportunidades de inserção de lazy-load para aprimorar o carregamento inicial do site e tempo mínimo para primeira interação do usuário.

Com a aplicação do lazy load nas imagens, conseguimos atrasar o carregamento das imagens que não aparecem no primeiro print da página, isso impacta positivamente na performance do site.

Para aplicações em imagens chamadas por Javascript, na chamada das imagens, deve ser realizado a inserção, o que não temos acesso para modificação.

Onde Aplicar?
1. Home
1.1. Carrossel inicial. Aplicar a partir do segundo banner do carrosel.
(Anexo 1.1)

1.2 Imagens dos produtos que aparecem na Home. Imagens chamadas através de Js. (Em aberto)
(Anexo 1.2-1 e 1.2-2)

1.6 Imagem Sobre a Diveneza. (Em aberto)
(Anexo 1.3)

2. Categoria
2.1 Imagens dos produtos. As imagens dos produtos também são chamadas por Js. (Em aberto)
Essa aplicação deverá ser realizada nas imagens que não aparecem na renderização inicial, tanto mobile quanto desktop. Então, a partir da segunda linha de produtos listados, realizar essa aplicação.
(Anexo 2.1-1 e 2.1-2)

3. Página de Produto
3.1 Bandeiras de cartões das formas de pagamento. As imagens são chamadas por Js. (Em aberto)
(Anexo 3.1)

3.2 Imagens dos produtos chamados na seção Produtos Semelhantes. Imagens chamadas por Js. (Em aberto)
(Anexo 3.2)

3.3 Imagens em destaque do Produto da página. Aplicar lazy load nas imagens em destaque, exceto a principal (que aparece primeiro na página) (Em aberto)
(Anexo 3.3)