Posted on

Optimasi Website WordPress Dengan Litespeed Cache

wpJakarta – Optimasi Website WordPress Dengan Litespeed Cache. Kali ini kami ingin membagikan step by step Optimasi Website WordPress Dengan Litespeed Cache. Dengan beberapa langkah mudah setting plugin Litespeed cache untuk wordpress. Sudah dapat membuat website menjadi lebih ngebut. Apa yang menurut kami menjadi keunggulan plugin ini adalah settingnya yang mudah tapi memberikan dampak yang sangat signifikan untuk meningkatkan performa website. Itu karena teknologi yang menurut kami paling canggih di banding dengan plugin sejenis lainnya.

Optimasi Website WordPress Dengan Litespeed

Litespeed cache plugin wordpress (LSCWP)

Sebelumnya mari mengenal dulu apa itu litespeed cache plugin. Karena plugin ini lah faktor utama dan paling penting dalam meningkatkan performa website wordpress anda. Di samping juga dukungan dari plugin lainnya seperti smush yang mengoptimasi gambar dan jetpack pada setting basic asset statik CDN.

LiteSpeed Cache untuk WordPress (LSCWP) adalah plugin all-in-one untuk mempercepat akselerasi website wordpress, dengan cache tingkat server dan memiliki segudang fitur optimisasi. LSCWP kompatibel dengan plugin-plugin populer, seperti WooCommerce, bbPress, Yoast SEO, dan yang lainnya.

Setting kami lakukan pada website dengan beberapa spesifikasi sbb :
Tema Website : Storefront by WooCommerce.
Hosting Provider : Niagahoster.
Plugin esensial yang terinstall diantaranya : WooCommerce, Yoast, Wordfence, & Litespeed sendiri.

Baca Juga :

Setting Advance Option

Kami asumsikan bahwa anda sudah menginstalasi plugin LSCWP. Dan pada kondisi default setting plugin hanya akan menampilkan empat basic TAB, yaitu: General, Cache, Purge, Excludes. Yang ke-empatnya sudah tersetting secara default dan kami tidak melakukan perubahan apapun pada setting tersebut.

Klik pada tombol paling kanan (Show Advance Option) untuk membuka tab lainnya. Dan beberapa tab setting berikut akan muncul: Optimize, Tuning, Media, CDN, ESI, Advance, Debug, Crawler. Pada tab advance tersebutlah yang akan membantu wordpress anda meningkatkan kecepatan performanya secara signifikan.

Setting pada Tab Optimize

Setting pada TAB OPTIMIZE yaitu setting untuk meningkatkan performa website dengan focus pada proses me-minifikasi dan mengkombine kode-kode HTML, JS dan CSS.

Seperti kita ketahui bahwa dengan meminify baris kode HTML, JS atau CSS dapat mengurangi ukuran file-file website anda. Karena baris kosong seperti spasi, baris baru (enter) pada kode editor website anda akan di hilangkan. Termasuk juga komen yang mungkin di tuliskan oleh developer tema website.

Pada TAB OPTIMIZE anda akan menemui beberapa setting sebagai berikut :

  • CSS Minify : Default OFF, Set menjadi ON
  • CSS Combine : Default OFF, menjadi ON
  • CSS HTTP/2 Push : Default OFF, Set menjadi ON
  • JS Minify : Default OFF, Set menjadi ON
  • JS Combine : Default OFF, Set menjadi ON
  • JS HTTP/2 Push : Default OFF, Set menjadi ON
  • HTML Minify : Default OFF, Set menjadi ON
  • Inline CSS Minify : Default OFF, Set menjadi ON
  • Inline JS Minify : Default OFF, Set menjadi ON
  • Load CSS Asynchronously : Default OFF, Set menjadi ON
  • Generate Critical CSS : Default ON, Set tetap ON
  • Generate Critical CSS In Background : Default ON, Set tetap ON
  • Inline CSS Async Lib : Default ON, Set tetap ON
  • Load JS Deferred : Default OFF, Set menjadi ON
  • Exclude JQuery : Default ON, Set tetap ON
  • Remove Comments : Default OFF, Set menjadi ON

Setting pada Tab Tuning

Sementara pada tab Tuning anda akan menemui beberapa setting misalnya pilihan anda untuk meremove query string dan google font. Contoh mudah untuk mengenali query string adalah jika anda melihat halaman URL yang terdapat symbol misalnya tanda Tanya “?” atau symbol Dan “&”.

