Anda di halaman 1dari 55

Optimasi Website

Tips Optimasi Google PageSpeed Insights


28 Januari 2017 Tips SEO

Seperti diketahui, kecepatan akses suatu website menjadi salah satu faktor yang
cukup penting, baik dari segi user experience maupun dari segi SEO. Load website
yang terlalu lambat bisa membuat orang malas mengakses website kita, pada
akhirnya harus menutup website tersebut sebelum terbuka sempurna.

Akibatnya, bounce rate melambung tinggi. Masalah utama yang sering dijumpai
adalah; Eliminate render-blocking JavaScript and CSS in above-the-fold content
(Menghilangkan JavaScript dan CSS yang memblokir perenderan di konten paruh
atas), Lantas, bagaimana cara membuat kecepatan website mencapai nilai 100/100
di Google PageSpeed Insights? berikut saya coba ulas tutorialnya. *sekedar catatan,
disini saya menggunakan WordPress self host.

Hal yang diperlukan:


● Hosting yang berkualitas, disarankan pakai VPS, namun uji coba saya sendiri
bisa menggunakan shared hosting dari Hawk Host.
● Plugin WP-Rocket (Premium), untuk harganya paling murah $39 (untuk 1
domain).
● Kalau mau lebih murah, bisa beli disaya, cukup $10 aja/tahun untuk 1 domain
(saya ada lisensi developer).
● Plugin WP-Rocket Footer JS (Gratis), fungsinya untuk memindahkan semua
Javascript ke bagian footer.
● Sedikit pengetahuan soal php, wordpress, html, dan CSS.
● Photoshop
● Jangan gunakan histats
● Jangan memasang kode analytics secara langsung, gunakan plugin
Complete Analytics Optimization Suite (CAOS) (Gratis)
● Settingnya cukup simple, tinggal masukin ID analytics aja.
● CDN, Content Dilevery Network (optional aja). Disini saya pakai KeyCDN
karena harganya cukup terjangkau. CDN ini sistem pembayarannya kaya
topup saldo gitu, jadi kita musti bayar dulu ($50) baru nanti dipotong setiap
pemakaian. Sejauh ini saya sudah menggunakan sekitar 1 minggu (ketika
artikel ini ditulis), dan saldo masih $49.90.

Oke, setelah semua siap kita lanjut urusan setting-menyeting, disini saya asumsikan
semua sudah punya hosting yang bagus.
1. Setting Wp-rocket, WP-Rocket ini setingannya cukup simple, sesuai kebutuhan
aja sebenernya. Tinggal centang-centang aja, kalau mau di centang semua juga
nggak masalah.

2. Install WP-Rocket Footer JS, Kemudian setelah itu, install plugin Plugin WP-
Rocket Footer JS. Plugin ini bisa diinstall secara gratis. Yang ini nggak perlu setting-
setting.

3. Install plugin Complete Analytics Optimization Suite (CAOS)

4. Editing Theme, Sejujurnya, dengan 2 plugin diatas sudah cukup membuat webiste
punya load yang cepat, namun belum bisa mencapai nilai 100/100 di Google
PageSpeed Insights. Biasanya warning masih terjadi seperti pada CSS. Untuk
urusan ini, harus melalukan editing pada theme, yakni dengan cara membuang
function yang berhubungan dengan CSS tersebut. Kemudian kita juga harus
meminify css tersebut dan memasukkannya kembali ke bagian footer secara
manual/melalui function.php. Sedikit pengetahuan menganai dunia coding mutlak
harus diketahui.

5. Editing Gambar, Setiap gambar yang mau di upload, selalu edit menggunakan
photoshop kemudian gunakan fitur Save for Web. Dengan fitur ini, gambar yang
dihasilkan akan berukuran kecil tapi punya resolusi yang baik, biasanya ukurannya
di bawah 100kb.

6. CDN , CDN ini optional, kadang dengan 4 cara diatas sudah cukup. Tapi untuk
website dengan visitor yang banyak, sangat disarankan menggunakan CDN. Untuk
urusan setting, cukup dengan menambahkan cname dari pihak cdn ke hosting
provider kita. Setelah itu, kita juga harus setting di plugin wp-rocket.
Rasakan sensasinya

note : hati-hati saat minify js dan css karena sering error apabila salah
Credit : mastahseo.com

Optimasi Via Plugin Autoptimize


SEO tidak melulu tentang off-page off-page off-page. Buat yang baru tau
tentang SEO, pasti mikirnya SEO itu ya make backlink aja. Tapi enggak.

Ada banyak faktor yang mempengaruhi peringkat website di SERP.


Salah satunya kecepatan situs. Tentang kecepatan situs, kita akan
bahas di artikel lain.

Sekarang kita belajar dulu tentang plugin wordpress bernama


Autoptimize ini.

Persiapan :
Sebelum setting, kita akan menggunakan tools untuk mengetahui
seberapa efektif sih plugin ini. Tools yang digunakan ialah :

● Google PageSpeed Insights

General Setting Plugin Autoptimize


settingan plugin autoptimize yang biasa, tinggal centang ketiga kolom
diatas

Settingan ini gampang. Kamu tinggal centang saja :

● Optimize HTML Code, Optimize Javascript Code dan Optimize


CSS Code.

● Dan jangan lupa klik SHOW ADVANCE SETTING, di pojok kanan


ada tombolnya

Penjelasannya di bawah ini.

1. Optimize HTML Code


Di fitur ini bisa membuat code html di blogmu terkompres, kalau kamu
cek pakai view-source:namadomainmu.com , biasanya codenya rapih.
Istilah compress ini disebut dengan minify. Kalau code html sebelumnya
seperti ini :

code html blog ini sebelum diminify

Setelah diminify, kodenya akan terkompress menjadi satu baris.


Keuntungannya ialah, ukuran file halaman akan lebih kecil. Lebih kecil berarti
data yang dipakai lebih sedikit. Loadnya pasti akan lebih cepat

2. Optimize Javascript Code

Ini penting banget nih. Javascript di CMS biasanya requestnya banyak, terus
kalau theme yang kurang bagus terkadang ada penambahan JavaScript
sendiri atau javascript yang dipasang secara inline.

Dengan mengaktifkan ini, javascriptnya akan digabungin dan otomatis


plugin ini bakal nge cache-in javascript. Supaya gak request terus dari luar
dan disimpan secara statis di disk server atau hosting kita.

Selain itu jangan lupa kosongin kolom ini (klik advance setting diaktifkan
dulu biar muncul) :
3. Optimize CSS Code

CSS itu ibarat baju di blog. Stylenya, yang membuat tampilan jadi bagus.
Tema dan plugin biasanya punya file CSS sendiri. Bayangin kalau
kebanyakan plugin, bisa bikin lemot web kita.

Centang ini biar kode CSS terkompress dan dikumpulin jadi satu dalam file
statis kayak JavaScript tadi.

Extra Setting :

