Atualmente estou trabalhando com uma plataforma de E-commerce e preciso otimizar o carregamento das páginas.
Porém os elementos HTML são gerados durante a build e eu não tenho acesso para inserir loading="lazy".
Alguém tem ideia do que posso fazer? Seria possível rodar um script antes das imagens serem baixadas para
Olá, qual é a ferramenta de build?
Essa alteração deveria ser feita durante o build e dependendo do que você está usando para fazer o build pode ter algum transform para aplicar isso para você.
Filipe, estou usando a plataforma VTEX de ecommerce. Porém é a versão legado da aplicação. Minha missão é corrigir alguns problemas críticos e preparar caminho para migrar para a plataforma mais atual.
Eu gostaria de otimizar o site para Core Web Vitals. Mas estou quase abrindo mão disso e focando em otimizar apenas depois da migração.
É.. sem acesso ao HTML vai ser difícil.
Pesquisei um pouco pra ver se algum JS conseguiria fazer isso, mas pelo jeito não funciona não.
Tinha uma tecnica de remover so atributos "src" das imagens, mas já não funciona mais.
Adicionar "loading=lazy" depois da pagina já carregada tbm não faz sentido.
Talvez você tenha um chance SE o seu JS começar a ser executado antes document.ready , mas isso exigiria conseguir modificar o HTML pra ler e executar seu JS bem no início do carregamento.
Confesso que, na minha cabeça, a solução vai ficar tão, mas tão dificil, que eu insistiria na ideia de conseguir modificar o processo de build pra inserir esses atributos.
Eu to quase sacrificando essa ideia 😅
O pior é que não tenho controle do processo de build (pelo menos acredito não ter).
Estou trabalhando com um ecommerce na plataforma VTEX CMS legado. Então creio que nem estão mais atualizando a aplicação.