Autor Tópico: Google Page Insights para otimizar o carregamento do Joomla  (Lida 262 vezes)

0 Membros e 1 Visitante estão a ver este tópico.

Offline candidosa2

  • Suporte Tecnico
  • Fundador
  • *
  • Mensagens: 4798
  • Sexo: Masculino
  • Suporte
    • Hosting Moçambique
Google Page Insights para otimizar o carregamento do Joomla
« em: 26 de Outubro de 2016, 22:08 »

Todo o site deveria ser feita essa otimização, tanto para poupar recursos do servidor, quanto para deixar o carregamento do site mais rápido. Vamos ver como fazer essa otimização do Joomla com base no Google Page Insights.
O Joomla é uma ferramenta muito poderosa e completa para a construção dos mais diversos sites e e-commerces. Porém otimizações finas como a definição do carregamento de javascript e css não são feitos nativamente, mas necessários para garantir que o usuário não saia da página por demora no carregamento.


Portanto por meio de plugins e algumas configurações no site, é possível fazer esta otimização, para que o carregamento do site seja feito mais rapidamente, poupando também recursos de banda e processamento do servidor.





Algumas produtoras de templates já possuem configurações de otimização diretamente no template, neste caso até substituindo o uso destes plugins de melhoramento do descritos abaixo.


O Google oferece um score que define o ranking de otimização do site, chamado Google PageSpeed Insights, disponível aqui: http://developers.google.com/speed/pagespeed/insights/


Com este ranking é possível ter como métricas itens como cache e compactação de html, javascript, css, tempo de resposta do servidor, redirecionamentos desnecessários, para otimizar seu site Joomla.


E é por meio desta ferramenta que é possível medir o quanto um site está mais rápido ou mais lento.


Como teste, vamos pegar o site do VirtueMart PRO (virtuemartpro.com.br), com o score de 46/100 (mobile) e 59/100 (desktop).


Configuração
#1 - Gzip
A primeira configuração que é possível fazer, é ativação do gzip ( nativo do Joomla ) na configuração do sistema, na aba Servidor, Compressão do Gzip > Sim.


#2 - Cache
Configure o Joomla para ativar utilizar cache, em Configuração Global, aba Sistema:


**  Ligado - Conservador


Também há um plugin chamado "cache" desativado ( em gerenciador de extensões ). Ative-o somente se não for um e-commerce para não interferir em dados sensíveis da loja.


#3 - Htaccess
Outra configuração que pode ser feita é modificar o .htaccess do Joomla, acrescentando as linhas para ativação de cache do navegador, de imagens, css, javascript, xml, texto. Para fazer isso, acrescente no final de tudo ( é necessário ativar a utilização do mod_rewrite do Apache na aba Site ):


# compress text, html, javascript, css, xml:


AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE application/x-javascript


Header unset Pragma
FileETag None
Header unset ETag


Header set Cache-Control "max-age=1209600, public, must-revalidate"


ExpiresActive On
ExpiresDefault A300
ExpiresByType image/x-icon A2592000
ExpiresByType image/ico A2592000
ExpiresByType image/icon A2592000
ExpiresByType application/x-javascript A3600
ExpiresByType text/javascript A3600
ExpiresByType text/css A3600
ExpiresByType image/gif A604800
ExpiresByType image/png A604800
ExpiresByType image/jpeg A604800
ExpiresByType image/gif A604800
ExpiresByType application/x-shockwave-flash A604800
ExpiresByType video/x-flv A604800
ExpiresByType application/pdf A604800


#4 - Plugins ( JCH Optimize Pro )
Há uma categoria específica na JED ( Joomla Extensions Directory ) para tratar deste tema de otimização, a Site Performance: http://extensions.joomla.org/extensions/core-enhancements/performance/site-performance





Nela há vários plugins muito bons para a otimização, como o ScriptMerge, JCH Optimize, o Jbetolo, todos open source e liberados para download.


Para fins de teste, vamos usar o ScriptMerge (http://extensions.joomla.org/extensions/core-enhancements/performance/site-performance/12108).


Após feito download e a instalação, entre na configuração do plugin e modifique os parâmetros:


** Basic Options


Merge Type: Filelist
Merge Css: Sim
Merge Js: Sim


** Merge Options


Compress CSS: Yes, using simple rules
Compress JS: Não ( pode ser ativado, mas em e-commerces não é preciso )
Skip compressed: Sim


** Exclude Options


Exclude Menu-items: selecione os items de menu que não deverão ter a compressão de arquivos e cache ativado


** Advanced Options


Force G-zip: Sim


#5 - Imagens
Utilize uma ferramenta para comprimir as imagens e reduzir o tamanho telas sem perder a qualidade, como o http://compressor.io. Na página do Google Page Insights mostra quais imagens precisam de redução.


Resultado
No final, o score do site mudou para 84/100.