Ini pilihan aja si, kalau mau lebih bagus lagi. Di tab settingan Autoptimize
ada tab “Extra” dimana kamu bisa mengaktifkan beberapa fitur tambahan.

Settingan Extra Autoptimize

Script emoticon dan versi script bisa membuat lemot web kita juga. Terus
kamu bisa centang remove Google Fonts kalau pengen mengurangi request
script dari luar.

Ini sebelumnya :
before ( sebelumnya )

Ini Hasilnya :
Kalau mau lebih bagus lagi, bisa non-aktifkan GRAVATAR. Cuman karena di
blog ini aku mengandalkan estetika juga, enggak aku non-aktifkin. Biar ada
fotoku pas kamu baca artikel :p

Sampai bertemu di tutorial berikutnya.

Faktor dan Alasan Website Mendapat Speed dan


Skor Bagus :

Server :

Berbicara soal optimasi kecepatan WordPress, nomor 1 yang menjadi


prioritas adalah SERVER, dan untuk menjadi ahli dibidang server ini, Anda
harus memiliki kemampuan lebih, dan modal lebih (untuk trial & error).

Karena inilah, sampai saat ini, banyak sekali WordPress Hosting beredar,
mereka semua menjual SERVER dengan paket optimasinya masing-masing.
Para WordPress Hosting provider, mereka bekerja keras untuk menjadi
nomor 1 dalam hal kecepatan, kemudahan, dan harga. Berbagai hal yang
perlu didalami, yaitu:

● Server Unik: SSD, CPU.


● Webserver (nginx, apache, litespeed)
● Update PHP
● Kompresi (gzip, brotli)
● dan banyak lainnya, yang tidak kami sebutkan.

Disini kami hanya akan menyarankan untuk memilih WordPress Hosting


Provider yang tepat. Tanpa bermaksud merendahkan WordPress Hosting
Provider lain, kami bermaksud memberikan saran terbaik untuk urusan
WordPress Hosting, yaitu pilihlah kami, hantamo.com.

Kami sudah sangat berpengalman, dan siap dibandingkan dengan semua


WordPress Hosting yang ada, bahwa kami berkomitmen selalu menjadi
yang nomor 1, dan pilihan terbaik bagi website untuk target visitor
mayoritas Indonesia.

Caching :

Banyak sekali pilihan caching plugin yang tersedia untuk WordPress. Kami
telah melakukan tes ujicoba sendiri, dan pilihan yang digunakan adalah
Cache Enabler by KeyCDN (lihat performance test disini). Disamping ringan,
cepat, dan mudah digunakan, plugin ini juga support webp image (akan
dibahas nanti).

Plugin Cache Enabler ini adalah plugin paling kami rekomendasikan (telah
dilakukan riset) ketika Anda TIDAK menggunakan WordPress Hosting dari
kami, Jika Anda menggunakan Hantamo, maka Anda sudah tidak perlu lagi
memikirkan tentang caching, karena kami telah menghandlenya pada level:
server, menggunakan VARNISH (Pilihan Tercepat).
Setting Cache Enabler Awal

Optimasi Gambar :

Kebanyakan website, memuat lebih banyak gambar dari pada konten


lainnya. Melakukan Optimasi Gambar sangat krusial dilakukan. Dengan
Page size yang lebih kecil (dengan optimasi gambar) tentu saja secara
keseluruhan akan mempercepat loading website WordPress milik Anda.

Kami sangat merekomendasikan plugin Shortpixel, untuk urusan optimasi


gambar. Fitur paling utama yang membuat kami memilih plugin ini adalah
kompresi yang dilakukan support webp image, yaitu tipe gambar terbaru
rekomendasi google untuk urusan kompresi gambar.

Plugin ini gratis, dengan batasan 100 buah gambar teroptimasi tiap
bulannya. Lakukan setting berikut jika Anda berniat tetap menggunakan
plugin ini secara gratis.

Shorpixel – General
Shortpixel – Advance

Cache Enabler dengan Shortpixel

Minification :
Ketika memuat sebuah halaman website WordPress, maka akan didapati file-file
.css atau file-file .js. Minification artinya mengoptimalkan file-file .css dan .js, dengan
cara menjadikannya satu (digabung), berguna agar request menjadi makin sedikit,
sehingga load time sebuah halaman makin singkat.

Banyak sekali plugin dengan kemampuan seperti ini, namun kami menyarankan
Autoptimize. Gunakan setting berikut ini pada plugin Autoptimize.

Autoptimize – html & Javascript


Autoptimize – CSS

Optimasi Font :

Tulisan pada website Menarik (dibaca), berdasarkan pada fontnya. Font paling
umum digunakan (pada WordPress) adalah Google Font (huruf) dan Font Awesome
(Icon). Menggunakan keduanya, secara default akan membuat masalah pada sisi
speed score (pagespeed, pingdom, dan lainnya), maka perlu dioptimasi.

● Optimasi Google Font, beragam sekali macamnya, kalian bisa search


di google. Namun, yang paling kami rekomendasikan jika kalian
menggunakan WordPress Cloud di Hantamo, adalah dengan cara host
google font locally, karena sangat disayangkan sekali jika Anda
memiliki SSD tercepat (pada hantamo) namun malah nge-load google
font dari google cdn, yang hanya cepat secara umum & global
(walaupun dns lookup bisa dioptimasi menggunakan preconnect).
● Optimasi Font Awesome dapat dilakukan, dengan cara nge-host
secara locally, dan menggunakan icon-icon yang dibutuhkan saja, yang
secara drastis akan membuat size dari font file menjadi kecil. Gunakan
juga versi terbaru jenis file, yaitu .woff2 yang lebih ringan, secara
ukuran file kira-kira separo dari .woff.
● Fix leverage browser cache file font. Anda harus menambahkan
beberapa line kode pada file htaccess Anda untuk melakukan optimasi
ini.
Saat ini, website hantamo.com kami optimasi font nya (google font & font
awesosome), Anda bisa melakukan check test speed score via gtmetix, pingdom,
webpagetest, atau pagespeed terhadap website kami.

Tutorial selengkapnya tentang step-by-step optimasi font Akan dijelaskan pada


artikel lain, tunggu update terbarunya!

Preconnect :

Preconnect, secara drastis mampu mengurangi page load time. Artinya website
secara keseluruhan akan menjadi lebih cepat dimuat. Cara kerjanya adalah fungsi
ini melakukan koneksi awal pada konten website diluar domain kita sejak saat html
file dimuat. Anda dapat mendalami ini dengan melakukan testing website
menggunaan webpagetest.org. Lihat screenshoot dibawah, untuk mendalami
preconnect, dan gunakan autoptimize untuk melakukan preconnect.

source igvita.com

Autoptimize – contoh: preconnect analytics


Analytics :
Google Analytics bisa dikatakan wajib melekat pada setiap website. Namun, jika
memasangnya secara normal, akan membuat pagespeed score sedikit menurun
(perlu optimasi pada bagian leverage browser caching), dan solusinya adalah host
google analytics script locally. Gunakan Plugin CAOS by Daan van den Bergh.

