Deixa progressivamente preguiçoso carregar imagens com baunilha JS

Todo site moderno precisa ser rápido. Embora existam muitas técnicas e plugins para aumentar a velocidade da página, você ainda pode não saber por onde começar.

O script progressivamente é um excelente recurso para aumentar a velocidade da página. Ele funciona como um script de carregamento lento que carrega imagens progressivamente à medida que o usuário rola a página.

É um projeto de código aberto gratuito para que você possa fazer o download e executá-lo em qualquer site. Mais isso funciona com 100% de baunilha JS, por isso tem zero dependências que podem sobrecarregá-lo.

Você pode dar uma olhada na demonstração ao vivo na página inicial Progressiva.

É um pouco diferente de outros scripts de carregamento lento porque mantém os tamanhos de imagem fixos para toda a página. este evita o salto de página sempre tão irritante que você vê sempre que as imagens são carregadas rapidamente e aumentar a altura do conteúdo.

E os espaços reservados para imagens na verdade parecem com as imagens que você está carregando. Impressionante!

Esta técnica elegante dá aos visitantes a chance de pré-visualize como as imagens se parecem antes de serem carregadas. Tudo é tratado por meio do JavaScript, que verifica a localização do usuário na página e pré-carrega as imagens à medida que elas são exibidas.

Progressivamente tem um API bastante extensa por isso é uma ótima opção para desenvolvedores da web. A configuração pode ficar técnica, por isso ajuda se você souber o que fazer em relação à codificação básica de frontend.

Mas você pode aprender mais sobre a página principal do GitHub, que inclui a documentação completa da API, instruções de configuração e fragmentos de código de amostra que você pode copiar / colar para seus projetos..

Se você precisa de um script de imagem de carregamento lento confiável sem as dependências desagradáveis, dê uma chance Progressiva. É totalmente gratuito e oferece muita personalização para desenvolvedores.

Também dê uma olhada no Progressively GitHub para aprender mais e para pegar o código-fonte para download.