Otimização de desempenho Magento explicada

O desempenho do Magento é de suma importância. A velocidade de carregamento tem um impacto direto e mensurável na taxa de conversão do seu site, portanto, ter uma instalação otimizada do Magento é crucial para o sucesso de sua loja Magento e possivelmente até de seus negócios em geral.

Neste artigo, apresentarei algumas maneiras pelas quais os desenvolvedores do Magento podem otimizar sua instalação do Magento 2 e explicarei como fazer o seguinte:

• Verifique os módulos de terceiros e encontre gargalos
• Ativar cache de página inteira
• Verniz, não arquivos para cache de página inteira
• Certifique-se de que o cache de página inteira funcione, ele pode ser quebrado facilmente
• Ativar modo de produção
• Minificação CSS/JS
• Ativar tabelas planas
• Obtenha a hospedagem mais rápida que você pode pagar
• Otimizar imagens
• Indexadores para “Atualizar na Agenda”
• Compressão GZIP
• Use o Elasticsearch em páginas de catálogo e pesquisa.
• Verifique se há chamadas Ajax desnecessárias de volta ao servidor após o carregamento da página (pode causar bloqueios de sessão)
• Redis para cache de página e armazenamento de sessão

Verifique os módulos de terceiros e encontre gargalos

Existem muitos módulos Magento de terceiros com código ruim, usando métodos obsoletos ou com problemas de compatibilidade com a versão estável mais recente do Magento. A melhor maneira de identificar solicitações pesadas é usar um criador de perfil. Isso ajuda a identificar quantas consultas MySQL você tem em uma página e quantas são idênticas. Sabendo disso, você pode compactar essas consultas em uma e, assim, acelerar o Magento.

Uma das principais coisas que os desenvolvedores juniores estão fazendo de errado no Magento é carregar modelos dentro de loops. Tente evitar isso o máximo que puder. Carregue toda a coleção com tudo o que você precisa e, em seguida, faça um loop por ela. Tenha sempre em mente a complexidade de tempo e espaço e construa seu algoritmo de forma otimizada.

Veja como seu layout é carregado e quais são os blocos de modelo que executam o mais lento, então olhe para esse código. Examine as métricas do Modelo CRUD, onde você pode encontrar dados perspicazes, como carregar chamadas em loops.

Cache de página inteira Magento

Quando um usuário está acessando sua loja, uma solicitação é feita ao servidor. Essa solicitação é processada pelo PHP fazendo operações específicas e consultas ao banco de dados e retornando o HTML correspondente para ser exibido ao usuário. O cache de página inteira armazena essa resposta HTML, para que a próxima solicitação idêntica a retorne diretamente, ignorando todo o processamento de back-end e consultas de banco de dados. Isso torna a resposta do site muito mais rápida.

Usar o cache de página inteira como parte de seus esforços de otimização do Magento pode aumentar tremendamente a velocidade do seu site. Isso criará versões em cache de suas páginas e as entregará ao usuário em vez de executar todas as consultas para cada solicitação. Claro, nem todas as páginas são armazenadas em cache. Por exemplo, a página do carrinho não será armazenada em cache, caso contrário, todos os usuários verão a primeira versão em cache da página. Essas são páginas dinâmicas ou seções de páginas específicas do usuário e da sessão.

Para habilitar o cache de página inteira do Magento, você pode executar o seguinte comando da CLI:

php bin/magento cache:enable full_page

Para habilitar os tipos de cache, você pode executar o comando CLI:

php bin/magento cache:enable

Você também pode fazer isso no Magento Admin fazendo login como administrador:

1. Vá para Sistema > Ferramentas > Gerenciamento de Cache
2. Selecione o tipo de cache que você deseja ativar
3. Na lista suspensa Ações , selecione Ativar e clique em Enviar

Use verniz para cache de página inteira

Ao habilitar o cache de página inteira, use o Varnish para lidar com isso, não com arquivos. A Magento recomenda fortemente o uso do Varnish (ou Redis) na produção. O cache integrado de página inteira (para o sistema de arquivos ou banco de dados) é muito mais lento que o Varnish, e o Varnish foi projetado para acelerar o tráfego HTTP.