Pakai CDN ( Content Delivery Network ) :


CDN adalah Content Delivery Network. Jika website Anda sebuah website global
(bahasa inggris, ditujukan untuk visitor global) maka CDN sangat Wajib! Namun, jika
visitor website Ada pada wilayah tertentu, misalnya Indonesia dan sekitarnya saja,
maka paling tepat adalah dengan tidak menggunakan CDN. CDN memang secara
global Cepat, namun pada wilayah tertentu (Indonesia) lebih baik Anda tetap
menggunakan SSD hantamo milik kami yang tercepat. Anda bisa melakukan sendiri
test kecepatan hantamo vs CDN (dari sisi Indonesia). Jika menggunakan WordPress
Cloud Hantamo, anda otomatis akan menggunakan Cloudflare, namun Cloudflare
disini hanya kami gunakan sebagai DNS dan IP masking.

Optimasi Umum :
Beberapa Optimasi umum perlu dilakukan disisi server dan disisi WordPress. Kami
telah menghandle optimasi umum dari sisi server (misalnya selalu menggunakan
versi terbaru PHP, dll), maka tugas Anda hanya melakukan optimasi umum seperti:

● Selalu Update ke versi terbaru WordPress & update Plugin milik Anda.
Anda bisa melakukannya melalui dashboard WordPress milik Anda.
● Hanya Gunakan Plugin yang diperlukan. Semakin sedikit jumlah plugin
yang digunakan, secara umum semakin bagus.
● Gunakan Theme WordPress yang Ringan. Tidak selamanya theme
berbayar lebih baik dari theme gratisan. Rekomendasi dari kami,
gunakan theme gratis: Astra, dan kami anjurkan untuk menggunakan
child theme.

Speed "Score" Test :

Speed “score” adalah metode menilai (umumnya pada skala 0-100) kecepatan
website. Pada umumnya, semakin tinggi score yang diperoleh, akan membuat
website lebih cepat dimuat (baik secara visual maupun secara keseluruhan).
Namun, Speed “Score” sifatnya tidak Absolute, artinya jika speed score bernilai kecil,
bukan berarti website tidak cepat dimuat “pada kenyataannya”. Anda harus memiliki
banyak pengalaman tentang ini, namun secara garis besar kami berikan limitasi
speed score ini harus bernilai 80 atau lebih. Namun, kurang dari 80 sekali lagi bukan
mengartikan website lemot dimuat. Beberapa Speed Score Test diantaranya:

● Pagespeed by google
● GTmetrix (berbasis pagespeed & Yslow)
● Webpagetest (pendekatan content breakdown dengan berbagai lokasi
akses, untuk akurasi Page Load Time Test, tidak sekedar Score)
● Pingdom

Hasil Optimasi :
Kami memberikan contoh optimasi pada website kami sendiri, hantamo.com. Silakan
rasakan sendiri dari sisi browser milik Anda, seberapa cepat website kami dimuat
(kecepatan tampil secara visual maupun keseluruahan), bandingkan dengan website
lain. Berikut hasil Speed Score Test hantamo.com

Pagespeed Score – 14/2/2018


GTmetrix – from: Canada – 14/2/2018

Webpagetest – from: Jakarta – 14/2/2018


Pi
ngdom – from: Australia – 14/2/2018

Optimasi dengan Plugin a3 Lazy Load


a3 Lazy Load adalah plugin yang berguna utuk mempercepat situs kita dengan cara
menunda waktu pemuatan objek seperti gambar atau video yang biasanya bisa
memberatkan pemuatan halaman website atau blog kita.

Sebelumnya saya juga sudah membahas apa itu lazy load. Bagi Anda yang belum
paham silahkan untuk membuka postingan Mempercepat situs WordPress dengan
cara Lazy Load.

Secara default plugin a3 Lazy Load sudah mengaktifkan fungsinya sendiri tanpa kita
harus mengaturnya. Tetapi jika kita ingin mengatur apa saja yang akan di terapkan
dan ingin tahu apa saja kegunaanya silahkan simak langkah-langkah di bawah ini:

1. Plugin Framework Global Settings

Sepertinya pada bagian ini tidak perlu ada yang dirubah. Tapi ada baiknya kalau kita
mengaktifkan pagian Clean up on Deletion. Ini akan menghapus tabel pada
database kita ketika plugin a3 Lazy Load di hapus. Biasanya setiap kita menghapus
plugin belum tentu tabel yang ada pada database ikut terhapus alias tertinggal.

2. Lazy Load Activation

Secara otomatis pengaturan ini akan ON sendiri ketika plugin di aktifkan. Jika kita
mematikan pengaturan ini, maka lazy load tidak berfungsi.

3. Lazy Load Images

Apakah Anda ingin merubah pengaturan ini? sepertinya akan lebih baik jika
dibiarkan seperti defaultnya. Karena itu sudah pengaturan yang paling baik untuk
situs kita. Tapi jika Anda ingin merubahnya tidak masalah.

Pada pengaturan ini kita bisa memilih apa saja yang ingin kita aktifkan atau matikan.

● Enable Lazy Load for Images : Jika ini tidak di aktifkan, maka semua fitur
akan ikut tidak aktif.
● Images in content : Bagian ini akan mengaktifkan lazy load pada konten kita,
misalnya pada halaman posting atau halaman-halaman lainnya.
● Images in Widgets : Bagian ini akan mengaktifkan lazy load pada setiap
widget kita yang memiliki gambar.
● Post Thumbnail : Bagian ini akan mengaktifkan lazy load pada setiap
gambar thumbnail kita atau gambar utama postingan kita.
● Gravatar : Bagian ini akan mengaktifkan lazy load pada setiap gambar
Gravatar. Biasanya ini ada pada setiap komentar-komentar yang
menampilkan foto gravatar setiap pengunjung yang berkomentar pada
postingan kita.
● Skip Images Classes : Secara default bagian text field ini akan kosong.
Biarkan saja seperti itu, atau jika Anda ingin mengisikannya silahkan ikuti
seperti pada contoh yang ada di samping text filed tersebut.
● No Script Support : Ini akan memunculkan pemberitahuan kepada
pengunjung untuk memerintahkan agar mengaktifkan javascript pada browser
jika pengunjung tidak mengaktifkan javascript pada browser nya. Karena jika
javascript pada browser di matikan plugin ini tidak akan bekerja. Tapi jika
pengaturan ini di matikan maka pemberitahuan tidak akan muncul.

4. Lazy Load Videos and iframes

Untuk bagian ini sama dengan yang saya jelaskan pada nomor 3, hanya bedanya ini
untuk video dan iframe.

5. Script Load Optimization

Bagian ini memungkinkan kita untuk mengatur di bagian mana javascript akan di
muat. Untuk optimasi baiknya javascript di muat pada bagian bawah atau footer. Jadi
biarkan saja pengaturanya seperti itu.

6. WordPress Mobile Template Plugins


