Quando se trata de desempenho do WordPress, temos muito o que falar sobre plugins. Cada plugin adiciona código PHP que precisa ser executado, é geralmente inclui scripts e estilos e alguns podem até mesmo executar consultas adicionais no banco de dados. Isso significa que plugins desnecessários podem afetar a velocidade da página e impactar negativamente a experiência do usuário e a classificação da página nos mecanismos de busca.
Por exemplo, considere um plugin que cria e exibe formulários na página inicial, como o Contact Form 7. O melhor plugin SEO all-in-one. Tipicamente, você só precisa de um formulário em uma única página, mas o ideal é que você queira incorporar um formulário em qualquer página usando o shortcode do plugin. Por esse motivo, o Contact Form 7 carrega scripts e estilos em todas as páginas do seu site.
Mas você realmente quer rodar o código do plugin e incluir scripts e estilos em todas as páginas do seu site WordPress?
Nesta postagem, mostrarei como evitar que plugins desnecessários sejam carregados em postagens/páginas específicas, para que você possa instalar plugins adicionais (não enlouqueça, é claro) e ainda carregar seu site do WordPress rapidamente. Para realizar essa tarefa, desativaremos os plugins do WordPress programaticamente em postagens e páginas específicas. Este é um processo de 4 etapas:
- Escolher os plugins mais populares que atendam suas necessidades e comparar seus recursos e efeitos sobre a velocidade da página.
- Programaticamente listar e filtrar plugins antes de carregar a página.
- Programaticamente filtre e desative plugins desnecessários com um plugin mu.
- Filtrar e desativar plugins desnecessários usando um plugin.
- Track the site performance.
Vamos nos aprofundar no tema.
As Três Regras Gerais a Seguir na Escolha de um Plugin
As regras gerais a seguir podem ser muitos úteis no processo de escolha de um plugin:
- Instale somente plugins bem codificados de desenvolvedores confiáveis: considere o número de instalações ativas, avaliação dos usuários, suporte ao cliente, frequência de atualizações e todas as informações relevantes e úteis que venham da comunidade WordPress.
- Prefira plugins escaláveis: compare plugins similares em termos de desempenho através de ferramentas de desenvolvedores nos navegadores e/ou serviços on-line como Google Pagespeed Insights, Pingdom e GTmetrix para avaliar o impacto de cada plugin no tempo de carregamento da página.
- Não instale plugins desnecessários: pode parecer óbvio, mas vale a pena mencionar que você nunca deve instalar um plugin que realmente não precisa por questões de segurança e desempenho. Além disso, certifique-se de revisar seus plugins de tempos em tempos e desinstale aqueles que não precisa e não usa mais.
Um exemplo da vida real
Contact Form 7 é um excelente plugin que cria e exibe formulários no WordPress. Ele oferece um exemplo perfeito para nosso propósito, pois inclui os seguintes arquivos .js, mesmo que a página não apresente um formulário:
- style.css
- scripts.js
Um plugin pode tornar o seu site mais lento, mas podemos forçar o WordPress a desativar seletivamente os plugins, dependendo do URL de solicitação. Se você é um desenvolvedor, leia a próxima seção, onde aprenderemos a gerenciar plugins programaticamente e criar um plugin mu que filtre plugins desnecessários. Se você não é um desenvolvedor, fique à vontade para acessar a seção dedicada a plugins que permitem filtrar e organizar plugins.
Como Obter uma Lista de Todos os Plugins Ativos Programaticamente
Primeiramente, você pode obter uma lista de todos os plugins ativos em seu site WordPress com um simples trecho de código PHP. Você pode adicionar o seguinte código em um plugin personalizado ou no editor de um plugin gratuito do WordPress, como Code Snippets. Se você decidir usar seu plugin personalizado, não se esqueça de adicionar o cabeçalho do plugin como visto abaixo.
Cada plugin ativo é armazenado em wp_options
tabela onde options_name
é active_plugins
. Então podemos extrair a lista desses plugins com um simples chamado get_option
. Aqui está o código:
<?php
/**
* @package active-plugins
* @version 1.0
*
* Plugin Name: Active Plugins
* Plugin URI: http://wordpress.org/extend/plugins/#
* Description: This is a development plugin
* Author: Your Name
* Version: 1.0
* Author URI: https://example.com/
*/
add_shortcode( 'activeplugins', function(){
$active_plugins = get_option( 'active_plugins' );
$plugins = "";
if( count( $active_plugins ) > 0 ){
$plugins = "<ul>";
foreach ( $active_plugins as $plugin ) {
$plugins .= "<li>" . $plugin . "</li>";
}
$plugins .= "</ul>";
}
return $plugins;
});
Altere os detalhes do plugin e salve o arquivo active-plugins.php
e envie para o seu arquivo /wp-content/plugins/
. Crie uma nova postagem no blog e inclua o código [activeplugins]
. Agora deve exibir uma lista de todos os plugins ativos.
Com isso sendo feito, podemos dar um passo além e adicionar ou remover plugins programaticamente aproveitando o filtro option_active_plugins
. Este filtro pertence ao grupo de filtros option_$option_name, que permitem filtrar qualquer opção depois de ser recuperada do banco de dados. Como todos os plugins ativos são armazenados em wp_options
da tabela option_value
é active_plugins
, o option_active_plugins
filtro fornece uma maneira de ativar ou desativar programaticamente plugins.
Portanto, podemos ativar um plugin programaticamente. Por exemplo, você quer ativar o plugin ACF. Aqui está o código:
add_filter( 'option_active_plugins', function( $plugins ){
$myplugin = "advanced-custom-fields/acf.php";
if( !in_array( $myplugin, $plugins ) ){
$plugins[] = $myplugin;
}
return $plugins;
} );
Neste exemplo, estamos assumindo que o plugin foi instalado e ainda não foi ativado.
O código acima simplesmente adiciona o plugin à lista de plugins ativos em todas as páginas do nosso site. Não é muito útil, mas você entendeu.
Além disso, o plugin deve carregar antes de qualquer outro plugin, caso contrário, nosso código não poderia funcionar como esperado. Para priorizar a carga do nosso plugin, temos que adicionar nosso script em um plugin Must-use.
Como Desenvolver um Must-use Plugin para Desativar Plugins Programaticamente
Vamos construir um plugin de uso obrigatório, que é um plugin que reside em um específico na sub-pasta /wp-content
, e é executado antes de qualquer plugin regular.
Infelizmente, nessa situação, não podemos usar tags condicionais, porque as tags de consulta condicionais não funcionam antes de a consulta ser executada. Antes disso, eles sempre retornam falso. Portanto, temos que verificar nossas condições de outra forma, por exemplo, analisando o URI da solicitação e verificando o caminho da URL correspondente.
Adicione o seguinte código ao arquivo active-plugins.php
então mova-o para /wp-content/mu-plugins
:
$request_uri = parse_url( $_SERVER['REQUEST_URI'], PHP_URL_PATH );
$is_admin = strpos( $request_uri, '/wp-admin/' );
if( false === $is_admin ){
add_filter( 'option_active_plugins', function( $plugins ){
global $request_uri;
$is_contact_page = strpos( $request_uri, '/contact/' );
$myplugin = "contact-form-7/wp-contact-form-7.php";
$k = array_search( $myplugin, $plugins );
if( false !== $k && false === $is_contact_page ){
unset( $plugins[$k] );
}
return $plugins;
} );
}
Vamos nos aprofundar neste código:
- parse_url retorna o caminho da URL solicitada.
- strpos encontra a posição da primeira ocorrência do
‘/wp-admin/’
e retorna falso se a string não for encontrada. A variável$is_admin
armazena o valor retornado - A condição impede que o filtro seja executado no painel de administração, para que possamos acessar com segurança as páginas de configurações do plugin. Se o URI de solicitação não contiver
'/wp-admin/'
, então invocamos o filtrooption_active_plugins
. - Por fim, se o plugin atual não estiver na matriz de plugins ativos e o URI da página atual não contiver
/contact/
, então removemos o plugin de$plugins
.
Agora salve seu plugin e faça o upload para o seu arquivo /wp-content/mu-plugins/
folder. Limpe o cache e adicione o código [activeplugins]
para várias páginas. Deve ser mostrado na lista apenas na página /contact/
.
Podemos, então, remover uma matriz de plugins de uma só vez com apenas um pouco de PHP adicional.
$request_uri = parse_url( $_SERVER['REQUEST_URI'], PHP_URL_PATH );
$is_admin = strpos( $request_uri, '/wp-admin/' );
if( false === $is_admin ){
add_filter( 'option_active_plugins', function( $plugins ){
global $request_uri;
$is_contact_page = strpos( $request_uri, '/contact/' );
$myplugins = array(
"contact-form-7/wp-contact-form-7.php",
"code-snippets/code-snippets.php",
"query-monitor/query-monitor.php",
"autoptimize/autoptimize.php"
);
if( false === $is_contact_page ){
$plugins = array_diff( $plugins, $myplugins );
}
return $plugins;
} );
}
Neste exemplo, primeiro definimos uma matriz de plugins a serem removidos e, em seguida, os removemos com array_diff. Esta função “compara array1 contra um ou mais outros arrays e retorna os valores no array1 que não estão presentes em nenhum dos outros arrays”.
Você pode fazer o download do código completo deste plugin no Gist.
Agora você pode fazer o upload do plugin para a pasta mu-plugins e inspecionar qualquer página do seu website. O mu-plugin pode ser personalizado, adicionando mais condições e verificando mais URIs, mas cada uma dessas condições deve ser adicionada manualmente ao código e no longo prazo, esse simples mu-plugin pode se tornar difícil e um incômodo de ser mantido.
Por esse motivo, você pode querer verificar os seguintes plugins.
Plugins que Filtram Plugins
Como uma alternativa, podemos optar por um dos plugins de qualidade que permitem adicionar filtros, que podem ser gerenciados pelo painel do administrador no WordPress.
Plugin Load Filter
Plugin Load Filter é uma opção gratuita para os usuários WordPress que precisam filtrar plugins sob condições diversas.
Atualmente, ele tem suporte para os seguintes recursos:
- Formatos de posts
- Tipos personalizados de posts
- Módulos do Jetpack
- WP Embed cartão de conteúdo
- Filtro de URL para especialista (API REST / Heartbeat / AJAX / AMP / etc)
Quando o filtro é ativado, o administrador pode especificar em que local do site ele foi aplicado, conforme demonstrado na imagem abaixo.
Plugin Organizer
Plugin Organizer é um plugin popular com mais de 10.000 instalações ativas e uma impressionante classificação de 5 de 5 estrelas. É um plugin mais abrangente que permite aos administradores do site:
- Desativar seletivamente os plugins por tipo de postagem e URL de solicitação
- Desativar seletivamente plugins por funções do usuário
- Criar grupos de plugins
- Alterar a ordem de carregamento dos plugins
- Características adicionais
A página de opções Global Plugins oferece uma facilidade com o recurso de arrastar e soltar que permite ao administrador desabilitar plugins globalmente, impedindo que o WordPress execute um ou mais plugins em qualquer local do seu site, a menos que o contrário seja especificado para posts ou páginas individuais. Esse mesmo recurso está disponível para a página de pesquisa e tipos de posts.
O plugin adiciona um meta box à tela de edição de posts para que o administrador possa sobrepor configurações globais e de tipos de posts. Esse recurso também pode ser ativado para tipos de posts, selecionando o item correspondente na tela General Settings. Um ótimo recurso é a Mensagem de Depuração do Organizador de Plugin, que fornece ao administrador do site informações úteis sobre os plugins que afetam todas as páginas do site.
Mais informações podem ser encontradas na documentacão.
Plugin Perfmatters
Uma abordagem um pouco diferente é encontrada no plugin Perfmatters. Essa é uma alternativa premium que permite ao administrador do site carregar de forma seletiva os recursos do tema e dos plugins, dependendo da URL ou do tipo personalizado de post. Essa é uma ótima ferramenta para otimização de plugins e temas. E foi desenvolvido por um membro da equipe Kinsta!
O plugin tem um recurso chamado Script Manager, onde tudo é agrupado pelo nome do plugin ou do tema. Isso torna super fácil desabilitar um plugin inteiro de uma só vez, ou arquivos CSS e JavaScript individuais dentro dele.
Você pode até mesmo desativar scripts com regex. Isso é especialmente útil para sites que possuem uma estrutura de URL mais complexa no local ou páginas geradas dinamicamente.
Ele é muito poderoso e pode aumentar drasticamente a velocidade dos seus sites WordPress (principalmente sua página inicial). Alguns exemplos do que pode ser feito com o plugin:
- Plugins de compartilhamento nas redes sociais só devem ser carregados em seus posts. Você pode desabilitá-los com facilidade em qualquer local e carregá-los apenas nos posts ou até mesmo em tipos personalizados de posts.
- O popular plugin Contact Form 7 é carregado em todas as páginas e posts. Você pode desabilitá-lo com facilidade em qualquer local com apenas um clique e habilitá-lo somente na sua página de contato.
- Se você fez o upgrade para o WordPress 5.0, mas não está usando o editor de bloco de Gutenberg, talvez ainda esteja usando o editor clássico, há dois scripts front-end adicionais que são adicionados a todo o site e que você pode desativar:
/wp-includes/css/dist/block-library/style.min.css
and/wp-includes/css/dist/block-library/theme.min.css
Você pode observar nesta análise do perfmatters que ele diminuiu o tempo total de carregamento em 20,2%. Somente na página inicial, ele foi capaz de reduzir o número de solicitações HTTP de 46 para 30! O tamanho da página também caiu de 506.3 KB para 451.6 KB.
Como Monitorar o Desempenho: As Ferramentas de Desenvolvedor no Navegador
Uma etapa fundamental na estrada rumo à otimização de desempenho é a medição do tempo de carregamento. Existem diversos plugins e ferramentas online que podem ser utilizadas para monitorar o desempenho de um site, como Google Pagespeed Insights e Pingdom. Mas, primeiro, podemos usar as Ferramentas de Desenvolvedor no navegador, que oferecem muitas informações relevantes.
O inspetor de cada navegador possui um painel Network que demonstra uma lista de solicitações da rede e informações relacionadas. Veja os links abaixo para acessar as documentações detalhadas:
Em uma instalação do WordPress com 18 plugins ativos, inspecionamos repetidamente uma página de postagem com o Firefox Dev Tools. Primeiro medimos a velocidade da página e listamos os recursos solicitados antes de instalar qualquer plugin de filtragem. A imagem a seguir mostra a saída da ferramenta de análise de desempenho disponível no monitor da Rede Firefox.
O Network Monitor oferece os seguintes resultados (cache vazio):
- Tamanho: 255.19 KB
- Tempo de carregamento: 1,24 segundos
- Solicitações: 12
Em seguida, instalamos o Plugin Organizer para prevenir que o WordPress executasse o plugin CF7. O gráfico de pizza mudou um pouco.
Agora a página carrega mais rapidamente (cache vazio):
- Tamanho: 104.21 KB
- Tempo de carregamento: 0,80 segundos
- Solicitações: 8
Na sequência, desativamos vários plugins desnecessários e a próxima imagem mostra o quanto melhoramos o desempenho da página.
Após desabilitar todos os plugins desnecessários, o cache vazio do navegador do Network Monitor retorna com os seguintes dados:
- Tamanho: 101.98 KB
- Tempo de Carregamento: 0,46 segundos
- Solicitações: 8
Podemos comparar os resultados dos nossos testes. O tamanho dos recursos foi reduzido em 60.04%, o tempo de carregamento foi reduzido de 1,24 segundos para 0,46 segundo e o número de solicitações HTTP caiu de 30 para 13.
Resumo
Quer você construa seus próprios scripts ou instale ferramentas de terceiros, organizar e filtrar plugins é algo que você deve sempre considerar quando se trata de otimização de desempenho. Lembre-se, nem todos os plugins são desenvolvidos com o desempenho em mente. Portanto, pode ser sensato levar algum tempo e determinar quais recursos de plugin (CSS e JS) estão sendo carregados e onde.
Mas aprender como desabilitar os plugins do WordPress é apenas uma entre muitas outras técnicas destinadas a aumentar a velocidade do site. Aqui está uma lista de alguns outros guias e tutoriais úteis relacionados ao desempenho do site:
- Como Acelerar o seu Site WordPress (O Melhor Guia para 2019)
- Um Guia Para Iniciantes Sobre Otimização de Velocidade do Website
- Como Reduzir o TTFB para Melhorar os Tempos de Carregamento das Páginas WordPress
- Como Diagnosticar Alta Utilização de Admin-Ajax no seu Site WordPress
- Como Limpar Sua Tabela wp_options e Dados Autocarregados
- Como Desabilitar Plugins WordPress (Sem acesso a WP-Admin)
Deixe um comentário