Sajikan Aset Statis Dengan Kebijakan Cache yang Efisien (3 Metode)

Diterbitkan: 2022-04-12

Saat Anda menyajikan aset statis dengan kebijakan cache yang efisien, browser pengguna akan menyimpan file-file ini secara lokal dan lebih sedikit waktu yang dibutuhkan untuk memuat halaman. Biasanya segera setelah halaman dimuat, semua sumber daya halaman itu, seperti HTML, CSS, JavaScript, dan gambar, harus diunduh.

Cache browser memungkinkan browser untuk mengambil aset statis seperti CSS, JavaScript, dan gambar dari cache lokalnya. Akibatnya, halaman dimuat lebih cepat. Konten yang di-cache berarti kunjungan berikutnya ke halaman akan lebih cepat daripada kunjungan pertama pengguna, tetapi tidak pada kunjungan pertama.

Daftar isi

Apa itu cache?

Cache adalah lapisan penyimpanan data berkecepatan tinggi dalam komputasi yang menyimpan sebagian data yang seringkali bersifat sementara sehingga permintaan selanjutnya untuk data tersebut dapat dilayani lebih cepat daripada mengakses lokasi penyimpanan utama data. Caching memungkinkan Anda dengan cepat menggunakan kembali data yang telah diambil atau dihitung sebelumnya.

Bagaimana sebenarnya caching bekerja?

Data dalam cache biasanya disimpan dalam perangkat keras akses cepat seperti RAM (memori akses acak), tetapi juga dapat digunakan bersama dengan komponen perangkat lunak. Tujuan dasar dari cache adalah untuk mempercepat pengambilan data dengan menghilangkan kebutuhan untuk menghubungi lapisan penyimpanan yang lebih lambat di belakangnya.

Berbeda dengan database, yang menyimpan seluruh data dan tahan lama, cache sering menyimpan sebagian data secara sementara.

Keuntungan dari caching

Lepaskan beberapa keuntungan dari caching.

Tingkatkan kinerja aplikasi Anda

Membaca data dari cache dalam memori sangat cepat karena memori jauh lebih cepat daripada disk (magnetik atau SSD) (sub-milidetik). Akses data yang jauh lebih cepat ini meningkatkan kinerja aplikasi secara keseluruhan.

Beban Backend Harus Dikurangi

Dengan menggeser sebagian beban baca dari database backend ke lapisan dalam memori, caching mengurangi tekanan pada database Anda, menjaganya agar tidak mengalami kinerja yang lemah di bawah beban berat atau bahkan mogok di bawah lonjakan.

Hotspot dalam database harus dihilangkan

Banyak aplikasi cenderung mengambil subset data lebih sering daripada yang lain. Akibatnya, hot spot dapat terjadi di database, dan Anda mungkin perlu menyediakan sumber dayanya secara berlebihan berdasarkan persyaratan throughput untuk data yang paling sering digunakan. Untuk data yang sering diakses, cache dalam memori mengurangi persyaratan penyediaan yang berlebihan sekaligus memberikan kinerja yang cepat dan dapat diprediksi.

Kurangi biaya database Anda

Operasi input/output per detik (IOPS) dapat dilakukan oleh instans cache tunggal, memungkinkannya untuk mengganti beberapa instans database dan mengurangi biaya secara signifikan. Itu sangat penting jika basis data utama membebankan jumlah data. Mungkin ada perbedaan harga yang besar dalam kondisi tertentu.

Performa yang bisa diprediksi

Berurusan dengan lonjakan penggunaan aplikasi adalah masalah umum dalam sistem modern. Peningkatan beban database menyebabkan waktu pengambilan data lebih lama, membuat kinerja aplikasi secara keseluruhan tidak dapat diprediksi. Masalah ini dapat diselesaikan dengan menggunakan cache dalam memori throughput tinggi.

Meningkatkan jumlah orang yang membaca (IOPS)

Sistem dalam memori memiliki tingkat permintaan (IOPS) yang jauh lebih tinggi daripada basis data berbasis disk yang sebanding, selain memiliki latensi yang berkurang. Saat digunakan sebagai cache samping terdistribusi, satu instans dapat memenuhi ratusan atau bahkan ribuan permintaan per detik.

Apa itu cache aset?

Caching adalah gagasan langsung. Saat browser mengunduh aset, browser menggunakan kebijakan server untuk menentukan apakah harus mengunduhnya lagi atau tidak pada kunjungan berikutnya. Jika server tidak menyediakan kebijakan, browser default, yang biasanya berarti menyimpan file untuk sesi tersebut.

Apa itu cache aset statis?