Defaulnya pada pengaturan ini ON. Jika kita menggunakan plugin WPTouch atau
MobilePress, maka fungsi a3 Lazy Load akan di matikan.

7. Effect& Style

Pada bagian ini adalah untuk mengatur style ketika objek di muat. Anda bisa memilih
sesuai keinginan Anda. Jika memilih SPINNER maka akan muncul animasi loading
berputar ketika objek dalam proses pemuatan dan untuk FADE IN berarrti objek
tampil dengan cara FADE IN.
Optimasi dengan Plugin Litespeed Cache

Sesuai komitmen Dewaweb untuk menjadi layanan cloud hosting kebanggaan Indonesia yang
teraman, tercepat dan terbaik untuk Anda, Dewaweb sudah melakukan deployment LiteSpeed
Cache secara massal di semua server cloud hosting di Jakarta, Singapore, dan USA.

Singkatnya, LiteSpeed Cache (LSCache) adalah module caching super canggih yang akan
membantu meningkatkan kecepatan semua website WordPress, PrestaShop, Magento,
Joomla, dan Drupal yang di-hosting di server Dewaweb. Untuk informasi lebih banyak tentang
LiteSpeed Cache itu sendiri, Anda bisa membaca artikel Mengenal LiteSpeed Cache Plugin
Untuk Mempercepat Website Anda.
Hasil beta testing kami untuk website WordPress sendiri sudah membuktikan bahwa LiteSpeed
Cache Plugin membantu meningkatkan kecepatan loading page dan lebih efisien daripada
plugin cache lainnya (WP Fastest Cache, WP Super Cache, atau W3 Total Cache) terutama
ketika menangani traffic dalam jumlah tinggi.

Nah, di artikel kali ini kami akan membahas lebih dalam tentang LiteSpeed Cache Plugin untuk
WordPress.

Mengapa Menggunakan LiteSpeed Cache Plugin


untuk WordPress?
Ada banyak keuntungan yang bisa Anda dapatkan dengan menggunakan LiteSpeed Cache
Plugin di website WordPress Anda, yaitu:

● Full page caching dilakukan di level server sehingga dapat diproses lebih cepat dan
efisien.
● CSS, JavaScript, atau HTML Minification and Combination
● Browser Cache Support
● Object Cache dengan Redis
● Edge Side Includes (ESI)
● Lazy Load Images
● HTTP/2 Push
● Image Optimization
● Database Optimization
● Dan berbagai fitur canggih lainnya

Bagi Anda yang menggunakan paket hosting Dewaweb, plugin LiteSpeed Cache akan
diaktifkan secara otomatis di website WordPress Anda. Jika belum, Anda bisa menginstal
plugin secara manual melalui WordPress Plugin Directory. Anda bisa membaca artikel kami
untuk tahu bagaimana cara menginstal plugin LiteSpeed Cache di WordPress Anda.

Konfigurasi LiteSpeed Cache Plugin untuk


WordPress
Setelah Anda menginstal dan mengaktifkan plugin LSCache di website WordPress Anda, Anda
mungkin bingung bagaimana cara mengkonfigurasinya? Anda tidak perlu khawatir karena kami
akan membahas bagaimana cara mengkonfigurasi plugin LSCache Anda agar plugin Anda
dapat bekerja dengan optimal.

Setelah Anda mengaktivasi LSCache, Anda mungkin sadar bahwa semua masih di disabled.
Untuk memulai caching, pilih LiteSpeed Cache > Settings > General > Enable LiteSpeed
Cache kemudian pilih Enable.

Sekarang kami akan membahas setiap tab pada pilihan Settings di LSCache untuk
memudahkan Anda mengaturnya.

General

Di tab ini, hal pertama yang bisa Anda lakukan adalah menyalakan dan mematikan caching.
Setting-an lain yang ada pada tab ini digunakan untuk menentukan parameter expire-nya
berbagai jenis konten dalam cache.

TTL (singkatan dari Time to Live) adalah lamanya sebuah halaman akan tetap di-cache
sebelum LSCache menganggap halaman tersebut sebagai expired. Ketika sebuah halaman
sudah mencapai TTL-nya, halaman tersebut akan di-purge atau dihilangkan dari cache. Default
settings dari LSCache sudah dijamin akan bekerja untuk banyak website, tetapi Anda tentu
boleh mengubahnya.
Enable LiteSpeed Cache

Default Setting: Enabled – plugin akan meng-cache halaman website.

Opsi lain:

● Disabled – Menghilangkan cache dari seluruh entri cache yang ada di website
saat ini dan berhenti melakukan caching di waktu yang akan datang.
● Use Network Admin Setting –Menggunakan salah satu dari dua opsi
sebelumnya yang telah dipilih oleh Network Admin. Ini hanya bisa dilakukan di
website dengan multi-site.
Default Public Cache TTL

Setting-an TTL ini mengkontrol kebanyakan halaman di website. TTL yang lain adalah untuk
halaman dan jenis halaman website yang spesifik.

Default Setting: 28800

Constraints: Harus lebih dari 30 detik

Customization: Default value-nya adalah 8 jam. Value lain yang bisa Anda gunakan adalah 1
jam (3600), 1 hari (86400), 1 minggu (604800), atau angka lain yang Anda ingin. Jika website
Anda memiliki halaman yang tidak akan banyak mengalami perubahan, TTL yang lebih lama
akan lebih baik.

Default Private Cache TTL

TTL ini mengatur berapa lama waktu yang dibutuhkan untuk meng-cache halaman private.

Default Setting: 1800

Constraints: Harus antara 60 dan 3600 detik

Customization: Anka defaultnya adalah 30 menit. Waktu paling lama yang bisa Anda masukkan
untuk setting-an TTL ini adalah 1 jam.

Default Front Page TTL

Setting-an TTL ini mengkontrol halaman depan. Perlu diingat bahwa ini bisa dipengaruhi oleh
is_front_page() atau plugin pihak ketiga yang telah memilih untuk menggunakan front page TTL
di salah satu halamannya (misalnya halaman shop WooCommerce)

Default Setting: 1800


Constraint: Harus lebih dari 30 detik

Customization: Default settingnya adalah 30 menit. Halaman utama seringkali menjadi halaman
yang paling sering diupdate. Selain itu, halaman utama juga merupakan halaman yang paling
sering dikunjungi orang-orang. Karena alasan ini, ada baiknya Anda menggunakan TTL yang
lebih pendek waktunya. Tetapi jika Anda tidak terlalu sering mengupdate halaman utama
website Anda, TTL yang lebih lama pun tidak akan menjadi masalah.

Default Feed TTL

TTL yang satu ini mengatur feed website Anda. Feed pada website adalah salah satu hal yang
membantu pengunjung website Anda untuk tetap up-to-date dengan konten-konten di website
Anda, tetapi biasanya mereka membutuhkan interval waktu dalam mengambil data dari blog
Anda. Penarikan data ini dapat menyebabkan loading konstan di server. Melakukan caching
pada halaman feed dapat mengurangi load ini dan LSCache akan melakukan purgin pada
update dan komentara di halaman feed agar tetap up-to-date.