String tersebut bukanlah bagian dari struktur kode website yang perlu di load saat website anda diakses. Itu sebabnya mengapa kita perlu untuk me-remove query string tersebut.

  • Combined CSS Priority : Default OFF, Set tetap OFF
  • Combined JS Priority : Default OFF, Set tetap OFF
  • Remove Query Strings : Default OFF, Set menjadi ON
  • Load Google Fonts Asynchronously : Default OFF, Set menjadi ON
  • Remove Google Fonts : Default OFF, Set tetap OFF
  • Critical CSS Rules : Setting tetap default
  • JS Deferred Excludes : Setting tetap default
  • Remove WordPress Emoji : Default OFF, Set menjadi ON

Setting pada Tab Media

Pada tab Media anda akan menemui beberapa setting yang khusus untuk menangani optimasi gambar atau media. Dan berikut setting yang kami aplikasikan.

  • Lazy Load Images : Default OFF, Set menjadi ON
  • Responsive Placeholder : Default OFF, Set menjadi ON
  • Responsive Placeholder Background Color : Warna Default (Grey/Abu-abu)
  • Generate Reponsive Placeholder In Background : Default ON, Set tetap ON
  • Lazy Load Iframes : Default OFF, Set menjadi ON
  • Inline Lazy Load Images Library : Default OFF, Set menjadi ON
  • Optimize Automatically : Default OFF, Set menjadi ON
  • Optimization Cron : Default ON, Set tetap ON
  • Optimize Original Images : Default ON, Set tetap ON
  • Remove Original Backups : Default OFF, Set menjadi ON
  • Optimize WebP Versions : Default OFF, Set menjadi ON
  • Optimize Losslessly : Default OFF, Set tetap OFF
  • Preserve EXIF/XMP data : Default OFF, Set tetap OFF
  • Image WebP Replacement : Default OFF, Set menjadi ON
  • WebP Attribute To Replace : Default setting
  • WebP For Extra srcset : Default OFF, Set tetap OFF

Baca Juga :

Setting TAB CDN, ESI dan Advance

Pada TAB CDN kami tidak melakukan setting apapun alias membiarkannya secara default. Ini karena kami tidak mengimplementasikan penggunaan layanan CDN. Jika anda menggunakan layanan CDN tentu saja anda perlu untuk melakukan konfigurasi pada setting tersebut.

Dan pada TAB ESI (Edge Side Includes) kami membiarkannya juga secara default. Untuk toko online mungkin anda perlu mengatur setting ESI.

Dan Terakhir pada TAB ADVANCE kami hanya mengubah OFF menjadi ON pada dua setting yaitu : Object Cache dan Browser Cache.

Hasil Optimasi Website WordPress Dengan Litespeed Cache:

Untuk hasilnya sendiri pada versi mobile melalui google pagespeed memang masih di angka 64 dari sebelumnya yang hanya 22. Ini karena tema yang kami gunakan memang bukan tema jenis responsif. Jika anda menggunakan tema responsif hasilnya bisa jadi akan lebih tinggi. (pada hasil pengujian dengan menggunakan tema responsif kami lainnya bisa mencapai angka 92).

Sedangkan untuk versi PC angka yang dihasilkan melalui pagespeed hampir menyentuh angka sempurna yaitu 97 dari sebelumnya hanya 59.

Lakukan setting secara berhati-hati dan sesuai kebutuhan

Kami memang tidak menjelaskan secara detail satu persatu fitur dan setting pada LSCWP. Berhubung kebutuhan pada masing-masing website mungkin saja berbeda-beda satu dengan yang lainnya. Jika kami memilih setting ON, mungkin anda perlu untuk men-OFF kan pada website anda, begitu juga sebaliknya. Silahkan anda eksplor sendiri bagaimana kebutuhan website anda demi meningkatkan performa.

Dan kami menyarankan juga untuk anda men-settingnya secara hati-hati. Setiap kali anda merubah satu setting dari OFF menjadi ON. silahkan anda lihat dulu bagaimana effeknya pada website anda secara keseluruhan. Cek pada homepage anda, halaman arsip atau kategori, halaman posting artikel anda atau juga pada gambar di website anda.