Configure o cache em seu site para carregar mais rápido

Neste post iremos abordar sobre um dos métodos mais eficazes, que deixa o seu site carregar mais rápido, dessa forma diminui a desistência de seus visitantes e aumenta a sua posição no rank do Google.

Qual a função do cache?

Quando você acessa um site, o seu navegador baixa todo o conteúdo do servidor onde o site se encontra armazenado, assim como códigos html, css, javascript que compõem a estrutura, fotos, vídeos e textos.

Após a página ter carregado e baixado todo o conteúdo, se o site tiver configurado o armazenamento de cache, parte das informações são salvas no navegador, portanto se você entrar no site novamente, ele irá carregar mais rápido do que na primeira vez, porque o navegador não precisará baixar tudo novamente do servidor.

Então resumindo, configurar o armazenamento do cache no navegador é essencial na atualidade, onde tudo precisa ser carregado instantaneamente, caso demore, você poderá perder visitas em seu site.

Como configuro o cache no meu site

Se você utiliza o CMS do WordPress, é simples, basta baixar um plugin, realizar algumas configurações básicas e pronto, seu site já vai estar com uma velocidade de carregamento melhor do que estava antes.

O plugin que recomendamos é o WP Fastest Cache, fizemos um post explicando o passo a passo de como configurar-lo, confira clicando aqui.

Não utilizo o WordPress e agora?

Não se preocupe, você pode configurar em qualquer site, caso o seu seja hospedado em um servidor Linux, procure por um arquivo oculto que se chama .htaccess, abra-o e insira o código abaixo:

#Força a utilizar Cache-Control e Expires header

<IfModule mod_headers.c>

Header unset ETag

</IfModule>

FileETag None

<IfModule mod_expires.c>

ExpiresActive on

ExpiresDefault "access plus 1 month"

ExpiresByType text/cache-manifest "access plus 0 seconds"

# Html

ExpiresByType text/html "access plus 0 seconds"

# Data

ExpiresByType text/xml "access plus 0 seconds"

ExpiresByType application/xml "access plus 0 seconds"

ExpiresByType application/json "access plus 0 seconds"

# Feed

ExpiresByType application/rss+xml "access plus 1 hour"

ExpiresByType application/atom+xml "access plus 1 hour"

# Favicon

ExpiresByType image/x-icon "access plus 1 week"

# Media: images, video, audio

ExpiresByType image/gif "access plus 1 month"

ExpiresByType image/png "access plus 1 month"

ExpiresByType image/jpg "access plus 1 month"

ExpiresByType image/jpeg "access plus 1 month"

ExpiresByType video/ogg "access plus 1 month"

ExpiresByType audio/ogg "access plus 1 month"

ExpiresByType video/mp4 "access plus 1 month"

ExpiresByType video/webm "access plus 1 month"

# HTC files

ExpiresByType text/x-component "access plus 1 month"

# Webfonts

ExpiresByType application/x-font-ttf "access plus 1 month"

ExpiresByType font/opentype "access plus 1 month"

ExpiresByType application/x-font-woff "access plus 1 month"

ExpiresByType image/svg+xml "access plus 1 month"

ExpiresByType application/vnd.ms-fontobject "access plus 1 month"

# CSS / JS

ExpiresByType text/css "access plus 1 year"

ExpiresByType application/javascript "access plus 1 year"

ExpiresByType application/x-javascript  "access plus 1 year"

</IfModule>

#Força o IE a sempre carregar utilizando a última versão disponível

<IfModule mod_headers.c>

Header set X-UA-Compatible "IE=Edge,chrome=1"

<FilesMatch "\.(js|css|gif|png|jpeg|pdf|xml|oga|ogg|m4a|ogv|mp4|m4v|webm|svg|svgz|eot|ttf|otf|woff|ico|webp|appcache|manifest|htc|crx|oex|xpi|safariextz|vcf)$" >

Header unset X-UA-Compatible

</FilesMatch>

</IfModule>

<BlobCache location="C:\blobCache" path="\.(gif|jpg|png|css|js)$" maxSize="10" enabled="true"/>