Default Setting: 0 – Jangan cache feeds

Opsi lain:

● Di bawah 30 – Akan diatur ke 30 detik


● Di atas 30 – Akan diatur ke angka yang Anda setting

Customization: Jika feed Anda akan sering diupdate, tidak ada gunanya Anda mengatur TTL
untuk setting-an ini karena berarti cache-nya akan di-purge sesering secara konstan. Jika ada
banyak pengguna yang mengupdate feed, setting ini bisa membantu proses cache.

Default 404 TTL

TTL ini mengatur halaman yang menampilkan hasil 404. Ini bisa jadi sebuah URL random yang
diakses oleh pengunjung website atau 404 intensional. Intinya semua website yang
mengeluarkan hasil 404 akan menggunakan value ini.

Default Setting: 3600

Opsi lain:

● 0 – LSCache tidak akan meng-cache halaman 404


● Di bawah 30 – akan diatur menjadi 30 detik
● Di atas 30 – akan diatur sesuai dengan angka yang Anda masukkan

Customization: Default value nya adalah 3600 atau 1 jam. Sebenarnya, tidak ada lama spesifik
yang disarankan untuk TTL ini karena semuanya tergantung pada websitenya sendiri. Jika 404
adalah hal yang sering terjadi, maka ada baiknya Anda melakukan cache untuk periode waktu
yang sebentar. Jika halaman 404nya memang disengaja, maka ada baiknya Anda melakukan
cache sebuah halaman untuk waktu yang lebih lama karena ini adalah kunjungan yang Anda
tahu akan Anda dapatkan. Salah satu masalah yang mungkin dihadapi adalah ukuran disk.
Karena 404 adalah hasil halaman yang tidak bisa ditemukan, jumlah halamannya bisa tidak
terhitung. Ini bisa mempengaruhi penggunaan disk secara negatif.

Default 403 TTL

TTL ini mengontrol halaman yang menghasilkan halaman 403.

Default setting: 3600

Opsi lain:

● 0 – Tidak mengcache 403


● Di bawah angka 30 – akan diatur ke 30 detik
● Di atas angka 30 – akan diatur sesuai angka yang Anda masukkan.

Customization: Default value untuk TTL ini adalah 3600 atau 1 jam. Hasil 403 memang biasa
disengaja, jadi tidak ada salahnya memiliki waktu TTL yang lebih lama untuk setting-an ini.
Default 500 TTL

TTL ini mengatur hasil 500 Internal Server Error.

Default Setting: 3600

Opsi lain:

● 0 – tidak meng-cache 500 Internal Server Error


● Di bawah angka 30 – akan diatur ke 30 detik
● Di atas angka 30 – akan diatur sesuai angka yang Anda masukkan

Customization: Default value-nya adalah 3600, untuk 1 jam. Error HTTP 500 sendiri memang
lebih parah dibanding 404 atau 403. Melakukan caching untuk halaman ini bisa saja
menghasilkan masalah di website WordPress Anda.

Cache

Tab ini bisa Anda gunakan untuk menentukan jenis konten apa yang ingin Anda cache. Secara
default, semua jenis disamping Object Cache dan Browser Cache sudah langsung nyala. Ini
karena object caching dan browser caching bukanlah fungsi native dari LSCWP, tetapi tipe
caching lain yang memang didukung oleh LiteSpeed. Jika Anda tidak mengerti tentang setting-
an ini, Anda juga bisa menggunakan default setting mereka.
Cache Logged-in Users
Opsi ini digunakan untuk menyajikan logged-in users dengan data dari private cache. Untuk
logged-in users, ini biasanya private atau tidak sama sekali. Ketika ada user yang login, ada
kemungkinan setiap halaman memiliki konten private dan karena itu mereka tidak bisa disajikan
dari cache umum.

Default setting: ON – konten untuk user yang login akan di-cache secara private dengan
session id.

Opsi lain: OFF – logged-in users tidak akan di-cache.

Cache Commenters

Ketika seorang pengunjung website meninggalkan komentar, halaman tersebut akan di-reload.
Setting-an ini mengatur apakah halaman akan disajikan dari cache di saat reloading tersebut.
Opsi ini bisa sangat berguna jika WordPress Anda menggunakan moderation untuk komentar
dari pengunjung website. Menyalakan setting-an ini juga membuat pemberi komentar tidak bisa
melihat komentar mereka yang sedang dimoderasi.

Default Setting: ON – versi yang sudah di-cache akan ditampilkan

Opsi lain: OFF – peninggal komentar tidak akan melihat halaman yang sudah di-cache

Cache REST API

Pilihan ini memperbolehkan Anda untuk melakukan cache pada request yang dilakukan oleh
WordPress REST API. Jika Anda tidak tahu apa itu REST API, maka Anda mungkin tidak
membutuhkannya. Jika Anda tidak menggunakan API, menyalakan caching tidak akan memberi
pengaruh negatif. Jika Anda menggunakan API, menyalakan caching bisa membantu memberi
waktu loading yang lebih cepat.

Default Setting: ON – REST API akan di-cache


Opsi lain: OFF – REST API tidak akan di-cache

Cache Login Page

Opsi ini akan meng-cache halaman login. Biasanya tidak ada alasan untuk mematikan opsi ini.
Jika ada data-data private yang dimunculkan di halaman, ada baiknya Anda menyalakan opsi
ini.

Default Setting: ON – Halaman login akan di-cache

Opsi lain: OFF – Halaman login tidak akan di-cache

Cache favicon.ico

Opsi ini akan melakukan cache pada respon favicon.ico jika file-nya tidak ada. Ini adalah salah
satu pilihan yang berguna karena WordPress me-load setiap kali file favicon.ico tidak
ditemukan.

Default Setting: ON – respon “not found” akan di-cache

Opsi lain: OFF – tidak ada respon yang akan di-cache dan WordPress perlu mengeluarkan
respon “not found” setiap kali halaman diakses.

Cache PHP Resources

Pilihan ini akan meng-cache resources PHP yang di-load oleh tema website. Secara umum, ini
sebenarnya CSS atau sumber daya JavaScript yang dimuat melalui PHP. Dalam banyak kasus,
mereka menyediakan output statis, dan tidak ada alasan untuk memuat PHP setiap saat. Jika
output, pada kenyataannya, dinamis, matikan opsi ini.

Default Setting: ON – PHP Resources akan di-cache


Opsi lain: OFF – PHP Resources tidak akan di-cache

Cache Mobile

Pilihan ini akan memperbolehkan pengguna untuk menampilkan HTML terpisah untuk tampilan
mobile dan desktop. Pemilik website biasa menggunakan ini untuk tema yang tidak responsive,
tetapi mereka juga bisa digunakan ketika theme memuat widget yang berbeda sesuai dengan
jenis browser. Jika Anda menggunakan tema website yang responsive dan tidak ada
perbedaan antara konten yang dikeluarkan dari mobile dan desktop, maka Anda tidak perlu
melakukan cache untuk tampilan mobile yang berbeda.

