Cara Setting Plugin Litespeed Paling Jos (Disertai Video)

Bagi pengguna web server litespeed, menggunakan litespeed cache merupakan solusi terbaik untuk meningkatkan kecepatan situs melalui pengoptimalan cache, penggabungan javascript dan CSS dan sebagainya.

Ini merupakan kabar baik, karena plugin ini dapat dinikmati secara gratis oleh semua pengguna wordpress self hosting. Sayangnya untuk menikmati fitur eksklusif dari plugin LSCWP, hanya diperuntukkan bagi pengguna hosting web server litespeed.

Tak perlu kuatir, bagi pengguna server Apache, NGINX, dan lainnya masih dapat menikmatinya. Namun hanya sebatas pada general features.

Fitur umum plugin litespeed cache:

• Optimalisasi Gambar
• Clean file revisi post
• Minify CSS, JavaScript, dan HTML
• Minify inline CSS / JS
• Combine CSS / JS
• Lazy load image
• Pemuatan CSS / JS asinkron
• Dukungan format gambar Webp
• Prefetch DNS
• HTTP / 2 Push untuk CSS / JS
• Hearbeat kontrol
• Exclude CSS / JS
• Database cleaner and optimizer
• dan lainnya

Fitur eksklusif plugin litespeed cache:

• Peningkatan cache automatis
• Pembersihan cache automatis
• Cache pribadi untuk pengguna yang masuk
• PemDukungan HTTP / 2isahan cache versi dekstop dan seluler
• Kemampuan menjadwalkan pembersihan untuk URL yang ditentukan
• Dukungan WooCommerce dan bbPress
• dan sebagainya

Installasi Plugin litespeed cache

Untuk menginstall plugin litespeed cache wordpress sangatlah mudah. Segera pergi ke dasboard wordpress – directory plugin. Kemudian, ketik di kolom penelusuran dengan kata kunci “litespeed“.

Proses penginstallan plugin LSCWP sama seperti plugin lainnya. Setelah selesai installasi, aktifkan plugin.

Langkah selanjutnya adalah melakukan pengaturan plugin litespeed cache.

WARNING: Setiap kali kamu membuat perubahan per tab pada plugin litespeed cache, cek perubahannya dan lihat apakah terjadi eror atau tidaknya.

Pengaturan plugin litespeed cache dilengkapi gambar dan penjelasannya

Untuk melakukan pengaturan plugin LSCWP, perhatikan dasboard wordpress di sisi kiri. Pilih menu litespeed cache – setting – show advance options. Untuk menampilkan semua tab pengaturan.

Untuk mempermudah kalian semua, tutorial cara setting plugin litespeed cache ini saya pecah menjadi beberapa bagian. Diantaranya sebagai berikut:

1. General Setting

Untuk menentukan durasi cache per item, sesuaikan dengan type situs mu.

Jika type situs statis artinya jarang melakukan update seperti situs landing page, biarkan saja default. Namun, sangat disarankan untuk merubah pengaturan default. Karena cache terlalu lama akan mempengaruhi tampilan pembaharuan konten.

Namun, jika situs berbasis dinamis seperti melakukan update sangat sering dalam interval waktu hitungan jam, maka kamu bisa merubah durasi cachenya.

Durasi cache dalam satuan detik.

Kamu dapat menggunakan konversi automatis di google. Ketik saja kata kunci, “konversi detik ke menit“.

Durasi cache publik situs ini saya setting dalam waktu 1 jam sekali. Karena interval update situs ini cukup sering.

Petunjuk:

• Enable LiteSpeed Cache : enable
• Default Public Cache TTL : 5400 detik = 1,5 jam
• Default Private Cache TTL : 1800 detik = 30 menit
• Default Front Page TTL : 1800 detik = 30 menit
• Default Feed TTL : 0
• Default 404 Page TTL : 604800 = 7 hari
• Default 403 Page TTL : 0 atau 600 = 10 menit
• Default 500 Page TTL : 0 atau 600 = 10 menit
• Automatically Upgrade : off

Perlu diperhatikan, ketika jumlah pengunjung di situsmu katakanlah membludak, maka durasi cache perlu ditingkatkan agar tidak terlalu memakan resource hosting. Durasi cache dalam waktu 2 – 3 jam sudah cukup baik untuk menghandle trafik harian hingga puluhan ribu.