Você pode encontrar um guia completo sobre como instalar e configurar o Varnish na documentação oficial do Magento 2.

Para configurar o Magento para usar o Varnish, faça login no Magento Admin como administrador:

1. Vá para Lojas > Configuração > Avançado > Sistema > Cache de página inteira
2. Na lista de aplicativos de cache , clique em cache de verniz
3. Insira um valor no campo TTL para conteúdo público
4. Expanda Configuração de verniz e insira as informações específicas sobre sua configuração de verniz

Certifique-se de que o cache de página inteira funcione: é facilmente quebrado

O cache de página inteira pode ser facilmente quebrado no Magento 2. Por exemplo, se você deseja excluir um bloco do cache, não use o atributo cacheable="false" no layout XML ao declarar seu bloco. Isso desabilitará o cache de toda a página que contém esse bloco, não apenas desse bloco. Isso é um erro que eu já vi pessoas cometerem.

Procure o atributo cacheable="false" em seus layouts e veja em quais blocos eles são definidos e em quais páginas esses blocos são chamados. Assim, você pode identificar se páginas triviais têm problemas com o cache.

Você também pode testar se sua página é armazenada em cache manualmente. Coloque a loja no modo de desenvolvedor em seu ambiente local ou de palco:

1. Limpar cache do Magento
2. Carregar a página no navegador
3. Inspecione os cabeçalhos de página na guia de rede de depuração do navegador.
4. Procure por X-Magento-Cache-Debug: MISS
5. Atualize a página, ela deve mudar para HIT

Se não mudar para HIT, significa que a página não está em cache e o cache não está funcionando.

Não se esqueça de ativar o modo de produção

O Magento tem três modos de execução, default , developer e production mode.

O modo de produção destina-se à implantação em um sistema de produção. Este modo oculta exceções, serve os arquivos estáticos apenas do cache e não permite habilitar ou desabilitar os tipos de cache no Magento Admin. Também impede a compilação automática de arquivos de código.

Enquanto trabalha e desenvolve a loja, o modo de desenvolvedor está ativo. Não se esqueça de mudar para o modo de produção ao implantar seu site no servidor ativo!

O comando CLI para ver o modo atual é:

php bin/magento deploy:mode:show

O comando CLI para alternar para o modo de produção é:

php bin/magento deploy:mode:set production

O comando CLI para alternar para o modo de desenvolvedor é:

php bin/magento deploy:mode:set developer

Você pode encontrar informações mais detalhadas sobre os diferentes modos Magento aqui.

Minificação CSS/JS

Minimizar os arquivos CSS e JS é um elemento importante da otimização de velocidade do Magento 2. Ao minimizá-los, removemos todos os espaços, tabulações e novas linhas nos arquivos. Os arquivos resultantes terão menos caracteres e, portanto, um tamanho menor, para que o download seja mais rápido.

Magento tem esse recurso embutido e você pode habilitar a minificação CSS/JS no Admin. Para habilitar a minificação de JavaScript, siga estas etapas:

1. coloque o Magento no modo de produção
2. Vá para Lojas > Configuração > Avançado > Desenvolvedor
3. Defina a opção Minimizar arquivos Javascript como Sim
4. Salvar configuração
5. Esvazie o cache na página Sistema > Gerenciamento de cache

Para habilitar a minificação de CSS, são necessárias as seguintes etapas:

1. coloque o Magento no modo de produção
2. Vá para Lojas > Configuração > Avançado > Desenvolvedor > Configurações de CSS
3. Defina a opção Minify CSS Files para Yes
4. Salvar configuração
5. Esvazie o cache na página Sistema > Gerenciamento de cache

Nota: Não mescle arquivos JS – apenas reduza-os .

Ativar tabelas planas

Magento usa o modelo EAV (entity attribute value) que armazena os atributos de suas entidades em várias tabelas dependendo do tipo de valor. O uso de várias tabelas, junções e solicitações em várias tabelas são necessários para recuperar os dados, o que pode tornar as consultas mais lentas.