Default Setting: OFF – Tampilan mobile yang berbeda tidak akan diaktifkan

Opsi lain: ON – Tampilan mobile yang berbeda akan diaktifkan

Catatan: Jika Anda menyalakan caching ini, daftar Mobile View User Agents nya tidak boleh
kosong.

List of Mobile User Agents

Jika Anda menyalakan tampilan mobile yang berbeda, box ini akan dimatikan. Tetapi jika Anda
memilih enabled, Anda perlu memasukkan rewrite-rule-friendly list user agents.

Default Setting: Mobile|Android|Silk/|Kindle|BlackBerry|Opera\ Mini|Opera\ Mobi

Customization: Kemungkinan besar Anda tidak akan perlu mengubah setting ini. Jika Anda
ingin menambahkan user agent lain yang membutuhkan mobile view, tambahkan mereka ke
setting di atas. Setiap agent harus dipisah dengan tanda |.

Private Cached URLs

Terkadang Anda memiliki halaman yang tidak boleh di-cache secara publik, tetapi ok untuk
cache secara pribadi. Daftar URL tersebut di sini. Masukkan path-nya, satu per baris, yang
akan di-cache secara pribadi. LSCache akan memperlakukan path tersebut sebagai string
parsial dan membandingkannya dengan URL.

Untuk membuat pencocokan tepat, tambahkan $ ke ujung jalan, seperti misalnya


/category/marketing$.

Untuk menunjukkan awal path, tambahkan a ^ ke awal jalur, seperti misalnya ^ /categories/
marketing

Contoh:

Category/marketing akan mencocokan dengan /blog/category/marketing/emailmarketing,


category/marketing/contentmarketing, dan category/marketing.

/category/marketing$ hanya akan cocok dengan /category/marketing

^/category/marketing akan cocok dengan /category/marketing/emailmarketing dan


/category/marketing.

Default Setting: String kosong.

Purge

Terkadang, ada situasi dimana Anda ingin melakukan purge ke beberapa halaman sebelum
mereka expire. Section ini memperbolehkan Anda mengatur aturan untuk kegiatan tersebut.
Aturan defaultnya juga sudah bisa dijalankan untuk kebanyakan website.
Purge All on Upgrade

Pilihan ini menunjukkan apakah akan membersihkan semua halaman saat ada upgrade yang
dijalankan pada plugin yang dipasang. Update versi plugin membuat perubahan antar versi,
dan tidak mudah memprediksi apakah perubahan ini akan memengaruhi konten halaman.
Sangat disarankan untuk tidak melakukan perubahan apapun pada pilihan ini.

Default Setting: ON – halaman akan di-purge


Opsi lain: OFF – cache akan tetap sama

Auto Purge Rules For Publish/Update

Ketika seorang penulis menerbitkan atau memperbarui postingan, halaman tambahan dapat
berubah. Daftar kategori, daftar tag, halaman depan blog, dan berbagai arsip juga bisa
berubah. Misalnya, ketika Anda menulis posting baru, kemudian Anda memberikan tag
“brownies,” dan publikasikan dalam kategori “resep”, beberapa halaman akan diperbarui:
halaman homepage, halaman arsip kategori resep, halaman arsip tag brownies, halaman arsip
penulis Anda, dan mungkin beberapa halaman lainnya, tergantung pada tema Anda.

LSCache harus membersihkan semua halaman yang terpengaruh untuk menghindari penyajian
konten yang expire. Pengaturan ini memberi Anda kesempatan untuk menyesuaikan aturan
agar sesuai dengan kebutuhan website Anda.

Ada pilihan untuk All Pages, yang dinonaktifkan secara default. Mengaktifkan ini mengabaikan
semua kotak centang lainnya. Memilih opsi All pages akan masuk akal jika Anda tidak
mengaktifkan ESI dan Anda memiliki widget post-related yang dinamis yang ditampilkan di
setiap halaman. (ESI adalah salah satu opsi lanjutan yang dinonaktifkan secara default.)

Scheduled Purge URLs

Anda dapat memilih untuk menghapus daftar URL secara otomatis pada waktu tertentu. Ini
tidak perlu dalam keadaan normal. Aturan pembersihan canggih LSCWP mampu menangani
sebagian besar situasi. Namun, jika Anda memiliki konten yang dihasilkan oleh sumber luar,
misalnya, Anda mungkin ingin membersihkan halaman yang relevan setiap hari untuk
memastikan konten luar ditampilkan dengan benar.

Default Setting: String kosong

Opsi lain: daftar URL (satu baris satu URL)


Scheduled Purge Time

Gunakan bidang ini bersama dengan yang di atas. Jika Anda telah memberikan daftar URL
untuk dihapus, tentukan seberapa sering mereka harus dibersihkan di kotak ini.

Exclude

Anda mungkin memiliki halaman yang sama sekali tidak ingin Anda cache. Pilihan ini
memungkinkan Anda mengecualikan bagian tertentu dari situs Anda dari cache. Untuk
sebagian besar situs, tidak perlu mengubah pengaturan ini. LiteSpeed menyediakan opsi ini
untuk memungkinkan Anda membuat pengecualian khusus ke aturan cache.
Do Not Cache URLs

Box ini digunakan untuk mendata URL yang tidak perlu di cache. Setiap URL akan
dibandingkan dengan variable REQUEST URL server untuk melihat apakah URL yang Anda
masukkan cocok.

Do Not Cache Query Strings

Anda bisa menghapus URLs dengan query strings tertentu agar tidak di-cache. Masukkan satu
URL per baris. Jika Anda memiliki tema special yang memperbolehkan Anda untuk mengubah
halaman menjadi warna monochromatic hanya dengan menambahkan ?color= query string di
akhir sebuah URL. Anda bisa memasukkan color=purple di bagian Do Not Cache Query String
jika Anda tidak ingin meng-cache halaman dengan warna ungu. Anda juga bisa memasukkan
color= untuk menandakan bahwa Anda tidak ingin meng-cache URL apapun dengan warna
tertentu.

Do Not Cache Categories

Secara default LiteSpeed meng-cache setiap category website Anda. Jika Anda memiliki
kategori postingan yang tidak ingin Anda cache, masukkan category slug yang tidak ingin Anda
cache di box ini.

Category slug adalah string yang biasa digunakan untuk merepresentasikan category di
sebuah URL. Jadi jika Anda memiliki kategori Content Marketing dan URLnya adalah
/category/contentmarketing, maka slug untuk halaman tersebut adalah contentmarketing.

Do Not Cache Tags

LiteSpeed memperlakukan tags sama dengan category: mereka akan di-cache secara default.
Tetapi Anda bisa memasukkan tag slug (satu per baris) di kotak ini untuk tags yang tidak mau
Anda cache.
Do Not Cache Cookies

Jika website Anda menggunakan cookies yang tidak ingin Anda cache, masukkan mereka ke
box ini, satu per baris.

