Compressão Gzip aceleração de site js/css/html - como habilitar em .htaccess

impressão · Время на чтение: 9mínimo · por · Publicados · Atualizada

reproduzirOuça o artigo

Compressão gzip js css html.Saudações, queridos leitores! Hoje vamos falar sobre compactação gzip js | css | htmlpara acelerar o carregamento do site. Como habilitá-lo com arquivo .htaccess. Também direi por que você precisa ativar a compactação de arquivos no lado do servidor.

Este tópico está diretamente relacionado com a técnica otimização de sites. Ao permitir manipulações bastante simples, significativamente acelerar o carregamento do site. Um site rápido é um sucesso significativo na promoção do mecanismo de pesquisa.

Qual é o propósito de ativar a compactação de arquivo Gzip em .htaccess?

Como ativar a compactação Gzip de páginas no site.

Como já disse em muitos dos meus artigos! O site no estágio inicial tem um peso bastante grande. E aqueles. otimização é necessária para reduzir o peso do nosso site. De qualquer forma, precisamos reduzir a quantidade de código, o peso das páginas, imagens e outras coisas. A tarefa geral é fornecer ao usuário uma versão leve e rápida do site.
Assim, damos informações rapidamente. A transição entre páginas e seções ocorre em uma fração de segundo. Ao mesmo tempo, os visitantes verão rapidamente todos os elementos de design carregados e outros elementos interativos de interação.

Compactação GZIP - fornece arquivamento ininterrupto de arquivos transferidos. Assim, obtemos compressão sem perdas da qualidade da fonte. Todos os dados voltam ao seu estado original após a descompactação já no navegador do usuário. A implementação em si se deve a vários algoritmos de trabalho. Estes incluem DEFLATE básico usando LZ77 e Huffman.

Obviamente, esse tipo de compressão (compressão) não é uma solução ideal. Mas a implementação do Gzip nos leva a um equilíbrio entre velocidade e taxa de compressão. Este método é o mais popular entre outras formas de acelerar o site. Além disso, a implementação de um método mais global no servidor levará muito tempo e testes. E pode não dar o resultado desejado! A compactação Gzip a esse respeito é a maneira mais confiável de acelerar os downloads de arquivos.

Compactação Gzip - para quais arquivos é aceitável? Em quais servidores ele funciona?

Na verdade, a compactação gzip cobre uma grande lista de arquivos. Mas tem uma pequena desvantagem! Quando um usuário visita um site, o servidor precisa compactar uma grande quantidade de dados em tempo real. Isso leva a uma certa carga no servidor. Mas não é crítico na maioria dos casos. Todos os formatos de arquivo suportados após a transferência são exibidos perfeitamente em navegadores populares.

Os principais incluem:

  • texto/texto simples/html;
  • texto/aplicativo xml/aplicativo xml/aplicativo xhtml+xml/xml-dtd;
  • aplicativo/rdf+xml aplicativo/rss+xml aplicativo/atom+xml imagem/svg+xml;
  • texto/css texto/aplicativo javascript/aplicativo javascript/x-javascript;
  • fonte/aplicativo opentype/aplicativo fonte-otf/x-font-otf;
  • fonte/aplicativo truetype/aplicativo fonte-ttf/x-font-ttf.
A compactação de arquivo Gzip é usada nos principais servidores Apache e Nginx. Com módulos de trabalho válidos e recursos de servidor.

Por exemplo: Nginx - usado para estático. Ele comprime e processa bem os arquivos estáticos. A compactação ocorre graças aos módulos ngx_http_gzip_module e ngx_http_gzip_static_module. A compressão on-the-fly ininterrupta é realizada com a substituição da extensão principal por “.gz”.

Exemplo de uma configuração padrão:

gzip em;
gzip_min_length 1000;
gzip_types texto/aplicativo simples/xml;

Apache é o servidor mais requisitado. Obviamente, a compactação será mais ambiciosa e personalizável. A compactação Gzip neste servidor é feita usando o módulo mod_deflate. Ao fornecer compactação em tempo real antes de ser enviado ao navegador do usuário.

Exemplo de uma configuração padrão:

# Ativar GZIP - ativar compactação
AddOutputFilterByType DEFLATE texto/simples
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE aplicativo/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE aplicativo/javascript
AddOutputFilterByType DEFLATE application/x-javascript

# Compressão com um algoritmo lento para reduzir a carga no servidor.

RewriteEngine On
AddEncoding gzip .gz
RewriteCond %{HTTP:Aceitar codificação} gzip
RewriteCond %{REQUEST_FILENAME}.gz -f
RewriteRule ^(.*)$ $1.gz [QSA,L]

