Neste artigo, vamos utilizar a ferramenta nativa do navegador que realiza uma análise mais precisa, íntegra e independente de variáveis criadas por softwares de terceiros, que utilizam de robôs para criar as métricas de análise de carregamento com base em elementos estáticos e não dinâmicos.
Com a análise nativa você garante resultados reais sobre o desempenho do seu site.
É importante verificar a qualidade da internet, checando principalmente o tipo de conexão utilizada, que pode ser via Wi-fi ou Cabo Lan.
A conexão Wi-Fi é mais instável e pode sofrer com interferência que prejudicam a conexão. O tipo de conexão mais indicado para esse teste é a cabeada, que promove eficiência, segurança e estabilidade.
Como serão realizados os testes de velocidade?
Neste caso, o navegador escolhido para realização dos testes é o Google Chrome, mas o processo pode ser repetido em outros navegadores de maneira semelhante.
Preparando o ambiente
A melhor maneira de garantir um resultado mais preciso é utilizando uma guia anônima do Chrome.
No computador, abra o Chrome;
Na parte superior direita no menu, clique em Nova janela anônima;
Também é possível utilizar um atalho de teclado para abrir uma janela de navegação anônima:
Windows, Linux ou SO Chrome:
Aperte CTRL + Shift + N
Mac
Aperte ⌘ + Shift + N
Quando terminar, terá algo parecido com isso:
Caso a opção esteja desmarcada, clique em “Bloquear cookies de terceiros”.
Entre no seu site
Digite a URL do seu site:
Exemplo: www.seusite.com.br
Iniciando a análise
Clique com o botão direito do mouse sobre qualquer campo da tela e desça no menu aberto até a opção “inspecionar” como segue a imagem:
Mac: aperte ⌘ + Shift + i.
Windows, Linux ou SO Chrome: CTRL + Shift + i.
Após clicar, você terá algo parecido com isso:
Vá até a aba “Network”, quarto item da direita para a esquerda no menu do modo desenvolvedor.
Logo abaixo você encontrará a opção
“Disable Cache”, é muito importante que essa opção esteja habilitada.
Com esta opção habilitada, você fará o recarregamento da página clicando no botão ao lado da URL do site, ou aperte F5.
Logo em seguida, terá a seguinte tela:
Na barra inferior, algumas informações apresentadas se referem ao carregamento site, como segue a imagem:
Velocidades a serem analisadas
Finish:
Representa o tempo de carregamento do site, desde o primeiro arquivo até a última integração do site.
(tempo de 7.46 segundos)
DOM:
Representa o tempo de carregamento dos elementos não web da página.
(Tempo de 2.96 segundos)
Load:
Representa o tempo de carregamento dos arquivos do site, sem integração de terceiros.
(Tempo de 4.54 segundos)
Realizando testes mobile
Na barra superior do modo desenvolvedor, clicarmos no segundo botão “toggle device toolbar”.
Ao carregar teremos a versão Mobile do site na tela, como segue a imagem:
Para realizar o diagnóstico, basta fazer o recarregamento da página novamente, através do mesmo botão de reload ou F5.
Com o resultado em vista, podemos observar que o carregamento realizado no site mobile obtém uma melhora de alguns poucos segundos pela sua forma de organização do layout na tela, contendo menos elementos a serem carregados, segue o resultado:
Como melhorar a velocidade de carregamento do seu site?
O tamanho dos arquivos importa!
Com arquivos maiores, o carregamento do site fica mais custoso e demorado. O tamanho ideal de imagens para colocar no seu site são as que contém no máximo 300kb, que são carregadas muito rapidamente.
A plataforma da Rocket Imob as converte para um arquivo WEBp, que tem o carregamento muito mais eficaz pela diminuição da imagem até 10 vezes menor que a original sem grande perda de qualidade.