Limpe a seção HEAD do tema WordPress e arquivos JS e CSS desnecessários

Publicados: 2018-09-04

O núcleo do WordPress anuncia bastante código na seção de head HTML do site, quer você queira ou não. Esse código está longe de ser inútil e serve a um propósito na maioria dos sites. No entanto, se você é um maníaco por código limpo ou usa o WordPress para alimentar um SaaS, você deve limpar o HTML. Como acontece com a maioria das coisas no WP, é apenas uma questão de remover algumas ações e filtros.

O #WordPress é uma ótima plataforma para construir sites #SaaS. Mas antes de fazer isso requer um pouco de limpeza.

CLIQUE PARA TWEET

Por que eu removeria essas tags em arquivos HEAD, CSS ou JS?

Existem algumas razões. Algumas pessoas gostam de manter seus códigos e sites o mais organizados possível. Por que ter uma linha de código em HTML se você sabe que não precisa dela e sabe como removê-la. Nenhuma razão que assim nunca. O mesmo vale para arquivos CSS e JS extras. Se você não estiver usando emojis em seu site, por que incluiria esse JS em todas as páginas?

Então há segurança. Existem alguns pedaços de HTML que o WordPress adiciona automaticamente para mostrar URLs que foram explorados no passado. Devo salientar que essas URLs (ponto de extremidade XML RPC em particular) não são um segredo. Devem ser públicos. Mas, alterá-los para algo personalizado e escondê-los é uma prática conhecida. Nesse caso, é óbvio que você não quer esses URLs em seu HTML.

A velocidade também é uma razão válida para limpar o HTML. Embora eu deva dizer que não tenho certeza de quanto você ganhará removendo algumas centenas de caracteres do HTML, é um passo na direção certa. A eliminação de arquivos JS e CSS desnecessários economizará algumas solicitações HTTP, e isso é algo em que você deve focar sua otimização. O Tidy Repo testou recentemente mais de 100 temas WordPress para velocidade, e o número de solicitações tem um impacto significativo na velocidade geral do site.

Ter um código HTML limpo garante que você saiba o que está acontecendo em seu site e é um ótimo começo para otimizar a velocidade do site.

Por último, mas não menos importante, o motivo e o motivo pelo qual temos esse código à mão são os SaaS com WordPress. Quando você está construindo um SaaS, você quer controle completo do que está em seu HTML, e a maioria das coisas que o WP adiciona ao HTML por si só não é algo que você usará. Então, por causa de todos os motivos mencionados acima – limpamos as coisas o máximo possível. Isso nos dá uma plataforma excelente e enxuta para criar soluções personalizadas, mantendo 99% da funcionalidade principal do WP que é usada para alimentar o SaaS.

Posso remover essas coisas com segurança? Eles não servem a um propósito?

Sim, eles servem a um propósito, mas apenas em determinadas situações. Em um site “médio”, algumas tags de link extras no cabeçalho não são um problema, e todas elas facilitam certas operações e integrações. Mas eles não são cruciais para o funcionamento de qualquer site e certamente não para um SaaS.

Vamos limpar algum código

Você pode testar o código abaixo com qualquer tema. O padrão 2017 funcionará bem. No entanto, se você estiver usando temas WordPress “normais” (e alguns plugins em cima disso), você nunca saberá quem adicionou o código – WP core, tema ou um plugin. Eu sugiro que você redefina seu site para remover todos os plugins e então use um tema que tenha apenas wp_head() e wp_footer() nele. Veja como esse index.php se parece e aqui está todo o tema de teste que você pode usar para testar.

<!DOCTYPE html>
<html>
<head>
  <?php
    wp_head();
  ?>
</head>
<body>
  <h1>The Most Basic WP Theme</h1>
  <?php
    wp_footer();
  ?>
</body>
</html>

Se você ativar nosso tema de teste e abrir a fonte da primeira página, você notará muito mais código do que é visível no index.php acima. É isso que vamos limpar. Coloque o código abaixo no arquivo functions.php do tema. Se você não deseja remover/desativar um recurso, comente a linha que o menciona.

add_action('after_setup_theme', 'cleanup');

function cleanup() {
  remove_action('wp_head', 'rsd_link');
  remove_action('wp_head', 'wp_generator');
  remove_action('wp_head', 'feed_links', 2); 
  remove_action('wp_head', 'feed_links_extra', 3);
  remove_action('wp_head', 'index_rel_link');
  remove_action('wp_head', 'wlwmanifest_link');
  remove_action('wp_head', 'start_post_rel_link', 10, 0);
  remove_action('wp_head', 'parent_post_rel_link', 10, 0);
  remove_action('wp_head', 'adjacent_posts_rel_link', 10, 0);
  remove_action('wp_head', 'adjacent_posts_rel_link_wp_head', 10, 0);
  remove_action('wp_head', 'wp_shortlink_wp_head', 10, 0);
  remove_action('wp_head', 'print_emoji_detection_script', 7);
  remove_action('wp_head', 'rel_canonical');
  remove_action('wp_head', 'rel_alternate');
  remove_action('wp_head', 'wp_oembed_add_discovery_links');
  remove_action('wp_head', 'wp_oembed_add_host_js');
  remove_action('wp_head', 'rest_output_link_wp_head');
  
  remove_action('rest_api_init', 'wp_oembed_register_route');
  remove_action('wp_print_styles', 'print_emoji_styles');
  
  remove_filter('oembed_dataparse', 'wp_filter_oembed_result', 10);
  remove_filter('pre_oembed_result', 'wp_filter_pre_oembed_result', 10);
  
  add_filter('embed_oembed_discover', '__return_false');
  add_filter('show_admin_bar', '__return_false');
}

O que faz o que

A ação rsd_link é responsável por exibir o link de descoberta realmente simples, enquanto o wp_generator mostra a versão do WP e é removido por praticamente todos os plugins de segurança já escritos para o WP. As duas ações feed_links adicionam vários links a vários feeds RSS. Várias ações _rel_link adicionam links às postagens para que possam ser mais acessíveis e mais facilmente encontradas por vários serviços. A menos que você esteja usando o Windows Live Writer, você realmente não precisa da ação wlwmanifest_link . Não precisamos de amojis para que print_emoji_detection_script possa ir, e o mesmo vale para vários links oembed , incluindo suporte para oembed na API REST. A remoção da ação oembed_dataparse garantirá que o WP não mexa com nenhum link em suas postagens e não os transforme em nenhuma mídia avançada via oembed. O último filtro show_admin_bar impedirá que a barra de administração do WP seja exibida em seu front-end, independentemente das configurações por conta.

Existem apenas algumas coisas no #WordPress que não podem ser modificadas com ações e filtros. Felizmente, controlar o conteúdo HEAD não é um deles.

CLIQUE PARA TWEET

A flexibilidade do WordPress é ótima

Muitos artigos estão circulando com títulos como “Como remover lixo do cabeçalho WP”. Não é lixo. São coisas que dão grande poder ao WordPress imediatamente. Muitas pessoas valorizam isso e não precisam passar horas configurando as coisas. Por outro lado, a limpeza é apenas uma questão de remover algumas ações. Você tem controle total sobre o que é colocado em seu HTML e pode usar facilmente o WordPress para alimentar sites sem conteúdo, como SaaSes.