PHP é uma opção menos popular. Mas também tem a capacidade de organizar a compactação usando o módulo zlib. Este método não é recomendado, pois é extremamente lento.

Exemplo de uma configuração padrão:

1TP29OriginalFile = __DIR__ . '/jquery-1.11.0.min.js';
$gzipFile = __DIR__ . '/jquery-1.11.0.min.js.gz';

1TP29OriginalData = file_get_contents(1TP29OriginalFile);

$gzipData = gzencode($originalData, 9);
file_put_contents($gzipFile, $gzipData);

var_dump(filesize($originalFile)); // int(96380)
var_dump(filesize($gzipFile)); // int(33305)

Obviamente, o uso de servidores Apache + Nginx + PHP também é possível em conjunto. Assim, uma certa distribuição de carga entre os servidores será fornecida. Mas esta é uma tarefa muito difícil, que não deve ser realizada por usuários comuns.

Eu mesmo configurei meu servidor, usando todas as principais vantagens do Apache/Nginx/PHP. Assim, o Nginx lida com o estático, o Apache lida com o resto com PHP. O resultado é muito positivo. Mas muito tempo foi gasto na organização desse método.

Como ativar a compactação Gzip no arquivo .htaccess

Na verdade, não é difícil fazer isso. Além disso, já falei sobre esse arquivo.

As regras básicas permanecem as mesmas:

  1. Certifique-se de salvar o arquivo .htaccess original antes de editar. Em caso de erro 500, haverá algo para restaurar.
  2. Não deve haver lacunas entre as linhas.
  3. Escrevemos todos os comentários após o sinal #.
  4. Certifique-se de verificar a integridade do código após a inserção.

Vários exemplos de configuração de regras .htaccess padrão já foram mencionados acima. Mas, na minha opinião, isso não é suficiente, então darei meu próprio exemplo. Este conjunto de regras funciona neste site, como você pode ver, não há problemas.

Ao mesmo tempo, a compressão ocorre em tempo real, o site carrega rapidamente sem freios. Tudo o que você precisa fazer é colar este código em seu arquivo .htaccess. Se você tem seu próprio servidor, acho que sabe tudo sozinho.

Para o público principal, instruções de uso:

  1. Vamos para o servidor com qualquer cliente ftp popular;
  2. Vá para a raiz do site (diretório);
  3. O arquivo .htaccess está localizado no diretório principal do site;
  4. Abrimos com um editor de texto, em geral o Sublime Text 3 é melhor;
  5. A seguir, bem no final do arquivo, cole o código que será mostrado abaixo.
  6. Pedimos gentilmente que verifique o código, pois o site possui proteção contra cópia (pode haver um link para o site no final do código).

# Ativar GZIP
ifmodule mod_deflate.c deve ser colocado entre colchetes “<>”
AddOutputFilterByType DEFLATE texto/simples
AddOutputFilterByType DEFLATE texto/texto
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE texto/simples
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE image/gif
AddOutputFilterByType DEFLATE image/jpeg
AddOutputFilterByType DEFLATE image/jpg
AddOutputFilterByType DEFLATE image/png
AddOutputFilterByType DEFLATE image/gif
AddOutputFilterByType DEFLATE image/flv
AddOutputFilterByType DEFLATE image/ico
AddOutputFilterByType DEFLATE image/swf
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE aplicativo/xml
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE aplicativo/javascript
AddOutputFilterByType DEFLATE application/json
AddOutputFilterByType DEFLATE video/3gpp
AddOutputFilterByType DEFLATE video/3gpp2
AddOutputFilterByType DEFLATE video/x-flv
AddOutputFilterByType DEFLATE video/jpm
AddOutputFilterByType DEFLATE video/jpeg
AddOutputFilterByType DEFLATE video/x-m4v
AddOutputFilterByType DEFLATE video/mp4
AddOutputFilterByType DEFLATE video/ogg
AddOutputFilterByType DEFLATE video/webm
AddOutputFilterByType DEFLATE video/quicktime
AddOutputFilterByType DEFLATE audio/x-mpegurl
AddOutputFilterByType DEFLATE áudio/midi
AddOutputFilterByType DEFLATE áudio/mp3
AddOutputFilterByType DEFLATE audio/mp4
AddOutputFilterByType DEFLATE áudio/mpeg
AddOutputFilterByType DEFLATE audio/webm
AddOutputFilterByType DEFLATE áudio/básico
AddOutputFilterByType DEFLATE audio/x-wav
AddOutputFilterByType DEFLATE áudio/wav
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4.0[678] no-gzip
BrowserMatch bMSIE !no-gzip !gzip-only-text/html
ifmodule mod_gzip.c deve ser colocado entre colchetes “<>”
mod_gzip_on Sim
arquivo mod_gzip_item_include \.js$
arquivo mod_gzip_item_include \.css$
/ifmodule deve ser colocado entre colchetes “<>”
/ifmodule deve ser colocado entre colchetes “<>”