Keterangan:

• Enable LiteSpeed Cache : jika di enable, kamu mengizinkan situs untuk di cache
• Default Public Cache TTL : untuk mengontrol sebagian besar jenis halaman
• Default Private Cache TTL : untuk mengatur berapa lama waktu yang dibutuhkan untuk mencache halaman pribadi, user login, dasboard wordpress dan sebagainya.
• Default Front Page TTL : Pengaturan TTL ini mengontrol halaman depan. Contoh, halaman toko WooCommerce, homepage.
• Default Feed TTL : Jika ditulis 0 itu bearti kamu tidak mengizikan cache pada feed
• Default 404 Page TTL : terkait dengan halaman eror atau tidak ditemukan. Karena laman 404 bersifat statis, atur cache untuk 404 lebih lama.
• Default 403 Page TTL : Kode 403 terkait dengan status HTTP artinya ada suatu halaman web atau sumber yang anda coba akses adalah sesuatu hal dilarang. Misalnya, file khusus di directory hosting
• Default 500 Page TTL : sebuah kode pesan disebabkan oleh masalah server akibat dari kesalahan penulisan httaccess atau kode program di hosting. Ini juga tak perlu di cache karena bersifat dinamis
• Automatically Upgrade : Off bearti kamu tidak mengizinkan plugin litespeed cache untuk melakukan update automatis

Arti dari TTL = Time to Live adalah mekanisme yang membatasi umur data dalam jaringan internet atau komputer.

Catatan lainnya, jika kamu menginginkan skor tools di Gtmetrix ijo ijo, setting durasi cache di atas 7 jam 30 menit atau 8 jam.

2. Pengaturan cache

Pada tab ini akan memungkinkan penggunanya untuk mengatur jenis konten yang ingin di cache. Kamu dapat membiarkannya secara default atau kamu dapat mencocokkannya seperti gambar di bawah ini:

Pengaturan:

• Cache Logged-in Users : ON
• Cache Commenters: ON
• Cache REST API: ON
• Cache Login Page: ON
• Cache favicon.ico: ON
• Cache PHP Resources: ON
• Cache Mobile: Off untuk pengguna AMP setting ON
• List of Mobile User: Default
• Private Cached URIs: biarkan kosong
• Drop Query String: biarkan kosong

Keterangan:

• Cache Logged-in Users : Ketika pengguna masuk, ada kemungkinan setiap halaman memiliki konten pribadi dan konten tersebut tidak masuk ke dalam cache publik. Maka dari itu sebaknya pengaturan ini diaktifkan jika situsmu memiliki banyak pengguna.
• Cache Commenters: Jika pengguna masuk dan meninggalkan komentar, maka halaman akan dimuat ulang secara automatis dan ini tidak dilayani dalam cache publik.
• Api REST cahe: Pilihan ini memungkinan mu untuk mencache permintaan yang dibuat oeh wordpress REST API
• Cache favicon.ico: Opsi ini memungkinkan untuk menyimpan file favicion ke dalam cache
• Cache PHP Resources: Secara umum, CSS dan javascript akan dimuat melalui PHP. Pada dasarnya CSS dan JS adalah sumber statis sehingga kamu dapat mengatur cache dalam durasi cukup panjang.
• Cache Mobile: Khusus bagi pengguna AMP, tampilan mobile dan dekstop adalah halaman yang berbeda. Maka perlu dilakukan pengaktifan cache

Secara umum, ini sebenarnya sumber CSS atau javascript dimuat melalui PHP.

3. Pengaturan purge

Purge bearti bersih atau membersihkan. Purge cache bearti membersihkan cache.

Pada tab ini, kamu dapat membersihkan cache sebelum waktu cache dimulai. Jika kamu membuat durasi cache publik selama 1,5 jam, maka siklus pembersihan cache akan berjalan setiap 1,5 sekali.

Tetapi, kamu dapat membersihkan cache sebelum waktu itu tiba dan kamu dapat menetapkan waktu pembersihan cache secara otomatis.

Ini pengaturan yang saya lakukan,

Petujuk pengaturan:

• Purge All On Upgrade: ON
• Auto Purge Rules For Publish/Update: CEK GAMBAR DI ATAS
• Scheduled Purge URLs: biarkan kosong
• Scheduled Purge Time: biarkan kosong atau setting ke 00:00 (tepat jam 12 malam cache akan dibersihkan)

