Performan em sites Joomla
Por
Nicholas K. Dionysopoulos - https://gravatar.com/sledge81
Em 5 partes:
Origiais em inglês
https://www.dionysopoulos.me/joomla-performance-tuning-i-start-at-the-beginning.html
https://www.dionysopoulos.me/joomla-performance-tuning-ii-basic-settings.html
https://www.dionysopoulos.me/joomla-performance-tuning-iii-static-media-optimization.html
https://www.dionysopoulos.me/joomla-performance-tuning-iv-site-building-calisthenics.html
https://www.dionysopoulos.me/joomla-performance-tuning-v-content-quality.html
Primeira parte
Joomla 4 é uma grande melhoria em relação ao Joomla 3. Imediatamente você obtém um CMS com suporte integrado para dados estruturados (o que anteriormente era chamado de “microdados”), até mesmo diversas opções de cache para atender a qualquer uso, desde sites pessoais leves até portais enormes e movimentados.
Por razões que têm a ver com suas iterações muito antigas e passadas, ele ainda tem a má reputação injustificada de um CMS lento e ruim para SEO. Isto não poderia estar mais longe da verdade. Na verdade, o Joomla 4, sem qualquer software de terceiros, supera seus concorrentes, mesmo quando auxiliados por software de terceiros desenvolvido especificamente.
Melhorar ainda mais seu desempenho e como evitar todas as armadilhas na hora de construir o seu site ou o do seu cliente.
Nesta primeira parte da série falaremos sobre por que isso é importante, em geral, e quais são os primeiros passos óbvios que você pode dar para atingir esse objetivo.
Por que você precisa de um site rápido?
Antes de embarcarmos em nossa aventura para otimizar o desempenho do seu site Joomla, precisamos abordar a questão mais básica: por que isso é importante? Afinal, estamos falando de você ter que trabalhar mais antes de ter seu site pronto para publicação. Vale realmente a pena o esforço, mesmo que já atraia uma quantidade razoável de tráfego orgânico e pareça rápido para você?
Acredito firmemente que vale a pena investir tempo, tanto por razões filosóficas como práticas.
A primeira razão filosófica é que um site lento é um desperdício em muitos níveis. Isso desperdiça o tempo de todos. Esperar de 4 a 5 segundos para uma página carregar pode não parecer um grande desperdício, mas ao longo de um ano e centenas de milhares de páginas que cada um de nós está esperando para carregar, estamos coletivamente desperdiçando pessoas-anos inteiras do nosso tempo. Ao mesmo tempo, desperdiçamos eletricidade para gerar o conteúdo mais lentamente do que o necessário, entregar mais dados do que deveríamos e processá-los mais lentamente do que o necessário para exibição com tudo o que implica sobre a pegada ambiental do seu site.
A segunda razão filosófica é que sites lentos são excludentes. Eles são mais difíceis de alcançar por comunidades carentes que dependem de conexões de Internet lentas ou de alta latência. Seja a Internet via satélite, que é a única ligação viável com o mundo exterior numa aldeia africana, ou o WiFi fraco num parque de estacionamento do McDonald's num distrito escolar pobre nos EUA, o site lento pode estar a criar uma barreira intangível, mas muito real, entre o seu conteúdo e as pessoas que poderiam consumi-lo e se beneficiar dele. Só porque a maioria de nós tem o privilégio de viver em centros urbanos de países desenvolvidos com conexões de Internet rápidas e de baixa latência, não significa que devamos agir como guardiões da informação, omitindo-nos de fazer algo relativamente fácil para aumentar o alcance dessa informação. Isto é especialmente importante se você estiver desenvolvendo sites sem fins lucrativos, educacionais, governamentais ou de outros recursos.
Quanto a razões práticas, comecemos com o problema óbvio de que um site lento cria uma experiência frustrante para o visitante. É provável que eles desistam do seu site e visitem o de outra pessoa. Se permanecerem, é provável que fiquem com um estado de espírito negativo depois de terem sido submetidos a uma série de atrasos longos e desnecessários. Isso enfraquece e prejudica o conteúdo do seu site, desencoraja visitas repetidas e reduz sua taxa de conversão.
A segunda e mais importante razão prática é que os motores de busca não classificam mais o seu site apenas com base no conteúdo e na conexão com outros sites. Eles levam em consideração os Core Web Vitals. Essencialmente, um site que está inchado ou lento para carregar será penalizado nas classificações dos mecanismos de pesquisa. É do seu interesse ter um site rápido, mesmo que você não se importe com o impacto social e ambiental do seu site.
Premissas operacionais
A maioria dos artigos que você deve ter lido sobre otimização de sites tende a ser axiomático. Eles afirmam que existe o Único Caminho Verdadeiro e que você será lançado na condenação eterna se não segui-lo. A ironia do fato de existirem tantas visões axiomáticas mutuamente exclusivas quanto o número de pessoas que escrevem artigos aparentemente escapou a estes autores.
Não existe um Único Caminho Verdadeiro. Mesmo implicando que um site pequeno construído por uma única pessoa em seu tempo livre pode ou, pior, deve seguir a mesma metodologia que um site de médio a grande porte sendo construído e mantido por uma equipe dedicada de pelo menos algumas dezenas de pessoas está fora de questão. de contato com a realidade.
Estou escrevendo esta série de artigos com a maioria dos integradores de sites que usam Joomla, construindo sites sozinhos ou como parte de uma pequena equipe, dentro das restrições de tempo e orçamento impostas por seus clientes. A maioria de vocês está construindo sites de pequeno a médio porte para pequenas e médias empresas ou até mesmo pequenas lojas familiares. Você não pode se dar ao luxo de ficar obcecado em alcançar uma “pontuação perfeita”. Essa é uma meta quase inatingível, e não a expectativa pragmática para cada site. Sim, você pode alcançar uma pontuação perfeita, mas se isso significa que você tem um site que é difícil de construir e manter, isso é realmente algo positivo ou você involuntariamente colocou seu nome no prêmio Darwin?
Você deve otimizar apenas o máximo que puder. Você tem prazos a cumprir e, francamente, algumas das otimizações podem simplesmente consumir uma quantidade desproporcional de seu tempo para ganhos marginais. Comece de forma simples e só vá mais fundo dependendo do prazo e orçamento do seu cliente.
Este é o contexto desta série de artigos. Não é axiomático, é prático. Estou apresentando várias maneiras de otimizar sites do mundo real com uma compensação razoável entre ganhos totais de desempenho e capacidade de manutenção. Estas não são abordagens de sala limpa que funcionam muito bem na teoria, mas na prática requerem muito mais recursos do que os que estão realisticamente disponíveis para a maioria dos nossos leitores.
Vamos colocar isso de outra maneira. Sim, você sempre pode criar um aplicativo baseado em microsserviços e CDN, se desejar. Ou use algumas técnicas realmente avançadas que contornam uma infinidade de limitações impostas pela abordagem única de usar um CMS como Joomla (ou WordPress, ou Drupal, ou...) em vez de construir seu próprio aplicativo personalizado. Mas não estou aqui para dizer por que ou como não usar um CMS. Estou aqui para lhe dizer como você pode usar melhor o CMS de que dispõe para obter melhores resultados dos quais antes não sabia como chegar. Todas essas são técnicas que pratiquei em meus sites e funcionaram mutio bem!
O absolutamente “óbvio”
Quando você usa o Joomla desde o Mambo em 2004, seu antecessor, como o seu, existem algumas verdades básicas sobre como você aborda a construção de sites que parecem bastante óbvias. Aqui está a coisa. Nada é realmente “óbvio”; é tudo uma questão de experiência.
No passado, pensei que as pessoas deviam estar loucas por não verem uma série de pontos que eram dolorosamente óbvios para mim. Eventualmente, percebi que tenho uma experiência única por ter estado no backend de inúmeros sites e adquiri um conjunto único de habilidades ao longo de uma longa carreira... Desculpe, filme errado. O que quero dizer é que percebi que o que é óbvio para mim pode ser bastante misterioso para alguém que está começando agora ou está acostumado a fazer as coisas de uma maneira diferente da minha. Verdade seja dita, se eu pudesse me aproximar de mim mesmo há 16 anos, provavelmente me daria um tapa na cara por fazer coisas que aprendi da maneira mais difícil em algum momento posterior, que são absurdas ou me prejudicam no longo prazo.
Discutirei os três erros mais comuns que vi em sites e como corrigi-los facilmente. Ei, alguns deles nem têm a ver com o próprio Joomla!
Hospedagem
O erro mais comum que vejo é as pessoas escolherem hospedagem compartilhada barata e depois reclamarem que seu site Joomla é lento. Sim, o site deles é lento, mas o Joomla não é o motivo. A hospedagem que você escolhe para o seu site é crucial. Não tente economizar centavos aqui!
Você já se perguntou por que um host barato oferece um preço abaixo de US$ 3 por mês, enquanto um host de boa qualidade cobra de cinco a dez vezes mais por hospedagem compartilhada com especificações iguais ou nominalmente inferiores? A diferença é que o host mais barato tenta amontoar mais sites em um único servidor físico e mantém os custos baixos usando CPUs e memória mais lentas, unidades de disco mecânicas mais lentas e conectividade com a Internet mais limitada. Tudo isso conspira para tornar seu site consideravelmente mais lento para começar. Nenhum ajuste pode salvá-lo quando você começa com uma hospedagem ruim.
Pense assim. Você pode fazer um carro tão aerodinâmico quanto um caça a jato. Se o motor em que ele funciona for um motor monocilíndrico e dois tempos de uma motocicleta, ele não vencerá e atingirá recordes de velocidade. Provavelmente será ultrapassado por alguém caminhando em ritmo acelerado. O motor do seu site é o seu ambiente de hospedagem. Ele determina o desempenho máximo que você pode obter com isso.
Tente encontrar um equilíbrio entre o desempenho ideal e o seu orçamento realista. Se não tiver certeza, escolha um provedor de hospedagem compartilhada de médio porte com boa reputação boca a boca e possivelmente reavalie após alguns meses com tráfego do mundo real. Se o seu cliente ditar a hospedagem, certifique-se de ter o The Talk com ele: explique que não importa o que você faça, a escolha da hospedagem limitará o desempenho do site que você constrói.
Templates pré-construídos
Muitas pessoas que constroem sites estão usando um Template pré-construído com uma infinidade de opções, uma estrutura genérica que tenta ser tudo para todos, normalmente combinada com dezenas de componentes, plugins e módulos para construir um site que não é tão complexo se pense nisso.
Eu entendo o apelo, já que já fiz isso no passado. Você se sente capacitado para mexer no layout do seu site e experimentar diferentes opções até encontrar o que funciona. Eu diria que você deveria fazer isso se achar que esse é o seu processo criativo, mas não necessariamente se limite ao Template genérico pré-construído depois de descobrir como deseja que seu site fique. Se você se sentir desconfortável em criar seu próprio Template, claro, um pré-construído é a única maneira para você, mas tenha em mente que isso limitará suas métricas de desempenho.
O problema objetivo é que um Template genérico é construído para flexibilidade, não para velocidade. Na minha experiência, o carregamento da sua página (Tempo até o primeiro byte - TTFB) pode aumentar em uns bons 1 a 3 segundos apenas por causa de toda a bagagem desnecessária que você está arrastando com você usando esse tipo de Template. Um Template personalizado baseado no Cassiopeia do Joomla 4 é rapido, tem um impacto insignificante, na faixa de uma fração de milissegundo.
Mesmo que você vá até a metade e use apenas uma estrutura de template genérica, ainda estará arrastando muito código desnecessário, a menos que realmente saiba o que está fazendo. Sem mencionar que você instalou uma quantidade substancial de código PHP e JavaScript que precisa ser mantido regularmente por motivos de segurança.
Outro problema com templates pré-construídos e estruturas de templates é que eles tendem a carregar todo o seu CSS e JavaScript no cabeçalho da saída HTML, o que tem um impacto adverso em seus Core Web Vitals, especialmente no First Contentful Paint. Um modelo personalizado baseado em Cassiopeia carregará esses arquivos estáticos adiados, tornando a exibição do seu site muito mais rápida.
Se você tiver as habilidades e o tempo, será melhor criar seu próprio template. Isso parece assustador, mas não é se você já é um construtor de sites Joomla experiente e entende as ferramentas básicas, porém poderosas, do Joomla, como substituições de templates. Você pode usar qualquer estrutura CSS que desejar e começar com o template padrão do Joomla 4, Cassiopeia.
Não sou um desenvolvedor front-end de forma alguma. Consegui facilmente pegar o design criado para o meu site e “traduzi-lo” para um template Joomla 4 baseado em Cassiopeia sem muitos problemas. Bootstrap 5, integrado ao Joomla e ao que Cassiopeia está usando, é extremamente versátil. A única coisa que você precisa entender para tornar possível qualquer tipo de apresentação visual — e responsiva! - é CSS Flexbox.
Não exagere
Existe o velho ditado de “só porque você pode, não significa que deve”. No contexto do Joomla, só porque você pode instalar centenas de extensões não significa que deva!
Com mais de 7.000 extensões no diretório de extensões Joomla, é bastante fácil exagerar e instalar tudo o que existe. Um plugin para isso, um módulo para aquilo, um construtor de páginas em vez de uma simples substituição de template e antes que você perceba, você terá mais de 300 extensões de terceiros carregando em cada página do seu site. Como você pode imaginar, isso faria com que qualquer site ficasse lento.
Vamos falar sobre módulos. Minha observação casual é que 90% dos módulos exibidos em 90% dos sites que visitei ou nos quais trabalhei não têm razão de existir. Ninguém se importa com o clima na sua cidade; se o fizessem, estariam perguntando ao Google, Alexa ou Siri em vez de visitar seu site. Ninguém se importa com as três dúzias de botões, links e banners de conteúdo que você tem na barra lateral. As pessoas querem uma navegação intuitiva, não uma lista telefônica. Pior ainda, os sites de mídia social condicionaram os visitantes do seu site a entrar no modo “cegueira da barra lateral e do banner”, ou seja, eles presumem que esse conteúdo é lixo com o qual não precisam se preocupar. Os módulos podem servir a um propósito verdadeiro, mas use-os com moderação. Não tente “preencher o espaço vazio” com módulos inúteis.
O que nos leva aos plug-ins, especialmente plug-ins de conteúdo e plug-ins de sistema que pesquisam e substituem texto em páginas inteiras. Os plug-ins de conteúdo são executados sempre que o conteúdo é exibido em seu site. Eles precisam fazer algum tipo de inicialização e algum tipo de substituição de texto. Essas operações levam tempo. A pesquisa de página inteira e a substituição por plug-ins do sistema, especialmente se usarem expressões regulares, levam ainda mais tempo. É realmente uma pesquisa e substituição em cada saída de página do seu site uma solução melhor para substituições de modelos, substituições de idioma ou passar algum tempo alterando o conteúdo no back-end ou diretamente no banco de dados?
Quando você combina o abuso excessivo de módulos e plug-ins, você pode acabar com um site que precisa fazer centenas de consultas ao banco de dados e gastar alguns segundos preciosos substituindo coisas no conteúdo que demorou uma eternidade para ser gerado. Sim, este site será muito lento. Na verdade não é culpa do Joomla, é apenas o resultado direto da abordagem de implementação que você adotou. Não direi que é necessariamente ruim, mas também não direi que é o melhor caminho a seguir.
Se você tiver um problema que precisa ser resolvido, usar uma extensão deve ser seu último recurso. Comece primeiro com campos personalizados, substituições de template e substituições de idioma. Se você acha que o site parece “vazio”, crie conteúdo de qualidade, não o encha com módulos inúteis com os quais ninguém se importa, mas ainda assim deixam seu site mais lento. A principal diretriz é KISS: Keep It Stupidly Simple. É mais fácil falar do que fazer e geralmente são necessárias algumas iterações para chegar lá. Lembre-se de sempre reavaliar se você precisa de uma extensão e desativá-la ou desinstalá-la quando não a estiver mais usando.
Substituir em vez de adicionar lixo
A maioria das pessoas aborda o desenvolvimento de sites de seus clientes da mesma forma que um usuário de Android ou iPhone aborda o uso de seu dispositivo: se eu precisar fazer algo, preciso instalar algo. Eu chamo isso de Existe um aplicativo para essa síndrome ou “TAFTS”, para abreviar. Parece uma condição terminal, não é?
Pessoas que sofrem dessa síndrome acabam usando um zilhão de extensões que tornam o site lento e se tornam um grande obstáculo na atualização do Joomla ou do PHP alguns meses depois.
O problema é que você não precisa adicionar lixo ao seu site. Joomla é extremamente flexível imediatamente. Quando você quiser fazer algo, pare e pergunte-se: isso pode ser feito apenas com os recursos básicos do Joomla?
Ao contrário da maioria dos CMS existentes, o Joomla permite que você substitua a forma como ele exibe tudo e qualquer coisa usando substituições de idioma, substituições de template/layout e campos personalizados. Usando essas ferramentas simples, você pode criar conteúdo incrivelmente complexo e muito fácil de gerenciar. Afinal, Joomla descende de um CMS chamado Mambo cujo lema era “poder na simplicidade”.
Usando nada além de substituições de layout e campos personalizados, criei uma página de tutoriais em vídeo para meu site comercial, hospedando automaticamente os vídeos (sem incorporações no YouTube / Vimeo). A página de categorias de vídeo que você acessa é uma visualização de blog de categoria Joomla com uma substituição de template simples e uma pitada de CSS personalizado. Ao clicar em uma categoria, você verá uma lista de vídeos. Esta é apenas uma visualização de lista de categorias com uma substituição de template. A duração do vídeo é um campo de texto personalizado. Existem mais dois campos de URL personalizados apontando para o arquivo de vídeo e a imagem do quadro do pôster. Eles são usados para exibir a parte superior da página de vídeo individual (player de vídeo). Essa página é apenas um artigo. O conteúdo do artigo é a transcrição que você vê mais abaixo na página. A transcrição possui atributos data-timecode que são analisados pelo JavaScript da página, carregados na substituição do template, tornando-os links clicáveis para apontar para pontos específicos no tempo no player de vídeo. É legal e é tudo básico do Joomla. Não há necessidade de uma galeria de terceiros ou de um componente dedicado de tutoriais em vídeo.
Vi a humilde página da lista de tags se tornar um lindo painel de seleção de área de conteúdo para uma organização sem fins lucrativos. Já vi artigos principais com campos personalizados definirem o conteúdo de maneira amigável para um aplicativo da Web com toque inicial, sem nenhum código de terceiros, exceto o manipulador de eventos de toque JavaScript. Já vi substituições de templates muito simples que fazem a página de perfil do usuário do Joomla parecer um serviço profissional de alta qualidade, em vez de um monte de campos agrupados.
É verdade que nem tudo é possível apenas com o núcleo - você não pode razoavelmente fazer comércio eletrônico ou agendar compromissos com o núcleo do Joomla, você precisa de uma extensão ou serviço de terceiros - mas as extensões definitivamente não são a primeira ou única escolha que você tem como um integrador de sites.
Ao aderir a um uso bem planejado e mínimo de extensões de terceiros, você evita tornar o site mais lento e garante sua manutenção a longo prazo. Isto é especialmente importante quando extensões menos usadas desaparecem da face da Terra e você fica com a difícil escolha de reimplementar parcialmente um site ou mantê-lo com uma versão desatualizada do Joomla. Lembrem-se, pessoal, um grama de premeditação vale um quilo de tentativa frenética de consertar uma decisão errada quando já é tarde demais.
Continua em:
https://www.dionysopoulos.me/joomla-performance-tuning-ii-basic-settings.html