Se você não colocar os elementos obrigatórios entre parênteses, receberá um erro. Seu site simplesmente parará de funcionar e exibirá um erro 500 interno do servidor. O texto “deve ser colocado entre colchetes “<>”” também deve ser removido do código. Depois disso, o arquivo .htaccess precisa ser salvo.

Também é uma boa ideia reiniciar o servidor para aplicar exatamente as novas regras. Depois de todas essas ações, seu site funcionará muito mais rápido. A velocidade de carregamento da página aumentará significativamente.

Verifique a velocidade de carregamento do site e a compactação Gzip

Depois de habilitarmos a compactação do lado do servidor. Você pode conferir o sucesso do trabalho realizado! Você pode fazer isso com várias ferramentas online populares. Vamos dar uma olhada neles:

Informações de velocidade de página - a principal e mais popular ferramenta online para checar o site. Após as últimas alterações em 2018 pelo Google. Fornece uma extensa lista de dados para uma análise detalhada do site.

Saiba mais sobre o PageSpeed ​​Insights.

O que pode:

  1. Classificação geral da velocidade do site;
  2. Especifica o tempo de carregamento do conteúdo;
  3. Índice geral de velocidade e tempo de interação;
  4. Dá recomendações para otimização;
  5. Mostra informações detalhadas de desempenho;
  6. Indica se a compactação Gzip está habilitada ou não;
  7. Indica se o hash está habilitado ou não;
  8. Fornece uma riqueza de informações para correção de erros.

O PageSpeed ajudará você a corrigir muitos problemas de velocidade do site. Graças a esta ferramenta, muitos erros do meu site foram corrigidos.

Ferramentas Pingdom também é uma das ferramentas populares de análise de sites online. Fornece informações detalhadas suficientes sobre uma variedade de critérios de avaliação do site. É fácil descobrir o que está atrasando o download.

o que é ferramenta pingdom?

O que vai te dar:

  1. Avaliação do desempenho geral do site;
  2. O número de solicitações ao banco de dados do site;
  3. Velocidade de carregamento da página;
  4. Tamanho do conteúdo por tipo de conteúdo;
  5. Respostas do servidor 200/301/302/404/503 e outras;
  6. Consultas gerais por domínios;
  7. Representação gráfica da situação, etc.;

Fornece muitas informações sobre a velocidade do site. Mas não dá instruções detalhadas como o Google.

Plug-ins de compactação GZIP para WordPress

Por mais estranho que pareça, os donos de sites no WordPress CMS não precisam se preocupar muito. A razão para isso é a variedade de plugins para habilitar a compressão no site. Tudo o que você precisa fazer é instalar o plug-in de sua preferência. Em seguida, ative e ative a compactação nas configurações do plug-in. Então ele fará todo o trabalho para você. Descreverei alguns dos mais populares.

PageSpeed Ninja é o plugin de melhor desempenho para WordPress. Você pode tornar seus sites mais rápidos em computadores e dispositivos móveis corrigindo problemas encontrados pelo Google PageSpeed Insights em um clique. Permite ativar rapidamente a compactação no site.

Aumente sua pontuação do Google PageSpeed ​​no Wordpress.

WP cache mais rápido também é um dos plugins de hashing mais populares. Possui um grande número de configurações agrupadas, uma das quais inclui compactação.

WP Fastest Cache - Plugin para WordPress.

Cache do Cometa Eu mesmo uso este plugin. Já que em combinação com outros plugins, dá um excelente resultado. Além disso, uma de suas configurações inclui compactação gzip.

Comet Cache cria um cache de cada página.

Em geral, todos os principais plug-ins de cache para Wordpress permitem ativar a compactação GZIP no site. Eu recomendo plug-ins multifuncionais completos para carga mínima.

Concluindo, direi o seguinte: certifique-se de ativar a compactação. Isso terá um efeito muito bom no desempenho e aumentará o site na pesquisa. Espero que este artigo o ajude com isso.

Obrigado por ler Nicola Top

Quão útil é o post?

Clique no smiley para avaliar!

classificação média 5 / 5. Número de avaliações: 52

Não há avaliações ainda. Avalie primeiro.

Você pode gostar...

1 Resposta

  1. Илья diz:

    Imediatamente copiei e colei o código, o que causou um erro 500. Agora entendo o que preciso ler com atenção. Vejo que você também tem proteção contra cópia. E graças ao conteúdo é adequado e funcionando.

Deixe uma resposta

O seu endereço de email não será publicado. Campos obrigatórios marcados com *

19 − dezoito =