Cara Atasi Leverage Browser Caching pada WordPress Nginx

Diposting pada

Ketika kamu melakukan pengujian Kecepatan atau performa website kamu di Pingdom Website Speed Test atau yang lainya dan mendapati Leverage Browser Caching dengan score yang sangat kecil dan berwarna merah mungkin membuat kamu merasa kurang puas karena website kamu tidak optimal seperti gambar di bawah ini.

Cara Atasi Leverage Browser Caching

Pada waktu kita membuka halaman website akan mendownload semua konten HTM, CSS, JavaScript, gambar. Saat Membuka website yang besar terkadang bisa menjadi kurang nyaman apabila kamu memiliki koneksi internet yang lambat.

Setiap file akan membuat permintaan ke server kita. Dan hasilnya akan lebih banyak permintaan yang diterima oleh server pada waktu yang sama. Dengan hal itu semakin banyak pula hal yang harus dilakukannya. Hal ini berpotensi menimbulkan halaman lambat saat kita dibuka dan itu penyebab dari leverage browser caching.

Perlu diketahui bahwa cache pada browser akan membantu untuk menyimpan file secara lokal di browser pengguna. Pada waktu mengunjungi website pertama kali, waktu load website akan sama seperti biasa, tapi saat pengguna yang sama membuka kembali website tersebut atau me-refresh atau juga bahkan saat membuka halaman yang lain pada website, pengguna sudah memiliki beberapa file yang tersimpan di komputer pengguna. Yang artinya, browser pengguna hanya perlu mendownload data sedikit saja dan mengirimkan permintaan yang juga lebih sedikit ke server yang kita gunakan. Dan hasilnya waktu load halaman akan menjadi lebih cepat tanpa ada masalah leverage browser caching.

Nah pada tutorial kali ini melegenda.com akan membagikan tips agar score Leverage Browser Caching menjadi 100/100, tapi perlu di ketahui juga bahwa tutorial ini hanya untuk wordpress yang menggunakan webserver nginx dan kebetulan kasus yang di tampilkan pada Pingdom Website Speed Test adalah font google. Dan biasanya tidak hanya pada font saja, tapi bisa file jpg, css dan lain lainya.

Optimasi Cache Pada Nginx untuk Atasi Leverage Browser Caching

Untuk Mengatasi leverage browser caching pada nginx sendiri kamu bisa menambahkan bebeapa kode pada konfigurasi nginx seperti dibawah ini :

location = /favicon.ico { log_not_found off; access_log off; }
location = /robots.txt { log_not_found off; access_log off; allow all; }
location ~*  \.(jpg|jpeg|png|gif|ico|css|js|ttf|woff2)$ {
       expires 7d;
       log_not_found off;
}

 

Kode diatas silahkan di copy paste ke file default.conf

Caranya cukup buka terminal dan ketik perintah di bawah ini :

nano /etc/nginx/conf.d/default.conf

Kemduian tambahkan kode diatas di baris yang paling bawah, contohnya sepert di bawah ini :

 

Leverage Browser Caching Nginx

Kemudan simpan dan jangan lupa restart nginx dengan perintah :

sudo systemctl restart nginx

Dan sekarang test ulang di situs Pingdom Website Speed Test maka hasilnya seperti dibawah ini :

Leverage Browser Caching WordPress

 

Dengan cara diatas seharusnya masalah leverage browser caching sudah bisa terselesaikan tetapi jika nilainya tidak sampai 100/100 maka silahkan dicoba install plugins Disable Google Fonts pada wordpress kamu.

Cukup simple kan cara atasi leverage browser caching pada wordpress ?

Oke cukup sekian dulu torial Cara Atasi Leverage Browser Caching pada WordPress Nginx jika apa yang belum paham silahkan tulis pertanyaan di komentar dan jika ada yang mau memberikan kritik dan saran silahkan tulis di komentar juga. Terimakasih.

 

 

86 kali dilihat, 1 kali dilihat hari ini