Keterangan:

• Purge All On Upgrade: ON bearti kamu mengizinkan pembersihan cache secara automatis ketika plugin litespeed di upgrade ke versi terbaru
• Auto Purge Rules For Publish/Update: terkadang ketika seorang penulis menerbitkan tau memperbarui postingan, halaman dan sebagainya, semuanya akan berubah (dinamis). Perubahan dapat terjadi di katagori, tag, homepage dan sebagainya
• Scheduled Purge URLs: di sini kamu dapat mengatur jadwal purge automatis per halaman, katagori, tag, halaman pribadi dan sebagainya. Input saja URL nya di sini jika ada
• Scheduled Purge Time: biarkan kosong atau setting ke 00:00 (tepat jam 12 malam cache akan dibersihkan) jika frekuensi update terlalu sering seperti pada blog autoposting

4. Tab Exclude

Exclude bearti pengecualian.

Di tab ini, kamu dapat mengecualikan konten apa saja, katagori, artikel, tag dan sebagainya.

Adapun pengaturan tab excluce litespeed cache yang saya lakukan sebagai berikut:

Petunjuk pengaturan:

• Force Cache URIs: biarkan kosong
• Do Not Cache URIs: biarkan kosong
• Do Not Cache Query Strings: biarkan kosong
• Do Not Cache Categories: biarkan kosong
• Do Not Cache Tags: biarkan kosong
• Do Not Cache Cookies: biarkan kosong
• Do Not Cache User Agents: biarkan kosong
• Do Not Cache Roles: cek gambar

Mengapa pilihan Administrator, Author dan editor saya centang ?

Itu dikarenakan, situs ini dikelola oleh banyak orang. Perannya masing masing berbeda. Saya tidak ingin dasboard wordpress untuk setiap user yang login masuk ke dalam cache. Jika situsmu terdiri dari 1 user, sebaiknya biarkan default.

Keterangan:

• Do Not Cache URIs: memungkinkan mu untuk menginput url yang tidak ingin di cache. URL apa saja di situs mu
• Do Not Cache Query Strings: Kamu dapat menghilangkan URL dengan string kueri tertentu agar tidak masuk dalam. Query bagian dari kode CSS atau JS atau PHP Masukkan satu per baris. contoh: query color=purple
• Do Not Cache Categories: input url katagori yang tidak ingin di cache
• Do Not Cache Tags: input url tag yang tidak ingin di cache
• Do Not Cache Cookies: Cookies memungkinkan penggunanya untuk menyimpan data username dan password ketika login di dalam browser. Sebaiknya biarkan default

5. Pengaturan Optimize

Di tab ini, kamu dapat melakukan banyak hal diantaranya membuat kode CSS dan javascript dalam satu baris, konversi javascript menjadi asinkron dan sebagainya. Untuk lebih jelasnya, kamu dapat

Berikut pengaturan yang saya lakukan:

How to setting litespeed cache plugin on tab optimize:

• CSS Minify: ON
• CSS Combine: ON
• CSS HTTP/2 Push: ON nonaktifkan jika hosting mu tidak mendukung HTTP 2
• JS Minify: ON
• JS Combine: ON
• JS HTTP/2 Push: ON nonaktifkan jika hosting mu tidak mendukung HTTP 2
• CSS/JS Cache TTL: 10800 detik = 3 jam. File CSS dan javasript akan di cache selama 3 jam
• HTML Minify: ON
• Inline CSS Minify: ON
• Inline JS Minify: ON
• Load CSS Asynchronously: ON jika laman homepage ancur lebur berantakan, OFF kan saja
• Generate Critical CSS: ON jika laman homepage ancur lebur berantakan, OFF kan saja
• Generate Critical CSS In Background: ON jika laman homepage ancur lebur berantakan, OFF kan saja
• Separate CCSS Cache Post Types: biarkan kosong
• Separate CCSS Cache URIs: biarkan kosong
• Inline CSS Async Lib: ON
• Load JS Deferred: ON
• Exclude JQuery: ON
• DNS Prefetch biarkan: isi dengan CEK KETERANGAN DI BAWAH
• Remove Comments: ON

Keterangan:

