Existem diversas abordagens disponíveis para implementar o carregamento lento (lazy loading) em seu site. Confira nossa lista com os melhores plugins para WordPress que oferecem suporte a carregamento lento.
Existem inúmeros plugins gratuitos no diretório do WordPress que podem ser usados para carregar imagens e vídeos de forma assíncrona. Depois de analisar dezenas de plugins e testar alguns, encontramos dois que aumentam significativamente o desempenho do site. Se você estiver interessado em implementar o carregamento assíncrono, considere as opções abaixo.
Usando o WP Rocket (Premium)
O WP Rocket é a abordagem mais simples para implementar carregamento lento em seu site. Além disso, o processo de ativação leva menos de um minuto. LazyLoad é o nome do plugin incluído no WP Rocket como sua versão de carregamento lento de imagens.
Quando o LazyLoad está ativado, o WP Rocket interrompe imediatamente o carregamento lento de imagens nativo do WordPress para evitar possíveis problemas.
Siga os passos abaixo para ativar o recurso LazyLoad do WP Rocket:
- Você pode ativar o LazyLoad acessando Configurações > WP Rocket > Painel de mídia dentro da sua instalação do WordPress.
- Clique em “Ativar para imagens” na área LazyLoad, na parte superior da tela.
- Clique em “Salvar alterações” após fazer sua seleção.
Isso é tudo o que ainda precisa ser feito. Como resultado, os visitantes poderão notar lentidão no carregamento das fotos.
O LazyLoad oferece carregamento lento para elementos HTML adicionais, como iframes e vídeos, em contraste com a abordagem nativa do WordPress. Além disso, ele utiliza carregamento lento para imagens de fundo caso essas imagens sejam aplicadas diretamente em componentes HTML específicos.
Se você deseja usar a funcionalidade nativa de carregamento lento de imagens do WordPress, pode desativar a opção LazyLoad no WP Rocket. Por outro lado, essa nova propriedade de carregamento ainda não é compatível com todos os navegadores. Além disso, a instalação do WordPress é focada apenas em fotos. Portanto, o LazyLoad do WP Rocket ainda é a melhor alternativa, principalmente se o seu site tiver muitas imagens, vídeos e conteúdo incorporado.
Pontos importantes a observar ao ativar o carregamento lento nativo do WP Rocket
Embora o WP Rocket não inclua compatibilidade automática com navegadores Chrome que utilizam carregamento lento nativo, você ainda tem a opção de habilitar o suporte ao carregamento lento nativo do Chrome por meio de um plugin auxiliar. Da mesma forma, isso se aplica mesmo que o WP Rocket não inclua compatibilidade automática com outros navegadores que utilizam carregamento lento nativo.
Você pode garantir o seguinte usando este útil plugin:
- Cada uma de suas fotos conterá a sintaxe HTML essencial para usar o carregamento lento nativo; navegadores compatíveis com o Chrome utilizarão automaticamente o carregamento lento nativo; todos os outros navegadores usarão automaticamente o LazyLoad do WP Rocket.
- Você tem a opção de continuar usando nossa robusta tecnologia LazyLoad ou de alternar para o recurso de carregamento lento integrado do Chrome.
A decisão é sua! Primeiro, teste as duas abordagens no local escolhido e selecione a que funcionar melhor para você.
Usando o Lazy Load a3 (gratuito)
Se você procura uma opção gratuita, recomendamos o plugin a3 Lazy Load vídeos no seu site .
Além disso, este plugin auxilia no carregamento lento de imagens e vídeos externos. A implementação nativa do WordPress não realiza essa ação.
Você pode instalar e ativar este plugin a partir do painel do WordPress. Agora, você pode personalizar as configurações da ferramenta.
Passo 2: Ajuste as configurações de imagem do plugin
Em seguida, acesse Configurações > a3 Lazy Load. Se você verificar em Ativação do Lazy Load, o plugin estará ativado por padrão após a instalação.
Agora, abra a aba de imagens LazyLoad. Você pode (1) escolher quais imagens do site devem ter o carregamento atrasado e (2) fornecer uma alternativa para navegadores que não aceitam JavaScript. Para imagens cujo carregamento você não deseja atrasar, você pode (3) definir uma classe CSS:
As configurações padrão têm todas as opções ativadas . Recomendamos fortemente que você mantenha essa configuração. Crie uma classe CSS que permita ignorar o carregamento diferido para imagens específicas.
Passo 3: Ajuste as configurações de vídeo do plugin
A aba "Carregamento Lento de Vídeos e iframes" é o próximo passo. Com o a3 Lazy Load, você pode selecionar o carregamento atrasado para clipes específicos, assim como faz com imagens.
O plugin permite vídeos em (1) conteúdo e widgets e fornece (2) um recurso alternativo para navegadores que não suportam JavaScript:
Você pode especificar uma classe CSS nas configurações de vídeo (3) para excluir vídeos específicos do carregamento diferido. Se você quiser uma configuração mais simples, use a mesma classe que você escolheu na seção de imagens.
Mais plugins de carregamento lento para WordPress
Além do WP Rocket e do A3 Lazy Load, existem vários outros plugins úteis para carregamento lento disponíveis que você pode considerar:
- Carregamento lento para vídeos
- BJ Lazy Load
- Carregar mais produtos para WooCommerce
- Rolagem infinita do WordPress – Carregar mais via Ajax
- Carga condicional do Disqus
- Carregamento lento para comentários
Considerações finais
É crucial estar ciente de quaisquer conflitos potenciais sempre que você atualizar ou modificar seu site. Confira esta lista de problemas frequentes associados ao carregamento lento (lazy loading) caso descubra que habilitar esse recurso tenha causado a inoperabilidade de alguma parte do seu site.
É possível que ocorram incompatibilidades devido à ausência do recurso de carregamento lento (lazy loading) nas imagens carregadas por plugins como Revolution Slider e Envira Gallery. A lista completa de plugins compatíveis pode ser encontrada aqui.
Este artigo, assim como muitos outros, pode ser encontrado no Seahawk Media Blog .