jun
08

Ganho de performance em sistemas web

posted on junho 8th 2014 in Apache & Dicas & Diversos & Ubuntu with 0 Comments

Performance de sistemas webÉ bastante comum o desenvolvimento de um site ou sistema web e não existir uma preocupação com a performance, tempo de resposta, tempo de renderização e outras variações que podem deixar seu sistema lento.

Existem diversas técnicas e diversos sites que avaliam como está, e até o que deve ser feito para corrigir as falhas, um dos que mais me surpreendi foi o do Google (pra variar…) que pode ser acessado pelo link https://developers.google.com/speed. Nele é possível ter várias ferramentas que irão sem dúvida te ajudar, com destaque para PageSpeed Insights (http://developers.google.com/speed/pagespeed/insights/).

No PageSpeed Insights o Google avalia o que é mais importante para uma renderização otimizada tanto para mobile quando para desktop e te dar dicas do que fazer para corrigir erros. É considerando um site ideal, quando ficar com uma média acima de 90% na velocidade, experiência do usuário e resumo de sugestões.

O uso de cache e minificação de arquivos JS e CSS é um dos importantes fatores mencionados, com isso acabei adaptando o .HTACCESS dos meus sistemas para cobrir essa “falha” bem comum, acabei ganhando 50% de velocidade em muitas das requisições do sistema que apliquei o código para testar.

Com o código abaixo, não se faz necessário alteração de outros arquivos. O mod_deflate é módulo dos servidores Apache (comum no uso de hospedagens PHP ou em servidor Windows com ISAPI V3) que permite comprimir arquivos e ter um ganho na banda, o que além de tornar o sistema rápido para o usuário que está navegando, ajuda também seu servidor.

<IfModule mod_deflate.c>

#Controle de cache
Header set Cache-Control “public”
ExpiresActive on

ExpiresDefaul
ExpiresByType text/cache-manifest
ExpiresByType text/html

# Dados e textos
ExpiresByType text/xml
ExpiresByType application/xml
ExpiresByType application/json

# Feed RSS
ExpiresByType application/rss+xml

# Favicon (não pode ser renomeado)
ExpiresByType image/vnd.microsoft.icon

# Imagens
ExpiresByType image/gif
ExpiresByType image/png
ExpiresByType image/jpg
ExpiresByType image/jpeg

#Vídeos / Áudio
ExpiresByType video/ogg
ExpiresByType audio/ogg
ExpiresByType video/mp4
ExpiresByType video/webm

# Webfonts
ExpiresByType font/truetype
ExpiresByType font/opentype
ExpiresByType font/woff
ExpiresByType image/svg+xml
ExpiresByType application/vnd.ms-fontobject

# CSS / jScript
ExpiresByType text/css
ExpiresByType application/javascript
ExpiresByType text/javascript

</IfModule>

Todo o código acima, deve ficar no arquivo .htaccess da raiz do seu sistema, caso você já tenha algum outro código no arquivo, não tem problema, pode ser adicionado no fim do mesmo. Faça o teste com o PageSpeed Insights medindo antes de aplicar o código e posteriormente.

Separei por blocos o que cada área é responsável por otimizar, creio que ajuda o entendimento e espero que ajude a muitos como me ajudou!

We would love to hear your comments