Seperti janji saya pada postingan sebelumnya Tips Menghemat Quota Bandwidth, maka kali ini kita akan membahas HTTP Compression untuk mempercepat loading wordpress sekaligus untuk menghemat quota atau jatah bandwidth. Untuk para master mohon masukannya, kalau ada yang salah.
Saat ini terdapat dua macam metode kompresi HTTP yang umum digunakan, yaitu mod_deflate dan mod_gzip.
Keduanya bekerja pada server apache. Dibandingkan dengan mod_deflate,
mod_gzip memberikan rasio kompresi HTTP yang lebih besar. Artinya mod_gzip lebih baik daripada mod_deflate.
Keduanya bekerja pada server apache. Dibandingkan dengan mod_deflate,
mod_gzip memberikan rasio kompresi HTTP yang lebih besar. Artinya mod_gzip lebih baik daripada mod_deflate.
Beberapa penyedia jasa web hosting terutama yang gratisan malah sudah mengaktifkan mod_gzip secara otomatis pada server apache-nya. Mod_gzip
mengirit bandwidth dengan cara mengkompresi bodi respon HTTP sebelum
dikirimkan ke klien/browser. Rata-rata browser modern sudah dapat
membaca respon yang terkompresi. Karena perbandingan jumlah request teks
(HTML, txt, js, css) dan gambar (gif, jpg, swf) untuk sebuah situs
tipikal adalah 1:1 hingga 1:3, dan gzip dapat
mengkompresi teks hingga 50%-80%, maka pengiritan trafik outgoing web
yang diperoleh rata-rata bisa berkisar antara 10%–35%. Dan pengiritan
total bandwidth yang diperoleh antara 4%–15%. Jumlah yang lumayan.
Sebenarnya kita bisa memasang mod_gzip
pada Apache server tempat kita hosting, yaitu dengan cara membuat
sebuah source code kemudian kita install di apache. Tapi untuk cara ini
tidak akan dibahas di sini, karena saya sendiri belum cukup mahir
tentang setting apache, takut malah eror heeee……
Syarat-syarat
untuk dapat menggunakan metode kompresi HTTP di atas adalah browser dan server harus mendukung. Khusus untuk mod_gzip, PHP yang digunakan harus versi 4.0.6 hingga terbaru. Untuk dapat mengetahui versi PHP pada server yang kita gunakan, buatlah sebuah file php (contoh: info.php), kemudian ketikkan kode berikut:
untuk dapat menggunakan metode kompresi HTTP di atas adalah browser dan server harus mendukung. Khusus untuk mod_gzip, PHP yang digunakan harus versi 4.0.6 hingga terbaru. Untuk dapat mengetahui versi PHP pada server yang kita gunakan, buatlah sebuah file php (contoh: info.php), kemudian ketikkan kode berikut:
<?php phpinfo (); ?>
Kemudian simpan dan uploadlah file
tersebut ke root direktori wordpress. Kemudian buka file tersebut
melalui browser yang kita gunakan. Contoh: http://nama-domain.com/info.php
Di situ akan terlihat informasi lengkap PHP yang ada di server. Kita bisa mencari fitur-fitur yang terintegrasi di dalamnya. Kompresi menggunakan mod_deflate :
Caranya adalah, dengan menambahkan kode berikut pada file .htaccess di
direktori root domain kita. # compress text, html, javascript, css, xml:
AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE
text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType
DEFLATE text/css AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType
DEFLATE application/javascript AddOutputFilterByType DEFLATE
application/x-javascript
# atau kompress berdasarkan ekstensi file: <files *.html *.php *.css> SetOutputFilter DEFLATE </files>
Kompresi menggunakan mod_gzip :
Caranya adalah dengan menambahkan kode berikut:
<?php ob_start( 'ob_gzhandler' ); ?>
atau
<?php
if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')) {
ob_start("ob_gzhandler");
}
else {
ob_start();
}
?>
Tambahkan kode tersebut di bagian paling atas header.php. Contoh:
<?php
if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')
{ob_start("ob_gzhandler");}
else {ob_start();}
?>
<!-- bagian paling atas header.php -->
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
</html>
Jika theme wordpress kita memakai template halaman (page template), maka tidak direkomendasikan untuk menyisipkan kode mod_gzip di bagian header.php. Karena akan merusak kompresi. Caranya adalah dengan menyisipkan kode mod_gzip tersebut pada file index.php, single.php, page.php, archive.php, 404.php, dan search.php, dan jangan sisipkan pada header.php. Contohnya:
<?php
if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')) {
ob_start("ob_gzhandler");
}
else {
ob_start();
}
?>
<!-- Bagian atas file single.php --><?php get_header(); ?>
Jika kita memakai template halaman, maka kode mod_gzip disisipkan dengan cara sebagai berikut:<?php
if (substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')) {
ob_start("ob_gzhandler");
}
else {
ob_start();
}
/*Template Name: Nama Template halaman*/?>
Jika cara di atas tidak berfungsi silahkan kombinasikan dengan plugin wp super cache yang bisa di download di sini. Kemudian upload dan aktifkan. Pastikan dalam file
.htaccess yang ada di root direktori terdapat kode ini :# BEGIN WPSuperCache
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
AddDefaultCharset UTF-8
RewriteCond %{REQUEST_METHOD} !POST
RewriteCond %{QUERY_STRING} !.*=.*
RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress|wp-postpass_).*$
RewriteCond %{HTTP_USER_AGENT} !^.*(Android|2.0 MMP|240x320|AvantGo|BlackBerry|Blazer|Cellphone|Danger|DoCoMo|Elaine/3.0|EudoraWeb|hiptop|IEMobile|iPhone|iPod|KYOCERA/WX310K|LG/U990|MIDP-2.0|MMEF20|MOT-V|NetFront|Newt|Nintendo Wii|Nitro|Nokia|Opera Mini|Palm|Playstation Portable|portalmmm|Proxinet|ProxiNet|SHARP-TQ-GX10|Small|SonyEricsson|Symbian OS|SymbianOS|TS21i-10|UP.Browser|UP.Link|Windows CE|WinWAP).*
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{DOCUMENT_ROOT}/wp-content/cache/supercache/%{HTTP_HOST}/$1/index.html.gz -f
RewriteRule ^(.*) /wp-content/cache/supercache/%{HTTP_HOST}/$1/index.html.gz [L]
RewriteCond %{REQUEST_METHOD} !POST
RewriteCond %{QUERY_STRING} !.*=.*
RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress|wp-postpass_).*$
RewriteCond %{HTTP_USER_AGENT} !^.*(Android|2.0 MMP|240x320|AvantGo|BlackBerry|Blazer|Cellphone|Danger|DoCoMo|Elaine/3.0|EudoraWeb|hiptop|IEMobile|iPhone|iPod|KYOCERA/WX310K|LG/U990|MIDP-2.0|MMEF20|MOT-V|NetFront|Newt|Nintendo Wii|Nitro|Nokia|Opera Mini|Palm|Playstation Portable|portalmmm|Proxinet|ProxiNet|SHARP-TQ-GX10|Small|SonyEricsson|Symbian OS|SymbianOS|TS21i-10|UP.Browser|UP.Link|Windows CE|WinWAP).*
RewriteCond %{DOCUMENT_ROOT}/wp-content/cache/supercache/%{HTTP_HOST}/$1/index.html -f
RewriteRule ^(.*) /wp-content/cache/supercache/%{HTTP_HOST}/$1/index.html [L]
</IfModule>
# END WPSuperCache
Dan pastikan juga dalam file .htaccess yang ada di folder /wp-content/cache terdapat kode ini :# BEGIN supercache <IfModule mod_mime.c> <FilesMatch ".html.gz$"> ForceType text/html FileETag None </FilesMatch> AddEncoding gzip .gz AddType text/html .gz </IfModule> <IfModule mod_deflate.c> SetEnvIfNoCase Request_URI .gz$ no-gzip </IfModule> <IfModule mod_headers.c> Header set Vary "Accept-Encoding, Cookie" Header set Cache-Control 'max-age=300, must-revalidate' </IfModule> <IfModule mod_expires.c> ExpiresActive On ExpiresByType text/html A300 </IfModule> # END supercache
Kebetulan saya memakai cara yang terakhir yaitu menggunakan plugin wp super cache dan menyisipkan kode mod_gzip pada file index.php, single.php, page.php, archive.php, 404.php, dan search.php,
dan alhamdulillah bisa berfungsi. Rata-rata halaman blog ini
terkompress antara 70-80%. Di samping itu karena sudah terkompres
ternyata cukup signifikan terhadap kecepatan loading blog ini. Untuk
mengetahui apakah halaman web/blog kita sudah terkompress atau belum
silahkan kunjungi situs ini online gzip test atau http_compression test.
dan alhamdulillah bisa berfungsi. Rata-rata halaman blog ini
terkompress antara 70-80%. Di samping itu karena sudah terkompres
ternyata cukup signifikan terhadap kecepatan loading blog ini. Untuk
mengetahui apakah halaman web/blog kita sudah terkompress atau belum
silahkan kunjungi situs ini online gzip test atau http_compression test.
Buat sobat-sobat yang punya cara lain tentang HTTP Compression monggo silahkan dishare disini biar kita bisa belajar bersama.
Artikel Terkait:
Previous Article
Post a Comment