Nginx'te Gzip ve Browser Leverage Caching

Bu yazıyı biraz da kendimin unutmaması için yazıyorum. Bildiğiniz üzere, arama motoru optimizasyonunda sitenizin hızlı olması büyük bir öneme sahip ve unutmanızın cezası büyük.

Tabii ki bu ayarları kafanıza göre yapmanız çok yanlış bir yaklaşım olacağı için HTML5 Boilerplate organizasyonunun hazırlamış olduğu ayarlardan faydalanacağız. Bu ayarlardan Gzip ile ilgili olanlar alttaki gibi, ayrıca kaydetmeniz gereken dosya da /etc/nginx/nginx.conf.

Her bir ayarı kısmen yorumlarda açıklamaya çalıştım, daha doğrusu İngilizceden Türkçeye çevirdim.

Bu ayarları kaydedeceğiniz dosya ise /etc/nginx/nginx.conf.
# Gzip'i sunucuzda aktif hale getirin.
gzip on;

# Sıkıştırma seviyesi (1-9).
# 5, CPU ve boyut için ideal sıkıştırma seviyesidir.
# Birçok ASCII dosyası için yaklaşık %75 sıkıştırma oranı sağlar.
# Neredeyse seviye 9 ile aynıdır.

gzip_comp_level    5;
# Sıkıştırınca küçülmeyecek kadar olan düşük boyutlu dosyaları sıkıştırmanıza gerek yok.
# Dolayısıyla, minimum boyutu 256 byte yapmak yeterli.

gzip_min_length    256;

# Via headerı ile referans edilen, proxy ile bağlanan kullanıcılar için de veriyi sıkıştırın.
gzip_proxied       any;

# Proxy'lere kaynağın hem gzip'li halini, hem de kendisini önbelleğe(cache) almasını belirtin.
# Böylece gzip'i desteklemeyen clientlara da önbellekten sunabilin.
gzip_vary          on;

# Alttaki MIME'lere sahip olan tüm çıktıları sıkıştırın.
gzip_types
    application/atom+xml
    application/javascript
    application/json
    application/ld+json
    application/manifest+json
    application/rss+xml
    application/vnd.geo+json
    application/vnd.ms-fontobject
    application/x-font-ttf
    application/x-web-app-manifest+json
    application/xhtml+xml
    application/xml
    font/opentype
    image/bmp
    image/svg+xml
    image/x-icon
    text/cache-manifest
    text/css
    text/plain
    text/vcard
    text/vnd.rim.location.xloc
    text/vtt
    text/x-component
    text/x-cross-domain-policy;
    # text/html her zaman gzip modülü tarafından sıkıştırılır, o yüzden eklemenize gerek yok
Bunun yanında bir de MIME'leri güncellemeniz lazım, bulunduğu dosya da, /etc/nginx/mime.types
types {

    # Veri Alışverişi

    application/atom+xml                  atom;
    application/json                      json map topojson;
    application/ld+json                   jsonld;
    application/rss+xml                   rss;
    application/vnd.geo+json              geojson;
    application/xml                       rdf xml;

    # JavaScript
application/javascript js; # Manifesto dosyaları
application/manifest+json webmanifest; application/x-web-app-manifest+json webapp; text/cache-manifest appcache; # Medya Dosyaları audio/midi mid midi kar; audio/mp4 aac f4a f4b m4a; audio/mpeg mp3; audio/ogg oga ogg opus; audio/x-realaudio ra; audio/x-wav wav; image/bmp bmp; image/gif gif; image/jpeg jpeg jpg; image/png png; image/svg+xml svg svgz; image/tiff tif tiff; image/vnd.wap.wbmp wbmp; image/webp webp; image/x-jng jng; video/3gpp 3gp 3gpp; video/mp4 f4p f4v m4v mp4; video/mpeg mpeg mpg; video/ogg ogv; video/quicktime mov; video/webm webm; video/x-flv flv; video/x-mng mng; video/x-ms-asf asf asx; video/x-ms-wmv wmv; video/x-msvideo avi; image/x-icon cur ico; # Microsoft Office application/msword doc; application/vnd.ms-excel xls; application/vnd.ms-powerpoint ppt; application/vnd.openxmlformats-officedocument.wordprocessingml.document docx; application/vnd.openxmlformats-officedocument.spreadsheetml.sheet xlsx; application/vnd.openxmlformats-officedocument.presentationml.presentation pptx; # Fontlar application/font-woff woff; application/font-woff2 woff2; application/vnd.ms-fontobject eot; application/x-font-ttf ttc ttf; font/opentype otf; # Diğer application/java-archive ear jar war; application/mac-binhex40 hqx; application/octet-stream bin deb dll dmg exe img iso msi msm msp safariextz; application/pdf pdf; application/postscript ai eps ps; application/rtf rtf; application/vnd.google-earth.kml+xml kml; application/vnd.google-earth.kmz kmz; application/vnd.wap.wmlc wmlc; application/x-7z-compressed 7z; application/x-bb-appworld bbaw; application/x-bittorrent torrent; application/x-chrome-extension crx; application/x-cocoa cco; application/x-java-archive-diff jardiff; application/x-java-jnlp-file jnlp; application/x-makeself run; application/x-opera-extension oex; application/x-perl pl pm; application/x-pilot pdb prc; application/x-rar-compressed rar; application/x-redhat-package-manager rpm; application/x-sea sea; application/x-shockwave-flash swf; application/x-stuffit sit; application/x-tcl tcl tk; application/x-x509-ca-cert crt der pem; application/x-xpinstall xpi; application/xhtml+xml xhtml; application/xslt+xml xsl; application/zip zip; text/css css; text/html htm html shtml; text/mathml mml; text/plain txt; text/vcard vcard vcf; text/vnd.rim.location.xloc xloc; text/vnd.sun.j2me.app-descriptor jad; text/vnd.wap.wml wml; text/vtt vtt; text/x-component htc; }
Browser Leverage Caching(Türkçesi hakkında fikrim yok) için de, /etc/nginx/sites-available/default dosyasında, server bloğunun içinde, alttaki kısımları eklemeniz lazım. Dosyaları değiştirme sürenize göre, bunları düzenleyebilirsiniz.
location ~* \.(png|jpg|jpeg|gif|svg)$ {
    expires 30d; # 30 gün, 1 yıl yapmak için 365d (365 gün)
}

location ~* \.(js|css|ico)$ {
    expires 3h; # 3 saat, kısacası bir değişiklik yaparsanız, maksimum 3 saat içerisinde görünebilir hale gelir
}
Son olarak, tüm bu değişikliklerin geçerli olması için de, nginx'i tekrar başlatmayı unutmayın.
$ sudo service nginx restart
Son olarak da test etmek için https://redbot.org/ adresini kullabilirsiniz.