• CSS Minify: mengecilkan ukuran css agar diunduh lebih cepat
• CSS Combine: bertujuan untuk mengurangi jumlah permintaan HTTP yang dibuat oleh browser selama penyegaran halaman dengan mengganti file CSS yang berbeda dengan 1 file CSS saja. Sehingga, situs akan menampilkan konten lebih cepat.
• CSS HTTP/2 Push: ON nonaktifkan jika hosting mu tidak mendukung HTTP 2
• JS Minify:mengecilkan ukuran JS agar diunduh lebih cepat
• JS Combine: bertujuan untuk mengurangi jumlah permintaan HTTP yang dibuat oleh browser selama penyegaran halaman dengan mengganti file JS yang berbeda dengan 1 file JS saja. Sehingga, situs akan menampilkan konten lebih cepat.
• JS HTTP/2 Push: ON nonaktifkan jika hosting mu tidak mendukung HTTP 2
• CSS/JS Cache TTL: 10800 detik = 3 jam. File CSS dan javasript akan di cache selama 3 jam
• HTML Minify:mengecilkan ukuran HTML agar diunduh lebih cepat
• Inline CSS Minify: membuat file CSS menjadi 1 baris
• Inline JS Minify: membuat file JS menjadi 1 baris
• Load CSS Asynchronously: memungkinkan untuk merubah file CSS menjadi type asinkron
• Generate Critical CSS: ON
• Generate Critical CSS In Background: ON
  Cara kerja Critical CSS (CCSS):
  – Pengunjung mengirim permintaan ke Server Klien
  – Jika tidak ada Critical CSS , Server Klien akan mengirimkan permintaan CSS Critical ke Server Critical CSS (atau, CCSS) jarak jauh LiteSpeed
  – Server CCSS akan mengambil konten + aset dari Server Klien, dan kemudian menghasilkan CSS Kritis
  – Server CCSS kemudian mengirimkan CSS Kritis yang dihasilkan kembali ke Server Klien
  – Server Klien menyajikan konten dengan CSS Kritis untuk PengunjungSebaiknya diaktifkan.
• DNS Prefetch biarkan: DNS Prefetch memungkinkan untuk memberikan perintah kepada browser agar menyelesaikan perenderan nama Domain tertentu secepat mungkin di awal waktu
• Remove Comments: Jika diaktifkan, komentar tidak akan dimuat/dijelajah/ditelusuri di dalam CSS/JS. Sehingga, kecepatan situs akan meningkat

Pengaturan DNS Prefetch isi dengan ini:

//ajax.googleapis.com
//www.googletagmanager.com
//maps.googleapis.com
//fonts.googleapis.com
//fonts.gstatic.com
//apis.google.com
//google-analytics.com
//www.google-analytics.com
//ssl.google-analytics.com
//connect.facebook.net
//platform.twitter.com
//syndication.twitter.com
//s.gravatar.com
//cdn.onesignal.com
//maxcdn.bootstrapcdn.com
//onesignal.com
//images.dmca.com
//bp.blogspot.com
//1.bp.blogspot.com
//2.bp.blogspot.com
//3.bp.blogspot.com
//4.bp.blogspot.com

Pengaturan DNS prefetch di atas dapat menyesuaikan dengan kondisi situs mu. Saya menempatkan blogspot karena situs ini megambil gambar dari blogspot (hotlink).

Pengaturan yang saya lakukan terhadap situs ini cukup sampai di sini. Selebihnya saya biarkan secara default.

Sedangkan, pengoptimalan gambar tidak saya lakukan karena akan meningkatkan penggunaan inode hosting. Jika menginginkan kecepatan situs di atas rata, gunakan saja fitur itu di menu Image Optimazation.

Setelah selesai merubah pengaturan, jangan lupa di simpan dan pilih Purge All LSCache.

Panduan tutorial pengaturan plugin litespeed cache Video

Hasil akhir 

Untuk melihat hasilnya, beberapa tools yang saya gunakan adalah:

1. Pagespeed insight google
2. Pingdom
3. Gtmetrix
4. Webpagetest

Hasilnya:

1. Pagespeed insight google

Skornya ijo semua, lumayanlah bikin mata jadi seger. 😀

2. Pingdom

Lumayan, namun tidak cukup baik.

3. Gtmetrix