Do Not Cache User Agents

Anda mungkin tidak ingin memasukkan user agent spesifik untuk di-cache. Masukkan namanya
ke box ini, satu per baris.

Do Not Cache Roles

Anda mungkin tidak ingin memasukkan user roles dari caching. Contohnya, jika Anda adalah
admin, dan Anda mengetes fungsi baru, Anda mungkin ingin meng-exclude role administrator
agar tidak di-cache sampai Anda selesai mengetes fungsi barunya.

Bagaimana dengan setting-an lainnya?


Tabs lainnya dimaksudkan untuk pengguna LSCache yang lebih advanced. Tabs ini jatuh ke
dua kategori: settingan yang berhubungan dengan operasional cache LiteSpeed dan settingan
yang berhubungan dengan optimasi website.

Setting-an Optimasi Website:

Optimize

Ada beberapa cara yang bisa Anda lakukan untuk mempercepat website WordPress Anda dan
LSCache mendukung kebanyakan cara tersebut di tab ini seperti misalnya CSS and JavaScript
minification and combination, HTTP/2 push, asynchronous and deferred load. Jika Anda tidak
mengerti apa ini semua, LiteSpeed sudah men-disabled mereka secara default.

Tuning

Tab tuning ini memberi Anda kesempatan untuk mengatur settingan yang Anda pilih di tab
Optimize. Misalnya, Anda mungkin memilih untuk melakukan CSS minification kecuali untuk
salah satu style sheet. Anda bisa memasukkan CSS itu sebagai pengecualian di tab Tuning ini.

Media

Cara lain untuk mengoptimalkan situs Anda adalah dengan membuat gambar dengan sedikit
beban untuk dikirimkan. LSCWP mendukung dua metode untuk mencapai ini: Lazy Load, dan
Image Optimization. Secara default kedua metode ini dimatikan oleh LiteSpeed. Anda dapat
melakukan konfigurasinya di halaman ini.

CDN

Tab ini memungkinkan Anda untuk melakukan konfigurasi Jaringan Pengiriman Konten atau
Content Delivery Network Anda untuk digunakan dengan WordPress. Jika Anda menggunakan
Cloudflare, jangan gunakan opsi ini. Ini dimaksudkan untuk reverse proxy CDN, bukan server
proxy terdistribusi seperti Cloudflare. Secara default pilihan CDN ini memang sudah dinon-
aktifkan. Jadi Anda tidak perlu khawatir.

LiteSpeed Cache Plugin untuk WordPress


Mendukung Object Cache dengan Redis
Seperti yang sudah disebutkan sebelumnya, LSCache untuk WordPress juga mendukung
Object Cache dengan Redis. Berikut adalah cara untuk mengaktifkannya:
1. Login ke cPanel
2. Masuk ke menu Select PHP Versions – pilih versi PHP yang dipakai
3. Enable module Redis dan klik “Save”
4. Login ke WordPress wp-admin
5. Masuk ke menu LiteSpeed Cache – klik Advanced View
6. Masuk ke menu Settings > Cache – Object Cache
7. Set Method -> Redis
8. Klik “Save Changes”

Untuk membaca lebih banyak tentang Object Cache dengan Redis pada LSCache untuk
WordPress, Anda bisa membacanya lebih lengkap di website official LiteSpeed.

Matikan Plugin Caching Lain Jika Anda Menggunakan


LSCache

Jika Anda ingin menggunakan LiteSpeed Cache untuk WordPress, jangan lupa untuk
mematikan plugin caching lainnya. Jika Anda menjalankan beberapa plugin caching di waktu
yang bersamaan, ini malah akan menghabiskan resource di account hosting lebih banyak. Jika
Anda tidak ingin menggunakan LiteSpeed Cache, Anda tinggal disable/uninstall saja dari
WordPress.

Ada beberapa fitur dan settings advanced di plugin LiteSpeed Cache yang belum tentu cocok
untuk semua website WordPress. Kalau website kamu broken, silahkan non-aktifkan fitur
advanced tersebut dan lakukan Purge All Cache. Untuk panduan lengkapnya, Anda bisa
membaca panduan troubleshooting LSCache untuk WordPress di website LiteSpeed.

Simpulan

Nah sekarang Anda sudah selesai menginstal dan mengkonfigurasi semuanya, Anda tinggal
duduk santai dan menikmati website dengan waktu loading cepat. Di artikel ini, kami sudah
membahas bagaimana Anda bisa mengkonfigurasi LiteSpeed Cache Plugin for WordPress.
Jika Anda masih memiliki pertanyaan, jangan sungkan untuk meninggalkan komentar di kolom
komentar di bagian bawah artikel ini. Semoga artikel ini bermanfaat dan membantu Anda dalam
melakukan konfigurasi LSCache untuk WordPress. Kami juga akan terus membahas panduan
konfigurasi LiteSpeed untuk CMS-CMS lainnya, jadi ditunggu ya!

Cara Optimasi WordPress di GTMetrix


Plugin ini menangani masalah optimasi terutama pada front-end code saja. Jika situs Anda
masih membutuhkan waktu lama untuk memuat, perhatikan lebih lanjut spesifikasihardware
server yang digunakan untuk hosting anda.
Catatan : Anda harus memahami HTML, CSS, dan JSC dalam editor template wordpress
anda. Karena perubahan terdapat dalam code template anda. Perubahan ini dilakukan otomatis
dengan bantuan Plugin.
Opsional *** Langkah Pertama *** Unduh dan mengaktifkan GTmetrix untuk WordPress
Gunakan plugin ini untuk mendapatkan gambaran kinerja WP Anda .

Masukk
an Anda GTmetrix API key
Setelah Anda menginstal, memasukkan API key Anda dari akun GTmetrix Anda di halaman
Pengaturan ( Anda harus terdaftar gtmetrix untuk menghasilkan kunci API ) .
Uji
Front Page Anda
Setelah ini dilakukan , lihat “Tests” dan “Latest Front Page Score” modul , klik “Test your Front
Page now” tombol .

Laporan akan dihasilkan dengan PageSpeed dan nilai YSlow untuk halaman depan situs
WordPress Anda . Ini adalah kinerja sebelum Anda .
Download dan aktifkan W3 total cache
Anda akan melihat bagian baru di sidebar admin Anda disebut “Performance.”
a) Pada sidebar , klik pada “General Settings” sub-section..
Di bawah ” General , ” Periksa ” Beralih semua jenis caching atau menonaktifkan sekaligus.”
W3 Jumlah Cache : Beralih Semua
Sejak W3 Jumlah Cache akan menyalakan semua fitur caching , ada beberapa yang mungkin
tidak berlaku bagi Anda . Yang umum adalah CDN dan fitur CloudFlare . Jangan centang
“Enable” pada fitur ini jika Anda tidak memilikinya .
Pada opsi bernama Minify mode . Pilih opsi Auto .