Magento tem a opção de usar tabelas planas para o catálogo e produtos. As tabelas planas são criadas mesclando todos os atributos de uma entidade em uma tabela. Ao solicitar os dados precisamos consultar uma tabela, tornando-a muito mais rápida.

Magento gera e atualiza tabelas planas em cada indexação. Você pode habilitar tabelas planas fazendo login no Magento Admin como administrador:

1. Vá para Lojas > Configuração > Catálogo > Catálogo > Vitrine
2. Selecione Sim para Usar Categoria de Catálogo Simples
3. Selecione Sim para Usar Produto de Catálogo Simples
4. Salvar configuração

Escolha a Hospedagem Rápida Magento

Confira os requisitos mínimos do Magento e veja se seu servidor os atende. Você pode ver os requisitos oficiais da pilha de tecnologia Magento 2.2.x aqui.

A configuração de hospedagem é muito importante para o desempenho do Magento 2. Também existem serviços de hospedagem dedicados para Magento, embora possam ser mais sobre marketing do que qualquer outra coisa.

Conclusão: obtenha a solução de hospedagem mais rápida que você pode pagar, a menos que seja um exagero para o seu projeto.

Otimização de imagem Magento

O tamanho das suas imagens obviamente impacta na velocidade do seu site. Por exemplo, se você tiver uma página de catálogo com 20 produtos e cada imagem de produto tiver 1 Mb de tamanho, isso fará com que um total de 20 Mb seja baixado quando a página for carregada, e isso obviamente pode ser um problema em alguns cenários (dispositivos móveis, largura de banda limitada em certas regiões etc.).

Verifique se as suas imagens estão devidamente otimizadas e se têm uma boa relação entre qualidade e tamanho. Além disso, certifique-se de que suas imagens não sejam redimensionadas por CSS, mas tenham o arquivo de origem redimensionado para o tamanho específico que você precisa.

Outra técnica é usar o carregamento lento, o que significa carregar suas imagens depois que a página foi totalmente carregada ou enquanto o usuário rola pelo catálogo.

Você também pode usar a AWS ou uma CDN para entregar seu conteúdo com muito mais rapidez. Vamos dar uma olhada rápida nas diferenças entre AWS, CDN e hospedagem tradicional de uma perspectiva de otimização de bitmap.

Hospedagem tradicional

A maneira tradicional é armazenar seu conteúdo, como imagens, no mesmo servidor do seu site. Isso pode ocupar espaço em disco e uma boa parte da sua largura de banda, criando uma carga substancial no servidor. Obviamente, dimensionar com hospedagem tradicional pode ser um problema.

CDN (Rede de Entrega de Conteúdo)

Uma rede de entrega de conteúdo geralmente é usada para reduzir a carga de um servidor ao servir parte do conteúdo do site. Além disso, traz alto desempenho ao entregar seu conteúdo com rapidez e alta disponibilidade usando múltiplas redes para chamar.

AWS (Amazon CloudFront)

O Amazon CloudFront é uma rede de entrega de conteúdo (CDN) altamente segura que fornece proteção no nível da rede e do aplicativo. Confira este tutorial sobre como começar a usar a AWS e entregar conteúdo mais rapidamente.

Além disso, você pode usar a AWS para redimensionar imagens rapidamente com base nas dimensões passadas por meio de um parâmetro de consulta. Para obter informações adicionais, consulte este tutorial sobre redimensionamento de imagens com Amazon CloudFront e Lambda@Edge.

Definir indexadores para "Atualizar na programação"

Os indexadores Magento podem ser configurados para dois modos: “ Atualizar ao salvar ” ou “ Atualizar no agendamento ”.

Quando eles são definidos como “Atualizar ao salvar” toda vez que você salva um produto, atributo ou categoria, o índice específico começa a ser executado. Os indexadores podem consumir recursos e isso pode tornar seu servidor mais lento.

O melhor modo para definir os indexadores é “Update on Schedule”. Dessa forma, você tem certeza de que eles são executados pelo cron job em um horário específico que você definiu. Escolha um horário em que o tráfego em seu site esteja baixo.

Você pode visualizar o modo de indexadores atual executando o comando:

php bin/magento indexer:show-mode

Ou no Magento Admin acessando:

Sistema > Gerenciamento de Índice