tentukan berapa lama browser harus menyimpan atau menyimpan sumber daya secara sementara. Setiap permintaan berikutnya untuk sumber daya tersebut dilayani dari salinan lokal browser, bukan dari jaringan.

Setiap kali pengunjung situs Anda mengambil versi baru dari sesuatu yang belum di-cache di dalam browser atau server, Anda menggunakan kebijakan cache yang tidak efisien. Ketika, pada kenyataannya, Anda mungkin menyajikannya dalam cache dan konten tersimpan yang siap digunakan.

Baca juga: Cara Memperbaiki Permalinks Rusak di WordPress

Apa itu kebijakan cache yang efisien?

Jika file statis Anda tidak berubah (atau Anda memiliki mekanisme penghilang cache yang dapat diterima), sebaiknya atur kebijakan cache Anda menjadi 6 bulan atau 1 tahun.

Elemen seperti file CSS/JS global, logo, grafik, dan sebagainya jarang berubah di situs web yang sudah jadi, jadi 6 bulan atau satu tahun adalah masa kadaluwarsa cache yang adil untuk digunakan.

Tentu saja, jika Anda sering mengubah file statis di atas, Anda dapat memilih waktu kadaluwarsa cache yang lebih pendek selama lebih dari 3 bulan.

Sajikan aset statis dengan kebijakan cache yang efisien

Ada beberapa cara kami dapat melayani file statis menggunakan kebijakan cache yang efisien, kami akan membahas 3 metode:

  1. Menggunakan file .htaccess jika Anda menggunakan LiteSpeed ​​Enterprise atau Apache
  2. Menggunakan Cache LiteSpeed
  3. Menggunakan plugin W3 Total Cache

Sajikan Aset Statis menggunakan file .htaccess di Apache dan LiteSpeed ​​Enterprise

Catatan: Jika Anda menggunakan OpenLiteSpeed ​​atau NGINX, metode ini tidak akan berfungsi.

Masuk ke Dasbor WordPress Anda

Klik Plugin -> Tambahkan baru dari menu sebelah kiri

Cari "Manajer file". Instal dan aktifkan plugin

Klik "Manajer File" dari menu sebelah kiri

Di folder public_html, klik kanan pada .htaccess dan klik rename

Ubah nama file (.htaccess-error)

Klik ikon "file baru" dari atas

Beri nama file ".htacess"

Rekatkan kode berikut dan simpan dan tutup

 <IfModule mod_expires.c> ExpiresActive On # CSS, JavaScript ExpiresByType text/css "access plus 1 year" ExpiresByType text/javascript "access plus 1 year" ExpiresByType application/javascript "access plus 1 year" # Fonts ExpiresByType font/ttf "access plus 1 year" ExpiresByType font/otf "access plus 1 year" ExpiresByType font/woff "access plus 1 year" ExpiresByType font/woff2 "access plus 1 year" ExpiresByType application/font-woff "access plus 1 year" # 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/webm "access plus 1 year" ExpiresByType video/mp4 "access plus 1 year" ExpiresByType video/mpeg "access plus 1 year" # Others ExpiresByType application/pdf "access plus 1 year" ExpiresByType image/vnd.microsoft.icon "access plus 1 year" </IfModule>

Sajikan Aset Statis menggunakan LiteSpeed ​​Cache

Anda perlu menginstal dan mengaktifkan plugin LiteSpeed ​​Cache, setelah terinstal, ikuti panduan di bawah ini:

  • Buka Dasbor WordPress Anda
Sajikan aset statis dengan kebijakan cache yang efisien
  • Klik LiteSpeed ​​Cache -> Cache dari menu sebelah kiri
  • Klik pada tab "Browser" dari atas
  • Nyalakan sakelar "Tembolok Peramban"
  • Klik "Simpan Perubahan"

Sajikan Aset Statis menggunakan W3 Total Cache

Instal dan aktifkan plugin W3 Total Cache terlebih dahulu lalu ikuti panduan di bawah ini.

  • Buka Dasbor WordPress Anda
  • Klik Performance -> Browser Cache dari menu sebelah kiri
  • Gulir ke bawah ke "Media dan File Lain". Ubah "Kedaluwarsa Header Seumur Hidup" menjadi setidaknya 15552000s (180 hari).
  • Klik "Simpan semua pengaturan"

Kesimpulan

Saat Anda menyediakan aset statis dengan strategi cache yang efisien, browser pengguna akan menyimpan file-file ini secara lokal, mengurangi jumlah waktu yang dibutuhkan halaman untuk memuat. Semua sumber daya halaman, seperti HTML, CSS, JavaScript, dan gambar, harus diunduh segera setelah dimuat.