W3
Jumlah Cache : Set Auto Mode untuk Meminimalkan
Klik Save all settings.
Catatan : Jika Anda membuat perubahan pada plugin WordPress Anda, plugin W3 Total Cache
mungkin meminta Anda untuk Kosongkan Cache (Empty the Cache). Hal ini dilakukan untuk
memastikan plugin tidak melayani versi cache dari file yang berubah .
b ) Pada sidebar , klik pada Minify sub-section.
Dalam HTML & XML , periksa Aktifkan dalam pengaturan minify HTML . Anda juga dapat
memeriksa pilihan lain , tetapi pastikan untuk menguji situs Anda untuk melihat jika rusak .
W3 Jumlah Cache : Aktifkan HTML & XML minification .
c ) Pada sidebar , klik pada Browser Cache sub-bagian .
Di bawah General , Cascading Style Sheets & JavaScript , HTML , dan Media & File Lainnya
aktifkan :
● Set expires header
● Set cache control header
● Set entity tag (eTag)

W3 Jumlah Cache : Aktifkan Opsi Browser Cache


Klik Save all settings.
Langkah 2 ) Download dan aktifkan WP Smush.it
Plugin ini akan mengoptimalkan setiap gambar yang Anda upload selanjutnya karena Anda
diaktifkan .

WP –
Smush.it di Perpustakaan Media
Tidak ada pilihan untuk plugin ini dan tidak ada yang mengatur !
Dalam versi terbaru dari WP Smush , ada fitur Smush.it Massal yang dapat Smush semua
gambar yang diupload . Sistem ini bekerja untuk kami di media perpustakaan kecil dan sangat
nyaman , namun itu adalah eksperimental. Itu saja ! dan selesai .
Langkah 3 ) Menganalisis situs Anda
Menganalisis situs Anda lagi (via GTmetrix.com atau dengan plugin ) dan melihat perbedaan
dalam kinerja !
ringkasan
Telah banyak pengujian dan eksperimen untuk menemukan solusi terbaik bagi pengguna
WordPress . Plugin ini dasar benar-benar dapat meningkatkan kinerja sebuah blog WordPress .
Lihatlah perbedaan dalam blog anda :
Perbaikan blog kita

Lihat laporan perbandingan di sini


Jika Anda memiliki blog WordPress , lambat atau tidak , memberikan plugin ini mencoba dan
meningkatkan pengalaman pengguna Anda !
Optimasi Web
WordPress untuk Dapat
Skor PageSpeed A dan
YSlow A di GTmetrix
Kecepatan website merupakan faktor utama dalam SEO yang harus
kita prioritaskan untuk diperhatikan, terlebih sekarang ini dimana
dunia seo yang lebih kompetitif. Jika web anda lebih lambat dari
kompetitor bisa menurunkan skor dimata google, yang
memungkinkan anda tidak dapat peringkat bagus di google search
dan search engine lainnya.

Anda perlu mengecek web anda di Gtmetrix.com, dan lihat berapa


skor yang anda dapatkan.

Jika hasilnya mengecewakan ada baiknya anda ikuti langkah langkah


yang sudah saya lakukan ini, terbukti meningkatkan skor yang
sebelumnya E D, menjadi A A
5 langkah sederhana yang saya lakukan saya jabarkan dibawah ini,
hanya untuk anda, check this out! (Sebelumnya pastikan selalu
backup dulu web wordpress anda sebelum anda mengedit sesuatu,
untuk menghindari hal hal yang tidak diinginkan, untuk cara backup
bisa baca disini cara backup wordpress)

#1 Mengaktifkan gzip
compression
Langkah pertama yang harus anda lakukan adalah mengaktifkan gzip
compression.

Caranya buka cpanel, masuk ke file manager lalu ke tempat dimana


file wordpress anda berada. Lalu edit file .htaccess

Tambahkan kode dibawah ini untuk mengaktifkan gzip compression.


# enable gzip compression
<IfModule mod_deflate.c>
# Compress HTML, CSS, JavaScript, Text, XML and fonts
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE font/opentype
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/xml

# Remove browser bugs (only needed for really old browsers)


BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent
</IfModule>

#2 Menambahkan expires
headers
Langkah selanjutnya kita harus menambahkan expires headers di
file .htaccess
buka lagi file tadi edit dan tambahkan kode dibawah

#add expires headers


<IfModule mod_expires.c>
# Enable expirations
ExpiresActive On
# Default directive
ExpiresDefault "access plus 1 month"
# My favicon
ExpiresByType image/x-icon "access plus 1 year"
# Images
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
# CSS
ExpiresByType text/css "access plus 1 month"
# Javascript
ExpiresByType application/javascript "access plus 1 year"
</IfModule>

#3 Me-merger dan juga


meminimalkan ukuran
css-javascript
Langkah ketiga anda perlu menyatukan file css dan javascript lalu
meminimalkan ukuran file nya. Anda bisa melakukannya dengan
bantuan plugin.

Plugin yang saya rekomendasikan adalah plugin Merge + Minify +


Refresh anda bisa cari dengan kata kunci tersebut atau bisa unduh
dari link yang saya tautkan dan menguploadnya manual ke path wp-
content/plugins
Install dan aktifkan maka plugin ini akan otomatis menyatukan file-file
css dan javascript yang ada dan meminimalkan file sizenya.

#4 Tambahan: Menghapus
stats analytics berlebih
(tinggalkan satu saja)
Tiga langkah diatas jika sudah dilakukan sudah merubah skor
gtmetrix anda secara signifikan, jika ingin lebih lagi anda bisa cek web
anda apakah anda menggunakan statistik tracker di web anda lebih
dari satu? Misalnya google analytics, wordpress stats by jetpack dan
juga histats.

Jika iya baiknya saya sarankan hapus dan tinggalkan satu stats
tracker saja, dalam kasus ini saya memilih untuk menggunakan
google analytics saja. Kenapa begitu? Karena setelah dicek histats
misalnya dia menyisipkan banyak tracker lain yang fungsi sebenarnya
itu mengambil data kita untuk keperluan dia, tanpa sepegetahuan kita.

Kode dibawah menunjukkan script tracker/pixel lain yang disisipkan


histats kedalam web kita,

Hal ini saya ketahui setelah saya menghapus script tracker histats
maka hilang pula url redirects diatas.

Jika anda merasa keberatan dengan adanya ini maka ada baiknya
anda hapus kode tracking histats dari web anda, yang keuntungan
lainnya juga dapat menambah skor gtmetrix web anda. Disamping itu
juga saya menghapus plugin jetpack yang sebelumnya juga saya
gunakan untuk mencatat statistik pengunjung. Alhasil saat ini saya
putuskan cukup hanya memakai google analytics saja sebagai
pencatat stats visitor.

#5 Tambahan: Menghapus
plugin font / gunakan font
default
Cek web anda apakah theme anda mengambil font dari luar untuk
settingan font nya. Jika iya ada baiknya pula anda hapus karena
dengan meload font dari luar semisal googlefont atau font service
lainnya membutuhkan waktu untuk meload font nya di webpage anda.

Anda mungkin juga menyukai