Este documento apresenta um estudo de caso sobre monitoramento de performance no WordPress utilizando um plugin e a API do GTmetrix. O documento explica como o autor criou uma conta no GTmetrix, conectou um plugin WordPress à API para realizar testes de performance, e analisou os resultados e histórico de desempenho para identificar áreas que precisam de otimização.
4. Performance?
"Ato ou processo de realizar algo; atuação,
desempenho: O menino teve uma performance
excelente na prova de natação."
http://michaelis.uol.com.br/busca?r=0&f=0&t=0&palavra=performance
Poderia ser substituído por: Meu site teve uma performance
excelente quando meu cliente acessou.
WordCamp Floripa - 2019
5. Em resumo!
Performance é termo utilizado para verificar
como o seu site pode lidar com o tráfego.
WordCamp Floripa - 2019
6. Meu site pode lidar com tráfego?
Calma jovem não se assuste, não é nada ilegal..
Lembre-se estamos em um dia de estudo :)
WordCamp Floripa - 2019
8. Legal, entendemos o que é, agora vamos
descobrir:
Qual importância da performance em
nossos projetos?
WordCamp Floripa - 2019
9. Antes faça as seguintes perguntas...
● Quanto tempo meu site demorar para carregar (mostrar alguma informação
para usuário) ?
● Quanto tempo meu site demora para responder às interações do usuário ?
● Meu site se mantém estável e acessível (24 horas por dia, 7 dias por semana
365 dias por ano) ?
WordCamp Floripa - 2019
10. Velocidade...
A velocidade do site influência nos resultados?
- Sim, em 2010 o Google anunciou que o tempo de
carregamento passou a ser incorporado em seus fatores de
rankeamento.
Lista dos 200 fatores de rankeamentos do Google.
https://backlinko.com/google-ranking-factors
WordCamp Floripa - 2019
11. Tempo...
Qual o tempo de carregamento ideal para o meu
site?
- Um estudo realizado por Geoff Kenyon, em 2011, apontou que se um site
abrir em 2,9 segundos, ele é considerado mais rápido do que 50% dos sites
na web. Se ele abrir em 1,7 segundos, ele é 75% mais rápido que os demais e
se ele carregar em 0,8 segundos, é considerado mais rápido do que 94% dos
sites presentes na internet.
Para cada 1 segundo de atraso, as taxas de conversão
caem em torno de 7%
WordCamp Floripa - 2019
12. Ainda sobre o tempo...
Segundo o Google, o ideal é que o seu site carregue entre 0,5
e 2 segundos.
Segue abaixo o link do vídeo feito pelo Google onde Maile
Ohye explica a importância do carregamento rápido na web.
https://www.youtube.com/watch?v=OpMfx_Zie2g
WordCamp Floripa - 2019
13. Fica esperto...
Existem uma pesquisa feita pela Akamai, juntamente com a
Forrester Consulting, concluiu que 40% dos consumidores
não esperam mais do que 3 segundos pelo carregamento de
uma página. Depois disso, eles abandonam o site.
WordCamp Floripa - 2019
14. Testar...
Como testar a velocidade do meu site?
Existem várias ferramentas gratuitas para testar seus projetos, seguem
algumas:
1. Google PageSpeed Insights
(https://developers.google.com/speed/pagespeed/insights/?hl=pt-br)
2. GTmetrix (https://gtmetrix.com/)
3. Pingdom (https://tools.pingdom.com/)
4. Webpagetest (https://www.webpagetest.org/)
5. E mais inúmeras delas.
WordCamp Floripa - 2019
15.
16. Sobre o resultado obtido:
1. PageSpeed: Nesta guia você encontra um relatório completo com todos os pontos avaliados
pela ferramenta, ordenados por prioridade. E a nota que foi dada em cada critérios avaliado.
2. Yslow: Guia semelhante ao relatório anterior organizado por prioridade, porém é baseado nos
critérios definidos pela Yslow.
3. Waterfall: Nesta guia o relatório é em cascata que apresenta visualmente toda a sequência de
requisições efetuadas para o carregamento da página.
4. Timings: Nesta guia é a apresentação de uma linha do tempo do carregamento da página, com o
tempo que cada uma das etapas levou para finalizar seu carregamento.
5. Video: Nesta guia é necessário ativar o video e realizar o teste novamente pra ver em video o
carregamento da página.
6. History: Nesta guia temos os gráficos que acompanham o histórico de desempenho da página
em relação aos dados apresentados anteriormente
WordCamp Floripa - 2019
17. Dicas para otimizar seu projeto
1. Otimizar imagens (https://tinypng.com/ ou Plugin ewww)
2. Reduzir o número de plug-ins no site: P3 - Plugin Performance Profiler (
https://br.wordpress.org/plugins/p3-profiler/)
3. Minifique CSS, Javascript e HTML (alguns plugin de cache já fazem isso)
4. Instale algum plugin de cache (W3 Total Cache, WP Fastest Cache ...)
5. Reduza o número de redirecionamento
6. Ative a compactação gzip
7. Use uma CDN's
8. Em caso de dúvida consulte um profissional.
WordCamp Floripa - 2019
19. Estudo de caso
Por que desenvolver algo do zero?
Já não existe um plugin que faça isso?
Tem certeza que é o melhor caminho?
Vai ficar disponível para a comunidade?
WordCamp Floripa - 2019
25. Dados obtidos no teste:
As setas indicam seu desempenho em relação aos outros sites analisados pelo GTmetrix nos últimos
30 dias.
● A seta verde apontando para cima indica que seu resultado é melhor que a média.
● A seta vermelha apontando para baixo indica que seu resultado é pior que a média.
● O ícone do diamante laranja indica que o resultado está dentro de +/- 5% da média.
Isso é útil porque você pode ver quais atributos do seu site podem exigir mais atenção do que outros.
Em particular, você pode determinar quais recomendações de PageSpeed / YSlow fazem sentido para
você resolver. Por exemplo, se você marcou um F (0) para a regra "Usar uma rede de entrega de
conteúdo (CDN)" do YSlow, fique tranquilo sabendo que milhares de outros sites têm a mesma
pontuação; Não se preocupe se estiver executando um site menor e não quiser pagar / não puder pagar
por um CDN.
WordCamp Floripa - 2019
31. Link do projeto - GTmetrix
Os link's serão disponíveis no dia do Wordcamp.
Link do Github.
Link do plugin no diretório do wordpress.
WordCamp Floripa - 2019