Escrevemos em um artigo que mostra alguns motivos para você ter um site rápido. Agora percebemos a importância do nosso público conhecer alguns motivos para seu site estar lento.
Uma coisa é certa: ninguém merece ficar a espera do carregamento de um site. Hoje estamos a falar de 5G, Inteligência Artificial e tantas outras tecnologias e ter um site lento neste tempo é sinal de um mau negócio. Mas afinal de contas: o que leva um site a ser carregado tão devagar? É isto que veremos ao longo deste artigo.
1. ALOJAMENTO
Não quero com esta ordem elencar as prioridades, ok. A relação dos motivos que apresentaremos são importantes para serem analisados para tornar o seu site carregar mais rápido. E por que comecei com o serviço de alojamento? Simples! É aqui que o seu site estará disponível 24h por dia? Com recursos que garantem a máxima eficiência na entrega do site para o navegador de seu cliente? Tudo depende do que está a ser contratado.
Hoje em dia encontramos os Hosts, os serviços de alojamento, que, para ter um range de preços mais atrativos, customizam o espaço disponível e os recursos do servidor como os cores para processamento, memória, I/O, entre outros recursos, como por exemplo a localidade do datacenter. Neste caso, qual o sentido de contratar um serviço de alojamento cujo datacenter fica na América sendo que meus potenciais clientes estão na Europa. Antes mesmo de contratar um serviço de alojamento é necessário reconhecer os recursos que são oferecidos nos planos e identificar o que melhor se ajusta às necessidades e não escolher apenas pelo melhor preço.
2. CORE
A seguir o mesmo raciocínio do item acima, não faz sentido eu ter um super serviço de alojamento, com 16 cores de processador, 64gb de memória, I/O de 8mb/s se o código do meu site estiver cheio de bugs. Percebo alguns clientes preocupados com a linguagem, porque alguém disse que leu num artigo que a linguagem A é melhor que a linguagem B porque os recursos de memória ficam armazenados e … Nada disso! A linguagem usada no desenvolvimento de um site ou sistema web não tem muita relevância da sua performance. O que realmente deve ser considerado é a forma que os códigos são escritos. Um código limpo, objetivo, com as querys bem escritas e com um banco de dados bem montado garanto que o site funcionará muito bem. Mas como avaliar isto? Não sei nada de programação? Hoje em dia tudo é no “clique e arraste”! É mesmo! Mas um bom programador sabe diferenciar um código limpo e sabe considerar quais destas ferramentas de “clique e arraste” que pode prejudicar o desempenho do seu site e, por certo, usará no seu projeto o que for mais eficiente.
Outro ponto sobre os códigos do seu site que devem ser levados em consideração são os CSS e Javascript. Se o seu site for construído da maneira correta você não terá problemas com número de requisições feitas para ficheiros externos como bibliotecas de jQuery, Javascript e CSS. Agora, caso use um CMS como Joomla ou WordPress é necessário muito cuidado na escolha dos plugins de maneira geral. Cada um destes plugins agregam seus respectivos códigos e bibliotecas para que este funcione adequadamente. Estes devem ser escolhidos à dedo para que o seu site tenha a máxima eficiência. Um bom programador sabe analisar e reconhecer um bom plugin, inclusive pode até mesmo otimizá-lo para torná-lo mais performático.
3. ATUALIZAÇÕES
Um ponto que muitas pessoas não se preocupam quando vão contratar um serviço de alojamento são os softwares que estes disponibilizam, principalmente a versão do SO, webserver e banco de dados. Como qualquer software, estes também precisam de atualizações, sejam por melhorias ou por correção de falhas.
Estas atualizações não são diferentes para os plugins usamos no seu site, como também nas bibliotecas de terceiros. Além de otimizar a performance do seu site mantendo-o sempre atualizado, você diminui drasticamente os riscos de ter algum tipo de vulnerabilidade no seu site. Um bom programador sabe como analisar cada uma destas atualizações, além de recomentar a realização de um backup sempre antes de qualquer atualização seja de software, plugins, cores ou bibliotecas de terceiros.
4. IMAGENS
Muita gente pensa que a qualidade das imagens que ficam disponíveis no site precisam ter uma resolução excelente. E estas pessoas não estão erradas! A qualidade das imagens traz ao site uma beleza encantadora e a percepção do cliente está relacionada ao que ele vê só depois ao que ele lê. Imagina uma loja física de qualquer segmento preparar a vitrine de qualquer jeito. Não dá para imaginar, não é mesmo! Tudo é muito bem pensado, organizado e montado justamente para encantar o cliente. Só depois que ele vai querer saber do preço e outros detalhes. No site é a mesmíssima coisa. Imagens bem montadas, com espaçamento entre o texto bem organizados e um bom alinhamento entre os demais elementos faz toda diferença. Mas uma coisa deixa muitos programadores e webdesign a desejar: o peso das imagens. As imagem para a web não precisam da mesma qualidade que uma imagem que será impressa. Já vi sites com imagens com incríveis 28mb (não imagens totais, mas apenas uma única imagem). Quem administra o conteúdo de um site precisa atentar para isto. E o programador pode orientar e explicar estas diferenças para que seu projeto tenha sucesso e certa relevância não apenas em relação ao site, mas também pela manutenção dos indicadores de performance.
Por mais que existam softwares e scripts para compressão de imagens para web não existe nada melhor que a percepção humana para determinar a qualidade de uma imagem para a web. Softwares como GIMP e PhotoShop são excelentes para estas compressões. Um bom programador e um bom design sabem bem como usá-las eficazmente para tornar suas imagens mais dinâmicas para o seu site.
5. CÓDIGO DE TERCEIROS
Gerenciar um site não é uma tarefa fácil. Desenvolvê-lo de forma eficaz muito menos. O tempo que se leva para escrever um bom código pode se tornar um grande problema quando for mensurar as horas necessárias para o desenvolvimento de um projeto web. Imagine criar uma biblioteca customizada para seu CSS e Javascript para tornar seu site responsivo, lazyloader de imagens, banners rotativos, slideshow de testemunhos e imagens dos logotipos dos seus clientes. Existem códigos pré-formatados para algumas funcionalidades que já se tornaram do dia-dia do programador e que já são considerados no desenvolvimento dos projetos. Além destes existem outros tipos de códigos de terceiros que são
Trazer estes códigos de terceiros pode ser um passo empolgante para sua carga de trabalho e projetos, permitindo que você adicione novos recursos e em muitas situações até alimente iniciativas de comunidades de código aberto e aproveite alguns dos melhores códigos que existem. No entanto, isto pode ser uma oportunidade para os hackers acessarem seus sistemas e dados. Mesmo que seus fornecedores afirmem ser seguros, o código deles pode não estar necessariamente de acordo com os padrões de segurança e requisitos de conformidade de sua empresa. Os programadores não podem deixar todo o gerenciamento de riscos para suas contrapartes de segurança; os desenvolvedores precisam compartilhar essa responsabilidade da mesma forma que compartilham a responsabilidade de escrever seu próprio código seguro.
Os códigos de terceiros não são apenas estes para otimizar o tempo do desenvolvimento de um projeto, mas também aqueles que permitirão uma análise do comportamento do cliente enquanto ele estiver no seu site. Google Analytics, Google Tag Manager, Facebook Pixel , ReCaptcha são alguns exemplos de códigos de terceiros que em quase todos os sites existentes são implementados e que em algumas situações causam certa lentidão no site carregamento.
Existem algumas formas para você otimizar estes carregamentos ao ponto de não prejudicar seu real objetivo como também a performance do seu site. Um bom programador sabe como realizar esta implantação.
6. BÔNUS
Algumas ferramentas que te ajudarão a verificar se o seu site possui algumas oportunidades de melhoria.
- Pingdow Tools – Traz algumas estatísticas como tempo de carregamento e peso do site;
- WPSec – Informa se seu site criado em WordPress possui alguma vulnerabilidade conhecida;
- PageSpeed – Insights – O Google reformulou o PageSpeed – Insights, que é a principal ferramenta que você deve usar para passar os vitais essenciais da web. Algumas coisas ainda são testadas em uma rede 3G, caso contrário, os resultados são semelhantes ao Lighthouse e ao principal relatório de sinais vitais da web no Google Search Console. Obrigado Google por finalmente atualizar isso;
- Chrome Dev Tools – encontre seus maiores arquivos CSS / JS em Fontes → Cobertura, domínios de terceiros (Fontes → Página) e outros problemas de desempenho, como quando as fontes são pré-carregadas, mas não estão sendo usadas (saiba como abrir as ferramentas de desenvolvimento do Chrome);
- CLS Debugger – visualize um GIF das mudanças de layout do seu site (CLS) no celular / desktop;
- Desempenho do KeyCDN – teste os tempos de pesquisa TTFB / DNS em 10 locais globais.
- Relatório de tráfego ao vivo do Wordfence – veja os bots que acessam o seu site em tempo real (ótimo para verificar se os bots ruins estão acessando o seu site e consumindo CPU). Desinstale o Wordfence quando terminar, pois o plug-in aumenta a CPU;
- WP Hive – extensão do Chrome que permite pesquisar o repositório de plug-ins do WordPress e ver se um plug-in afeta o uso de memória e as pontuações do PageSpeed;
- WP Query Monitor – encontre seus plugins mais lentos. Instale-o, visualize qualquer página do seu site e vá para Consultas (mostrado na barra de administração) → Consultas por componente;
- WP Optimize – limpe seu banco de dados de tabelas não utilizadas deixadas por plug-ins antigos que você desinstalou. Alguns plug-ins / módulos aumentam especialmente quando precisam processar dados (módulo de análise do Rank Math), que você verá no WP-Optimize.