Tidak terlalu baik. Salah satu alasannya karena serve scaled images. Saya sih mengabaikan ini. Tools ini merekomendasikan untuk merubah gambar menjadi beberapa dimensi gambar. Saya menonaktifkan untuk dimensi gambar tertentu dengan tujuan penghematan penggunaan inode.

Artikel ini mungkin menarik: cara mengurangi inode hosting [studi kasus].

4. Webpagetest

Sedangkan versi webtestpage lebih gila lagi, hasilnya cukup buruk. 😀

FAQ Tanya Jawab

1. Apakah plugin litespeed cache sepenuhnya gratis?

Ya. Plugin litespeed cache akan selalu gratis dan bersifat open source.

2. Perangkat lunak jenis server apa yang diperlukan untuk plugin ini?

Pada dasarnya semua web server dapat menggunakan plugin ini. Seperti Apache, NGINX dan sebagainya. Hanya penggunaanya terbatas pada general features.

Jauh lebih baik menggunakan litespeed server seperti:

• LiteSpeed ​​Web Server Enterprise dengan Modul LSCache (v5.0.10 +)
• OpenLiteSpeed ​​(v1.4.17 +) – Gratis dan sumber terbuka!
• LiteSpeed ​​WebADC (v2.0 +)

3. Dimanakah file cache akan disimpan?

Halaman yang di-cache akan disimpan dan dikelola oleh LiteSpeed ​​Server.

4. Apakah plugin litespeed mendukung WooCommerce?

Pada dasarnya ya, jika server yang digunakan litespeed server. Namun terkadang untuk beberapa thema, tidak sepenuhnya berfungsi. Jika itu masalahnya, kunjungi laman bantuan berikut : https://blog.litespeedtech.com/2017/05/31/wpw-fixing-lscachewoocommerce-conflicts/

5. Ketika saya menginstall plugin ini, apakah gambar di dalam situs di optimasi?

Tidak. Namun, kamu harus melakukannya sendiri. Pengoptimalan gambar tidak dilakukan secara automatis. Namun, harus dilakukan atas izin pengguna pada menu Image Optimazation.

6. Apakah plugin ini dapat mendukung untuk semua thema dan plugin?

Tidak. Terkadang, tidak semua thema dan plugin support dengan plugin litespeed.

Contohnya saja, ketika kamu telah menggunakan plugin W3 total cache, justeru hasilnya akan crash dan menimbulkan pesan eror jika pengaturannya tidak tepat.

7. Bagaimana cara menghapus plugin litespeed cache hingga tuntas?

Langkah pertama, nonaktifkan plugin dan hapus plugin dari daftar plugin wordpress yang terinstall di situs kamu. Selanjutnya, bersihkan file cache melalui cpanel secara manual. Seperti mengembalikan pengaturan httacces ke pengaturan sebelum menggunakna plugin litespeed cache.

8. Kapan sebaiknya menggunakan plugin litespeed?

Sangat dianjurkan untuk menggunakannya pada saat sejak pertama kali menginstall wordpress di domain. Selain itu, plugin cache sangat disarankan untuk digunakan pada situs yang memiliki trafik tinggi >2.000 unik visitor perhari. Karena penggunaan cache akan mengurangi beban server dan resources hosting.

Disclaimer:

Perlu kamu ketahui, terkadang walaupun kita menggunakan pengaturan yang sama, belum tentu hasilnya juga sama. Karena ada beberapa faktor yang menyebabkan itu semua seperti pengaruh lokasi server, penggunaan thema dan plugin di dalam situs, status load time server dan sebagainya.

Saya sendiri tidak ambil pusing masalah pagespeed situs, skor di bawah 3 – 5 detik sudah dikatakan cukup okelah.

Mungkin jika dioptimalkan lagi degan penggunaan CDN, merubah struktus CSS dan javasript secara manual kemudian mengkombine nya menjadi 1 file untuk diload dan sebagainya, mungkin hasilnya jauh lebih jos.

Jika ingin mendapatkan skor terbaik, gunakan saja thema yang ringan seperti generate press atau thema bawaan atau thema yang tidak memiliki banyak pemuatan javasript, css dan sebagainya semacam landing page. Hasilnya pasti lebih jos.

Ada yang ingin disampaikan ? katakan saja pada kolom komentar ya.