Blog de notícias: extensões WordPress e Joomla

Como agrupar e reduzir recursos no WordPress

file-group-and-minify

Ter o melhor desempenho possível é o sonho de todos que gerenciam um site, agrupam e diminuem recursos no WordPress é uma das melhores coisas que podemos fazer para isso, mas pode ser muito difícil. Agrupar todos os seus recursos (arquivos css e js principalmente) pode expor seu site se você não for um desenvolvedor, pois isso pode gerar conflitos.

WP Speed of Light é a melhor solução para executar o seu site wordpress, porque ele tem muitas opções para fazer o seu site carregar rapidamente com um painel muito amigável e, sim, uma dessas opções é agrupar e reduzir os recursos. A inclusão / exclusão de um único arquivo do processo de agrupamento e de exclusão é uma chave para uma otimização personalizada sem conflitos.

Vamos usar um exemplo de site wordpress para este post e vamos aprender como fazer isso para que o processo de configuração de tudo seja mais fácil.

 

Como fazer um WordPress JS e CSS minification

Vamos aprender como fazer um wordpress js e CSS minification mas primeiro, precisamos saber o que significa o minification “Minification refere-se ao processo de remoção de dados desnecessários ou redundantes sem afetar como o recurso é processado pelo navegador - por exemplo, comentários de código e formatação, remoção de código não utilizado, uso de nomes de variáveis ​​e funções mais curtos e assim por diante ”.

Agora, o que vamos fazer é um teste de velocidade para a nossa página, a fim de ver as alterações, para este exemplo, estamos usando um site com woocommerce e alguns produtos para a primeira vez que ele irá carregar um pouco lentamente.

 

antes do teste

 

Sim, 2,79 segundos para carregar a página, não é ruim, mas poderia ser melhor, só vamos diminuir o js e CSS e ver a diferença, vá para WP Speed of light> SpeedUp> Group e Minify, você será capaz de ver o menu com todas as opções para minimizar. A versão gratuita do plugin inclui a opção group e minify, mas a exclusão de arquivos visuais está disponível apenas na versão do PRO Addon.

 

painel de grupo e minify

 

Opções de addon PRO são: Excluir script in-line (Excluir script in-line da minificação), mover scripts para rodapé (ele permite acelerar o site movendo todos os scripts minificados para o rodapé), fonte Group e Google Fonts (fontes locais do grupo e fontes do Google em um único arquivo para ser servido mais rápido) e exclusão de arquivos avançados.
 
Você tem a opção de minimizar, como você pode ver, JS, CSS e também o HTML agora basta ativar essas opções, clicar em salvar e todos os seus recursos serão minificados imediatamente, pode ter problemas já que é uma configuração avançada mas tudo pode ser corrigido com a exclusão de alguns códigos e arquivos (com o addon pro).

 

minify-resources

 

 

Agora, todo o trabalho de desenvolvedor que pode levar horas é feito em apenas alguns segundos.

 

Próxima etapa, o WordPress otimiza CSS e JS

Com este plugin vamos deixar que o wordpress otimize CSS e js apenas ativando as opções de grupo no painel, vá para WP Speed of Light> SpeedUp> Group e Minify, você poderá ver um painel com as opções para agrupar CSS e js.

Essas opções permitem:

  • Group JS: Agrupar vários arquivos Javascript em um único arquivo minimizará o número de solicitações HTTP
  • Agrupar CSS: agrupar vários arquivos CSS em um único arquivo minimizará o número de solicitações HTTP.

Solicitações HTTP: são solicitações feitas ao servidor toda vez que selecionamos algo ou acessamos outra página no mesmo site, portanto, se pudermos reduzir essas solicitações, o tempo de carregamento será reduzido.

Para verificar quantos arquivos, scripts você pode agrupar em seu site, basta abrir o console do navegador (clique com o botão direito do mouse> Inspecionar ou F12) e abra o painel de rede.

 

lista-script-cromo

Você pode listar todos os arquivos carregados por tipo, aqui neste exemplo, cliquei apenas na lista de arquivos JS.

Agora que estamos nessa configuração, basta habilitar as opções de grupo (Grupo CSS e Grupo JS) e clicar em salvar, lembre-se de que essas opções devem ser usadas com cautela e você terá que testar sua página pois pode causar conflitos .

 

Vamos levar a sério e otimizar o peso da fonte

O que? Outra otimização? Sim! você será capaz de otimizar o peso da fonte e será tão fácil quanto ativar a opção nas configurações, basta ir para WP Speed of Light> SpeedUp> Agrupar e Minimizar> Fontes do Grupo e Google Fonts opção.
Agrupar fontes e a opção de fontes do Google permitirá agrupá-las em um único arquivo para ser exibido mais rapidamente, isso é bastante prático, já que a maioria dos temas e layouts do WordPress vem com 2 ou fontes por padrão com todas as declinaisons (regular, negrito e itálico). ...)

Apenas habilite essa opção, clique em salvar e todas as fontes serão agrupadas.

 

fonte do grupo

 


Agora que ativamos todas as opções para minimizar e agrupar os recursos, devemos ver uma diferença no tempo de carregamento do nosso site. Vamos verificar a velocidade.

 

teste depois

 

Que diferença, de 2,8 a 0,56 segundos! Como dissemos no começo deste post, podemos melhorar o tempo de carregamento;)

 

Como usar a exclusão de minificação de arquivo

A minificação pode causar problemas em seu site, principalmente quando você agrupa determinados arquivos que contêm erro no erro de sintaxe ou variável semelhante, nome da classe. É por isso que com a opção "exclusão de minificação de arquivos", você poderá excluir arquivos do processo de minificação e de grupo, vá para WP Speed of Light> SpeedUp> Group e Minify, você será capaz de ver o Exclusão avançada de arquivos opção.

Para usar a exclusão avançada de arquivos, você terá que executar uma varredura. Primeiro, ative a opção e clique em Executar varredura.

 

alerta de conflito de recurso de grupo

 
Para poder listar o script carregado em seu site, o WP Speed of Light precisa digitalizar sua pasta para listá-los. Eles geralmente estão todos contidos em sua pasta / wp-content, que agrupa todos os seus plugins e temas. Selecione essa pasta (pelo menos) e clique em "Escaneie agora"

 

selecionar pastas para digitalizar

 

Ele irá executar uma varredura, finalmente, clique nos resultados da visualização quando a varredura for concluída.

 

digitalizado

 

Uma lista de arquivos classificados por tipo (All, JS, CSS, Font) deve ser exibida abaixo. Se você identificou um arquivo que causa problemas, ao ativar o grupo de arquivos e a minificação, você pode excluí-lo daqui usando um simples ON / OFF switcher.

 

excluir arquivos

 

Isso ajudará você a excluir arquivos e, dessa maneira, resolver facilmente qualquer problema que possa existir ao minificar recursos ... O processo de agrupar e minificar ainda requer algum trabalho, especialmente em testes, mas definitivamente vale a pena o esforço.
 
Vá em frente e tente WP Speed of Light: https://www.joomunited.com/wordpress-products/wp-speed-of-light

3
Sincronização instantânea de arquivos do Google Drive com o Dro ...
Ligando WordPress com a nuvem usando o WP Media Fo ...
 

Comentários

Nenhum comentário feito ainda. Seja o primeiro a enviar um comentário
Já registrado? Entre aqui
Convidado
Segunda-feira, 16 setembro 2019
Se você deseja se registrar, preencha os campos nome de usuário, senha e nome.

Captcha Image