Home / Tutoriais / 10 Dicas para reduzir a carga do seu servidor e reduzir o tráfego.

17 Mar 2009
reduzir-a-carga-do-seu-servidor-reduzir-trafego

10 Dicas para reduzir a carga do seu servidor e reduzir o tráfego.

por: | em: Tutoriais | 5 Comentários | lido: 1.295 vezes

Delicious Guarde no Delicious

Com o continuo crescimento do seu site ou blogue, o alojamento desempenha um papel importantíssimo na disponibilização de dados. Infelizmente, existem alturas em que queremos rapidez e não a temos, ou pior ainda, esgotamos o limite de do mês. Neste artigo, vou ajudar a ultrapassar estas situações e a melhorar sensivelmente a rapidez do vosso servidor.

10 para reduzir a carga do seu servidor e reduzir o tráfego.

01. Substitua as imagens por código CSS.

As imagens fazem com que o seu servidor fique mais lento, além de consumirem muita largura de banda. Em vez de usarem imagens de fundo no vosso site, usem código CSS. Por exemplo. Se quisermos usar um fundo vermelho no nosso site, então substituímos red-bg.jpg por este código CSS: background-colour:#F00. Com a CSS podemos escolher o nosso fundo ou imagem de fundo de qualquer elemento da CSS.

02. Optimizar as suas imagens.

A maior parte do tráfego consumido no servidor é realizado pelas imagens, então temos que optimizar as imagens para reduzir o tráfego do nosso servidor. Optimize as imagens para a internet, nunca use bitmap (.bmp). Use sempre imagens em jpeg (.jpg) ou gif (.gif). Uma boa maneira de reduzir o tráfego é optimizar os thumbnails, tente sempre não ultrapassar os 10kb, eu sei que é difícil principalmente nos gif’s animados, mas com um pouco de paciência consegue chegar lá. Tenho a certeza que no final do mês irá notar uma grande diferença no tráfego consumido do seu site. Na Internet existe imensos aplicativos para optimização de imagens, escolha o que melhor se adapte ás suas necessidades, seguindo esta linha de pensamento: “mais qualidade de imagem para o menor tamanho do ficheiro”. Se usa o Photoshop, então guarde os ficheiros utilizando o “Save for Web & Devices” (alt+shift+ctrl+s) e tente reduzir ao máximo o tamanho da imagem. Se utilizar imagens com muita cor então aconselho as extensões JPEG ou PNG.

03. Comprima o seu código CSS

Os ficheiros CSS podem ser muito grandes, com muitos espaços desnecessários. Existe uma maneira muito simples de reduzir o tamanho dos seus documentos CSS, tornando a sua página bastante mais rápida no carregamento. Por exemplo: Podemos usar isto:

 1. margin: 2px 1px 3px 4px (top, rightright, bottombottom, left)

em vez disto:

1. margin-top: 2px; 2. margin-right: 1px; 3. margin-bottom: 3px; 4. margin-left: 4px

Pode também procurar na internet por CSS Compressor.

04. Remover o código HTML desnecessário, tags e espaços em branco.

Você pode comprimir o tamanho da sua página reduzindo os espaços em branco dos seus ficheiros HTML, remover “comments” que não sejam absolutamente necessários. Quantos mais caracteres, maior o tamanho do ficheiro. O Wordoff é uma ferramenta simples que o pode ajudar nessa tarefa.

05. Use AJAX e livrarias JavaScript.

A tecnologia AJAX foi desenvolvida para comunicar com as suas livrarias de JavaScript sem executar novamente o carregamento da página. Em geral muitas das páginas do nosso website estão interligadas e têm conteúdos comuns entre elas. Usando o método tradicional, sempre que esse conteúdo é pedido o nosso servidor volta a carrega-lo. Contudo, se usarmos o Ajax esse conteúdo só é carregado quando solicitado, reduzindo drasticamente o tráfego do nosso servidor.

06. Desligar os Hotlinks

Os Hotlinks são os links das imagens do nosso website. Na realidade, o que acontece é que outros websites utilizam as nossas imagens através de links e tag’s, e sempre que um website faz um pedido dessas imagens, as mesmas são carregadas através do nosso servidor, “sacrificando a nossa banda”, que ainda por cima é paga por nós. Como podemos evitar isso? De uma maneira simples: Colocamos um ficheiro ‘.htaccess’ no directório das imagens. Isto irá dar autorização dos pedidos das imagens dentro da nossa rede, e se alguém as linkar fora dessa rede vai receber um grande “X Vermelho” em vez das imagens.

RewriteEngine On
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(.*\.)?yourserver.com [NC]
RewriteRule \.(jpeg|jpg|gif|png)$ - [F]

Também pode usar .htaccess generator para desabilitar os hotlinks.

07.Comprima o seu HTML e PHP com o GZIP

Tal como na CSS, o seu código HTML contém muitos espaços em branco. Se usa o PHP, então você pode usar o mod_gzip para Apache, para comprimir o seu conteúdo. O Mod_gzipd é um módulo de apache (existe nas versões Windows e Linux), este irá reduzir substancialmente o tamanho da sua página (hoje em dia quase todos os browsers entendem o conteúdo comprimido). A maneira mais fácil de fazer isso, é usar o ficheiro .htaccess. Recomendamos fazer desta forma, pois o método por .htaccess é muito fácil de implementar e pode sempre acrescentar mais configurações. Para utilizar a compressão gzip, vamos adicionar a seguinte linha ao nosso ficheiro .htaccess:

php_value output_handler ob_gzhandler

Ou então no header de cada pagina, inserir:

<ol class="dp-c">
<li class="alt"><span><span>< ? ob_start(</span><span class="string">"ob_gzhandler"</span><span>);?>
</span></span></li>
</ol>
<h1>

08. Aloje as suas imagens ou ficheiros em servidores gratuitos.

Se pretende partilhar grande quantidade de imagens ou ficheiros, aloje-os em servidores grátis, como o pict.com, Flickr, Pikasa, PhotoBucket, ImageShack, rapidshare.com e megaupload.com.

O Xigli.com usa, para imagens o pict.com e para ficheiros o easy share.

09. Website Caching

O caching é um método para carregar os dados de um ponto de armazenamento (cahe) em vez de serem carregados todas as vezes que são pedidos, isto é, quando acedemos a uma página com a cache activa, ela descarrega uma série de dados para o nosso computar e, assim sendo, quando lá voltamos, parte da informação já está carregada no nosso pc, reduzindo assim o tempo de carregamento e consumo de banda. Claro que é uma boa ideia configurar a data de expiração da cache nos cabeçalhos HTTP, ou então corremos o risco de fornecer aos nossos leitores conteúdo desactualizado. A maioria das imagens e ficheiros do nosso website por norma nunca mudam, sendo boa ideia fazer a cache localmente.

Cache com o mod_headers:

<ol class="dp-css">
<li class="alt"><span> # 1 YEAR </span></li>
<li><span><filesmatch \.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav)$=<span class="string">""</span></li>
<li class="alt"><span>Header set Cache-Control <span class="string">"max-age=29030400, public"</span></li>
<li><span></filesmatch> </span></li>
<li class="alt"><span> </span></li>
<li><span># 1 WEEK </span></li>
<li class="alt"><span><filesmatch \.(jpg|jpeg|png|gif|swf)$=<span class="string">""</span></li>
<li><span>Header set Cache-Control <span class="string">"max-age=604800, public"</span></li>
<li class="alt"><span></filesmatch> </span></li>
<li><span> </span></li>
<li class="alt"><span># 3 HOUR </span></li>
<li><span><filesmatch \.(txt|xml|js|css)$=<span class="string">""</span></li>
<li class="alt"><span>Header set Cache-Control <span class="string">"max-age=10800"</span></li>
<li><span></filesmatch> </span></li>
<li class="alt"><span> </span></li>
<li><span># NEVER CACHE </span></li>
<li class="alt"><span><filesmatch \.(html|htm|php|cgi|pl)$=<span class="string">""</span></li>
<li><span>Header set Cache-Control <span class="string">"max-age=0, private, no-store, no-cache, must-revalidate"</span></li>
<li class="alt"><span></filesmatch></span></li>
</ol>

Cache com o mod_expires:

<ol class="dp-css">
<li class="alt"><span><span>ExpiresActive On </span></span></li>
<li><span>ExpiresDefault A0 </span></li>
<li class="alt"><span> </span></li>
<li><span># 1 YEAR </span></li>
<li class="alt"><span><filesmatch \.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav)$=<span class="string">""</span><span>> </span></span></li>
<li><span>ExpiresDefault A9030400 </span></li>
<li class="alt"><span></filesmatch> </span></li>
<li><span> </span></li>
<li class="alt"><span># 1 WEEK </span></li>
<li><span><filesmatch \.(jpg|jpeg|png|gif|swf)$=<span class="string">""</span><span>> </span></span></li>
<li class="alt"><span>ExpiresDefault A604800 </span></li>
<li><span></filesmatch> </span></li>
<li class="alt"><span> </span></li>
<li><span># 3 HOUR </span></li>
<li class="alt"><span><filesmatch \.(txt|xml|js|css)$=<span class="string">""</span><span>> </span></span></li>
<li><span>ExpiresDefault A10800" </span></li>
<li class="alt"><span></filesmatch>
</span></li>
</ol>

10. Cache os RSS Feeds

Really Simple Sindication ou RSS, como é conhecido, é uma tecnologia que possibilita aos webmasters distribuírem facilmente o seu novo conteúdo. Uma vez o RSS Feed esteja em cache no seu disco local, não o vai descarregar novamente até que este esteja expirado, evitando assim que estejamos a carregar todo o RSS feed sempre que este é pedido. Deste modo poupamos imensa banda no nosso alojamento.

Se queremos poupar a largura de banda do nosso alojamento e evitar efectuar uma actualização, ou pior ainda, procurar um novo alojamento, será uma boa ideia perder um pouco de tempo a optimizar o nosso site ou blogue, porque mesmo que se faça uma actualização provavelmente teremos o mesmo problema passado algum tempo. Além disso, quanto mais pesado é o nosso site ou blogue, mais tempo o demora o carregamento e como todos sabemos, os internautas não gostam de esperar pelo conteúdo.
Espero que este tutorial seja muito útil, e é claro, se tiverem mais alguma dica relevante sobre este assunto, não hesitem em partilhá-la nos comentários.

{ 3 trackbacks }

atalhovirtual.com
25 Abr 2009 às 16:52
Pict.com – Serviço grátis para alojamento de imagens - Xigli
03 Set 2009 às 1:36
Alojamento de imagens Grátis - Xigli
23 Set 2009 às 1:10

{ 2 Comentários… read them below or adicione um }

Diogo 24 Jan 2010 às 18:45

Eu uso blogger, ai como faço esse negócio de cache. Copio o código dentro do do meu código html???
.-= Último artigo de Diogo > A maior barriga de Curitiba. Resposta ao maior trapézio… =-.

Responder

steve@learning web design 19 Mai 2010 às 3:02

thanks

Responder

Deixe um comentário

Artigo anterior:

Próximo artigo: