A Automattic lançou um plugin para WordPress que realiza otimizações importantes nos scripts chamado Page Optimize.

Este plugin gratuito realiza otimizações importantes nos scripts do seu site e pode melhorar e muito o desempenho de carregamento e a experiência do usuário.

Como funciona o Page Optimize

Este plugin oferece alguns recursos que podem melhorar o desempenho do carregamento e renderização da página no navegador:

  • Concatenar CSS
  • Concatenar JavaScript
  • Tempo de execução de scripts não críticos

Desse modo fica simples a otimizacão desses itens tão importantes para o desempenho do seu site, já que concatenando JavaScript e CSS para carregamento mais rápido do site fazendo a menor número de solicitações ao servidor.

Dica: Este plugin desativa o Jetpack “Acelere os tempos de carregamento de arquivos estáticos”, caso você use este recurso.

Instalando o Page Optimize

O plugin Page Optimize está disponível gratuitamente no diretório padrão do WordPress

Para que seja realizada com sucesso a busca pelo plugin no Diretório do WordPress, recomendo o a pesquisa por “page optimize automattic”:

Instalando o Page Optimize

A instalação do Page Optimize é feita como qualquer outro plugin do WordPress.

Configurando o Page Optimize

Após a instalação você pode acessar as configurações do plugin em Configurações / Performance.

Configurações do plugin em Configurações / Performance

Existe algumas poucas opções, já que o plugin faz toda a otimização automaticamente.

Configurando o Page Optimize

Você pode basicamente ajustar 3 opções:

  • Javascript: Nesta opção você pode habilitar / desabilitar a concatenaçã0 do javascript.
  • Non Critical Script: Você pode escolher o modo de execução do JavaScript concatenado. Essa opção pode trazer instabilidade ao seu site dependendo de como os scripts funcionam, portanto, use com cuidado.
  • Stylesheets: Nesta opção você pode habilitar / desabilitar a concatenaçã0 do CSS.

Testando os Recursos do Page Optimize

Para testar os recursos sem ativá-los para todo o site, você pode anexar parâmetros de consulta a um URL da página ou postagem do WordPress.

Por exemplo, para testar a ativação da concatenação de JavaScript para https://example.com/blog/, você pode usar o URL https://example.com/blog/?concat-js=1.

Parâmetros de consulta suportados:

  • A variável concat-css controla a concatenação de CSS. Valores: 1 para ON e 0 para OFF.
  • A variável concat-js controla a concatenação de JavaScript. Valores: 1 para ON e 0 para OFF.
  • A variável load-mode-js controla como o JavaScript não crítico é carregado. Valores: defer para adiado, async para carregamento assíncrono, qualquer outro valor indica que o recurso deve ser desativado.