Cara Mengaktifkan Expires Header Melalui File .htaccess

Kecepatan website menjadi salah satu faktor penting yang memengaruhi user experience maupun performa SEO di mesin pencari. Salah satu teknik optimasi yang sering digunakan untuk meningkatkan kecepatan website adalah mengaktifkan browser caching menggunakan expires header.

Dengan pengaturan ini, file statis seperti gambar, CSS, dan JavaScript dapat disimpan sementara di browser pengunjung sehingga tidak perlu dimuat ulang setiap kali halaman dibuka. Akibatnya, proses loading website menjadi lebih cepat dan beban server dapat berkurang.

Dalam artikel ini, kami akan membahas pengertian expires header, manfaatnya untuk performa website, serta cara setting expires header melalui file .htaccess di server Apache.

Apa Itu Expires Header?

Expires header adalah bagian dari HTTP header yang digunakan untuk menentukan berapa lama sebuah file dapat disimpan (cache) di browser pengunjung sebelum diminta kembali ke server.

Ketika expires header diaktifkan, browser akan menyimpan file statis seperti:

• gambar (JPG, PNG, GIF)
• stylesheet CSS
• file JavaScript
• font web

Selama masa cache tersebut masih berlaku, browser tidak perlu mengunduh ulang file yang sama dari server. Hal ini membuat proses pemuatan halaman menjadi lebih cepat.

Mengapa Expires Header Penting untuk Performa Website?

Penggunaan expires header memiliki beberapa manfaat penting bagi performa website, di antaranya:

1. Mempercepat Loading Website: Browser tidak perlu mengunduh ulang file statis setiap kali pengunjung membuka halaman.
2. Mengurangi Beban Server: Karena file sudah tersimpan di browser, jumlah request ke server akan berkurang.
3. Menghemat Bandwidth Hosting: Permintaan data yang lebih sedikit membantu menghemat penggunaan bandwidth.
4. Meningkatkan Skor PageSpeed: Tools seperti Google PageSpeed Insights atau GTmetrix sering merekomendasikan penggunaan browser caching untuk meningkatkan performa website.

Apa Itu mod_expires pada Apache?

Untuk mengatur expires header pada server Apache, biasanya digunakan modul bernama mod_expires. Modul ini berfungsi untuk mengatur waktu cache file, menentukan jenis file yang akan di cache, hingga menetapkan masa berlaku cache

Pengaturan mod_expires biasanya dilakukan melalui file konfigurasi server atau melalui file .htaccess.

Jenis File yang Biasanya Menggunakan Expires Header

Tidak semua file website perlu menggunakan expires header. Umumnya, expires header digunakan untuk file statis yang jarang berubah.

File Gambar

Contoh format:

• JPG
• JPEG
• PNG
• GIF
• WebP
• SVG

Biasanya diberi masa cache yang cukup lama karena jarang berubah.

File CSS

File CSS mengatur tampilan website. Biasanya dapat dicache selama beberapa minggu hingga satu bulan.

File JavaScript

File JavaScript digunakan untuk fungsi interaktif pada website dan biasanya juga dapat dicache selama beberapa minggu.

Font dan Icon

File font seperti:

• WOFF
• WOFF2
• TTF

biasanya dapat dicache lebih lama karena jarang mengalami perubahan.

Mengaktifkan Expires Header Melalui File .htaccess

Berikut langkah-langkah untuk mengaktifkan expires header melalui file .htaccess di layanan hosting atau VPS berbasis cPanel.

1. Silahkan login ke cPanel hosting Anda terlebih dahulu.
2. Klik menu File Manager, lalu masuk ke directory root website yang ingin Anda kelola. Untuk domain utama, biasanya berada di folder /public_html.
3. Setelah itu, edit file .htaccess seperti pada gambar berikut:

4. Tambahkan script Expires Header pada konfigurasi file .htaccess yang Anda gunakan.

<IfModule mod_expires.c>
# Enable expirations
ExpiresActive On 
# Default directive
ExpiresDefault "access plus 1 month"
# My favicon
ExpiresByType image/x-icon "access plus 1 year"
# Images
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"
# CSS
ExpiresByType text/css "access plus 1 month"
# Javascript
ExpiresByType application/javascript "access plus 1 year"
</IfModule>

Setelah menambahkan script tersebut, simpan perubahan pada file .htaccess.

Cara Mengecek Apakah Expires Header Sudah Aktif

Menggunakan Chrome DevTools

1. Buka website Anda di browser Chrome
2. Tekan F12
3. Pilih tab Network
4. Klik salah satu file statis seperti gambar atau CSS
5. Periksa bagian Response Headers

Jika konfigurasi berhasil, Anda akan melihat bagian headers pada bagian Cache-Control
seperti gambar berikut:

Menggunakan Tools Online

Anda juga dapat menggunakan tools berikut:

• Google PageSpeed Insights
• GTmetrix

Tools tersebut biasanya akan memberikan rekomendasi jika browser caching belum diaktifkan.

Masalah yang Sering Terjadi Saat Setting Expires Header

Berikut adalah beberapa issue yang sering terjadi ketika melakukan setting Expires Header pada website melalui file .htaccess.

1. Modul mod_expires Tidak Aktif: Jika server Apache tidak mengaktifkan modul mod_expires, maka konfigurasi pada .htaccess tidak akan berjalan.
2. Server Menggunakan Nginx: Jika server menggunakan Nginx, pengaturan expires header tidak bisa dilakukan melalui .htaccess.
3. Konflik dengan Plugin Cache: Pada website WordPress, beberapa plugin cache seperti LiteSpeed Cache, WP Rocket atau W3 Total Cache dapat menimpa konfigurasi .htaccess.

Tips Optimasi Cache Website Selain Expires Header

Selain menggunakan expires header, ada beberapa metode lain yang dapat membantu meningkatkan performa caching website.

• Menggunakan Cache-Control Header: Header ini memberikan kontrol caching yang lebih fleksibel dibandingkan expires header.
• Menggunakan CDN: Content Delivery Network dapat membantu mempercepat distribusi file statis ke berbagai lokasi server di seluruh dunia.
• Menggunakan Plugin Cache: Untuk website berbasis WordPress, plugin cache dapat membantu mengoptimasi caching secara otomatis.

FAQ

Berikut beberapa pertanyaan populer tentang setting expires header pada website.

Kesimpulan

Setting expires header melalui file .htaccess merupakan salah satu cara sederhana untuk meningkatkan performa website dengan memanfaatkan browser caching. Dengan pengaturan ini, file statis seperti gambar, CSS, dan JavaScript dapat disimpan di browser pengunjung sehingga halaman website dapat dimuat lebih cepat dan beban server menjadi lebih ringan.

Meskipun konfigurasi expires header cukup mudah dilakukan, penting untuk memastikan server mendukung modul mod_expires serta melakukan pengujian setelah konfigurasi diterapkan. Dengan pengaturan caching yang tepat, performa website dapat meningkat dan pengalaman pengguna menjadi lebih baik.