Pernahkah Anda mendapat rekomendasi “Add Expires Headers” saat menggunakan GTMetrix? Rekomendasi dari tools cek kecepatan website ini terkait dengan kendala loading lambat. Jika dibiarkan, kenyamanan pengunjung website akan terganggu dan ranking di hasil pencarian bisa turun.
Jangan sampai hal ini terjadi, ya! Nah itulah kenapa penting untuk mengelola add expires headers dengan baik. Tujuannya, mempercepat loading blog dan website dengan memanfaatkan cache.
Lalu, bagaimana cara menambahkan expires header? Kami akan menjelaskan selengkapnya. Namun, sebelumnya mari pelajari dulu apa itu Expires Header.
Expires header adalah baris kode yang memberitahu browser berapa lama seharusnya file cache sebuah situs disimpan.
Penjelasan sederhananya seperti ini:
Ketika user pertama kali mengunjungi sebuah halaman website, browser biasanya akan otomatis memuat file dari server. File tersebut bisa berupa HTML, Images, PDF, CSS, Javascripts, dan lainnya. File yang diterima kemudian disimpan di cache. File yang dimuat tadi kemudian disimpan di cache.
Jadi, jika user ingin membuka halaman yang sama, cukup mengambil dari cache, tanpa meminta ke server lagi.
Namun, berapa lama seharusnya file tadi tersimpan di browser cache?
Nah, karena cache memiliki masa kedaluarsa (expired), penting untuk menentukan expires header yang sesuai. Kenapa demikian?
Jika expires header-nya terlalu cepat, maka akan selalu ada permintaan langsung ke server. Selain proses loading lama, bisa-bisa Anda mendapatkan peringatan seperti, “Your server is not using expires header for your image,” (“Server Anda tidak memiliki expires header untuk image-nya).
Di sisi lain, jika expires header terlalu lama, perubahan konten yang dilakukan tidak dapat segera ditampilkan. Sebab, browser masih menampilkan data lama yang tersimpan di cache..
Jadi, dengan menentukan add expires header, Anda bisa mengatur kapan waktu bagi browser harus mengambil file ke server. Serta, kapan ia cukup mengambil file dari cache saja.
Ada dua cara menambahkan add expires header: menggunakan plugin dan manual coding. Untuk manual coding, tentu Anda butuh keahlian pemrograman yang baik. Jika ingin lebih mudah, Anda bisa memanfaatkan beberapa plugin expires headers.
Sesuai dengan server yang Anda gunakan, inilah cara add expires header secara manual. Kami akan menjelaskan masing-masing cara melakukannya di server Apache dan Nginx. Oke, langsung saja simak penjelasannya di bawah ini ya!
1. Menggunakan Apache Web Server
Untuk menambahkan add expires header, Anda perlu mengakses file .htaccess. Cara termudah adalah melalui cPanel dengan langkah sebagai berikut:
Anda bisa login ke akun cPanel dengan username dan password yang sesuai.
Setelah login, pilih menu File Manager.
Di dalam File Manager, piih folder public_html.
Setelah masuk ke public_html, Anda akan menemukan file .htaccess. Lakukan klik kanan di file ini, lalu pilih Edit.
Langkah berikutnya, lakukan copy paste baris kode ini ke file .htaccess tersebut, seperti di bawah ini:
<IfModule mod_expires.c>
ExpiresActive On
# Images
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/webp "access plus 1 year"
ExpiresByType image/svg+xml "access plus 1 year"
ExpiresByType image/x-icon "access plus 1 year"
# Video
ExpiresByType video/mp4 "access plus 1 year"
ExpiresByType video/mpeg "access plus 1 year"
# CSS, JavaScript
ExpiresByType text/css "access plus 1 month"
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
# Others
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
</IfModule>
Seperti terlihat di contoh tersebut, Anda sudah mengatur status expiration dalam keadaan aktif. Selain itu, Anda juga sudah mengatur expiration untuk masing-masing jenis file. Sesuaikan dengan kebutuhan Anda.
Misalnya, file image dan video di atas menggunakan expiration 1 tahun. Pertimbangannya, jenis file tersebut tidak banyak mendapat update. Berbeda dengan CSS dan Javascript yang menggunakan expiration lebih cepat, yaitu 1 bulan.
Jika sudah selesai mengedit dan mengaktifkan file expirations, jangan lupa untuk menyimpan perubahan kode file di .htaccess tadi. Jika ternyata file .htaccess nya hidden, Anda bisa menggunakan FTP untuk memunculkan opsi Show Hidden Files.
2. Menggunakan Nginx Server
Cara menambahkan expires header di Nginx lebih mudah, Anda bisa copy paste baris kode di bawah ini ke server block Anda.
location ~* .(js|css|png|jpg|jpeg|gif|svg|ico)$ {
expires 30d;
add_header Cache-Control "public, no-transform";
}Menambahkan baris kode ke file .htaccess membutuhkan keahlian coding. Tapi, jangan khawatir. ada cara termudah mengelola add expires header, yaitu menggunakan plugin. Berikut ini cara menggunakannya:
Pertama, masuk ke dashboard WordPress. Kemudian, masuk ke menu Plugins > Add New. Lalu, ketik Add Expires Headers di kolom pencarian.
Setelah itu, klik Install Now, lalu Activate.
Pada menu Add Expires Header, klik Cache Setting.
Selanjutnya, di halaman Cache Settings, pilih jenis file yang ingin Anda aktifkan cache-nya. Kemudian, tentukan berapa lama cache akan menyimpan file
Jika pengaturan sudah dilakukan, klik Submit.
Selain Add Expires Headers, plugin lain yang bisa Anda gunakan adalah W3 Total Cache, WP Rocket, dan Leverage Browser Caching.
Baca Juga: 10+ Plugin WordPress Terbaik
Sekarang Anda sudah tahu bahwa salah satu cara untuk mempercepat loading website adalah dengan mengatur expires headernya. Anda dapat menentukan berapa lama cache menyimpan file sementara di browser sehingga tak perlu selalu meminta ke server.
Meskipun begitu, Anda perlu melakukannya sesuai kebutuhan website agar hasil yang didapat maksimal. Jangan lupa selalu lakukan pengecekan kecepatan website secara berkala. Tujuannya, untuk menjamin kenyamanan pengunjung dan mempertahankan posisi terbaik di hasil pencarian Google.
Ingat selalu bahwa kecepatan loading juga bisa mempengaruhi peringkat Anda di hasil pencarian Google. Jadi saran kami, lakukan pengecekan website secara rutin ya!
Oya, jika Anda memiliki website WordPress dan ingin membuat website Anda lebih cepat dari website yang lain, WordPress Hosting Niagahoster dapat dijadikan pilihan. Dengan fitur WordPress Accelerator dari LiteSpeed, performa website Anda akan lebih optimal!
Semoga artikel ini bermanfaat, sampai jumpa di artikel berikutnya!