Você pode alterar o modo dos indexadores para “Update on Schedule” executando o comando:

php bin/magento indexer:set-mode schedule

Você pode alterar o modo dos indexadores para “Atualizar ao salvar” executando o comando:

php bin/magento indexer:set-mode realtime

E aqui está no Magento Admin:

Sistema > Gerenciamento de índice: selecione todos os indexadores e, no menu suspenso Ações , selecione "Atualizar no agendamento"

Você também configura as tarefas agendadas acessando Admin para:

Loja > Configurações > Configuração > Avançado > Sistema > Cron (Tarefas Agendadas)

Expanda “Opções de configuração do Cron para o grupo: índice”

Compressão GZIP

Gzip é um método de compactação de arquivos para transferências de rede mais rápidas. A compactação permite que seu servidor da Web forneça tamanhos de arquivo menores que carregam mais rapidamente para os usuários do seu site. No entanto, isso tem um custo.

Ao compactar um arquivo, você carrega a CPU, e quanto mais compactar um arquivo, mais demorado será o processo. Embora isso possa aumentar a carga da CPU do servidor, também pode diminuir substancialmente o uso da largura de banda. Com o gzip, você pode escolher entre diferentes níveis de compactação, variando de 1 a 9.

No nível 1, você tem o tempo de compactação mais rápido, mas uma taxa de compactação mais baixa. No lado oposto, no nível 9, você tem a maior taxa de compressão, mas uma velocidade menor. A configuração padrão do gzip usa o nível 6, favorecendo a compactação sobre a velocidade. O Nginx usa o nível 1, favorecendo a velocidade sobre o tamanho do arquivo.

Para ativar a compactação gzip e ativar o módulo mod_deflate do Apache, você pode adicioná-lo atualizando seu arquivo .htaccess e descomentar as linhas apropriadas conforme mostrado abaixo. O módulo mod_deflate compacta recursos estáticos em arquivos menores antes de transferi-los para o navegador.

 <IfModule mod_deflate.c> ############################################ ## enable apache served files compression ## http://developer.yahoo.com/performance/rules.html#gzip # Insert filter on all content SetOutputFilter DEFLATE # Insert filter on selected content types only AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/javascript application/javascript application/x-javascript application/json image/svg+xml # Netscape 4.x has some problems... BrowserMatch ^Mozilla/4 gzip-only-text/html # Netscape 4.06-4.08 have some more problems BrowserMatch ^Mozilla/4\.0[678] no-gzip # MSIE masquerades as Netscape, but it is fine BrowserMatch \bMSIE !no-gzip !gzip-only-text/html # Don't compress images SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png)$ no-gzip dont-vary # Make sure proxies don't deliver the wrong content Header append Vary User-Agent env=!dont-vary </IfModule>

Use o Elasticsearch em páginas de catálogo e pesquisa

Outra maneira de aumentar a velocidade do seu site é usar o Elasticsearch para páginas de catálogo e resultados de pesquisa. Configure seu servidor Elasticsearch e conecte sua loja Magento a ele. A pesquisa se torna muito mais rápida usando o Elasticsearch.

Este guia oficial explica como você pode configurar o Magento com o Elasticsearch.

Para configurar o Magento para usar o Elasticsearch, faça login no Magento Admin como administrador:

1. Clique em Lojas > Configurações > Configuração > Catálogo > Catálogo > Pesquisa de Catálogo.
2. Na lista Search Engine , clique em Elasticsearch ou Elasticsearch 5.0+ como mostra a figura a seguir. (A opção Elasticsearch 5.0+ não está disponível para Magento 2.1.)

Verifique se há chamadas Ajax desnecessárias

Chamadas de volta para o servidor após o carregamento da página podem causar bloqueios de sessão. Uma maneira de verificar todas as chamadas Ajax que sua página está fazendo é usando o DevTools no Chrome. Você pode abri-lo clicando com o botão direito do mouse na página e selecionando Inspecionar.

Vá para a guia rede e lá você pode filtrar a solicitação por XHR. Agora você pode ver todas as solicitações Ajax da página e verificá-las para ver quais delas são necessárias naquela página específica.

Redis para cache de página e armazenamento de sessão

Redis é uma solução opcional de cache de back-end para substituir Zend_Cache_Backend_File , que é usado no Magento 2 por padrão.

Por que usar o Redis?

Usar o Redis pode ter várias vantagens:

• Você pode substituir o memcached pelo Redis porque ele também pode ser usado para armazenamento de sessão PHP.
• O Redis oferece suporte para salvamento em disco e replicação mestre/escravo, que é um recurso altamente solicitado que não é compatível com o memcached. A replicação evita um único ponto de falha e fornece alta disponibilidade.
• As operações de tag não exigem uma verificação completa de cada arquivo de cache porque o Redis funciona indexando tags em arquivos.
• O back-end suporta limpeza de cache baseada em tags sem loops foreach.

Há também uma desvantagem principal:

• Como o Redis é um armazenamento na memória, todos os seus dados devem caber na memória, o que significa que são limitados apenas pela velocidade e capacidade da RAM.

Configure o Magento para usar o Redis para armazenamento de sessão

A seguir está uma configuração de exemplo para adicionar ao <your Magento install dir>app/etc/env.php :

 'session' => array ( 'save' => 'redis', 'redis' => array ( 'host' => '127.0.0.1', 'port' => '6379', 'password' => '', 'timeout' => '2.5', 'persistent_identifier' => '', 'database' => '2', 'compression_threshold' => '2048', 'compression_library' => 'gzip', 'log_level' => '1', 'max_concurrency' => '6', 'break_after_frontend' => '5', 'break_after_adminhtml' => '30', 'first_lifetime' => '600', 'bot_first_lifetime' => '60', 'bot_lifetime' => '7200', 'disable_locking' => '0', 'min_lifetime' => '60', 'max_lifetime' => '2592000' ) ),

Você pode conferir aqui todos os detalhes sobre os parâmetros e como fazer uma verificação básica de que sua instalação Redis funciona bem junto com seu Magento.

Configure o Magento para usar o Redis para página e cache padrão

Há duas maneiras de configurar o Redis para página e cache padrão. Você pode editar manualmente o arquivo <Magento install dir>app/etc/env.php ou pode usar a linha de comando, que é o método recomendado porque também fornece validação.

Para o cache padrão execute o comando:

php bin/magento setup:config:set --cache-backend=redis --cache-backend-redis-<parameter_name>=<parameter_value>...

Especifique os parâmetros específicos do cache padrão do Redis.

Para o cache da página execute o comando:

Php bin/magento setup:config:set --page-cache=redis --page-cache-redis-server=redis.example.com --page-cache-redis-db=1

Este comando habilita o cache da página Redis, define o host como redis.example.com e atribui o número do banco de dados a 1. Você pode verificar todos os detalhes no Magento DevDocs.

Otimização de desempenho do Magento resumida

Cobrimos algumas abordagens para otimização de desempenho do Magento 2, então vamos fazer uma rápida recapitulação.

Identificar e resolver gargalos fará uma enorme diferença no processamento de seus dados. Usar cache de página inteira e verniz também melhorará a velocidade do seu site e acelerará o tráfego HTTP. Você deve sempre usar o Magento no modo de produção em seu servidor ao vivo, sem desculpas. Use a minificação para diminuir o tamanho dos arquivos CSS e JS, um arquivo menor será baixado mais rapidamente e usará menos largura de banda.

Habilite tabelas simples para diminuir as solicitações do banco de dados e melhorar o tempo de resposta do banco de dados. Otimize suas imagens e use um CDN, se possível. Defina indexadores para atualizar no cronograma e habilite o cron do Magento. Ativar a compactação gzip também diminuirá o tamanho dos arquivos a serem baixados. O uso do Elasticsearch aumentará a velocidade das páginas do seu catálogo e a página de resultados da pesquisa será carregada muito mais rapidamente. Use o Redis para cache de página e armazenamento de sessão, que é significativamente mais rápido que o memcache padrão.

Você pode implementar todas essas recomendações ou apenas algumas que não usou até agora. Mesmo um par deve ser suficiente para melhorar o desempenho do Magento, que deve se transformar em mais conversões.