7 Cara Mempercepat Loading Page Website Pada WordPress

WordPress adalah salah satu cms (Content Management System) terbaik yang digunakan untuk membuat website dengan tujuan tertentu. Sama seperti website Engine Y yang menggunakan cms wordpress, banyak website yang terkenal juga menggunakan cms wordpress seperti hipwee, techinasia, mozila blog, dan lain lain.

Developer wordpress pun giat mengupdate teknologinya dari sisi front end maupun backend, website ini pun baru saja di upgrade ke wordpress versi terbaru. Semakin banyak post dan semakin banyak plugins yang digunakan tentu memiliki drawback kepada website, salah satu drawbacknya adalah loading page website kita akan terasa semakin berat seiring banyaknya post, plugins, trafik dan lain lain. Atas dasar alasan tersebut kali ini Y akan sharing tentang apa saja yang saya perbuat untuk membuat loading page lebih cepat.

Alasan mengapa loading website harus cepat

Website dapat diibaratkan sebagai sebuah toko yang menyediakan apa yang dibutuhkan oleh pelanggan. Ketika toko memiliki pelayanan yang cendrung lambat, maka para pelanggan lambat laun akan merasa kesal karena tidak dilayani dan akan kapok ke toko tersebut dan mencari toko lain.

Selain itu kecepatan website juga mempengaruhi SEO dari website kita. Karena mesin pencari lain juga memasukkan kecepatan website ke dalam algoritmanya untuk menilai website tersebut dalam Peningkatan Rangking di hasil pencarian dari sebuah website.

7 Cara Mempercepat Loading Page Website Pada Wordrpress

Berdasarkan pengalaman, hasil research, dan hipotesa saya akan berbagi tentang 7 cara yang saya lakukan untuk menjaga kecepatan loading website dalam level yang masih wajar. Dan berikut Y merangkumnya dalam 7 Cara mempercepat loading page website pada wordpress. Walaupun dalam post ini lebih dikhususkan pada wordpress, sebenarnya di cms dan platform lain juga menyediakan cara alternatif untuk diterapkan.

#1. Cache

Sadarkah kalian, ketika masuk ke dalam suatu website, loading website pertama kali anda masuk ke website tersebut akan lebih lama dibanding anda masuk untuk kedua kali dan seterusnya ? Loading page pertama kali akan disimpan ke dalam suatu penyimpanan yang disebut cache. Cache inilah yang akan digunakan untuk loading page selanjutnya.

Mengacu pada wikipedia,

Tembolok (Inggris: ‘cache’) dalam teknologi informasi adalah mekanisme penyimpanan data sekunder berkecepatan tinggi yang digunakan untuk menyimpan data / instruksi yang sering diakses. Memori cache dimaksudkan untuk memberi kecepatan memori yang mendekati memori yang paling cepat yang bisa diperoleh, dan pada waktu yang sama menyediakan kapasitas memori yang besar dengan harga yang lebih murah dari jenis-jenis memori semikonduktor.

Sebenarnya secara default, browser kita sudah dilengkapi oleh cache. Sehingga loading pada saat pertama kali akan terasa lebih lama, namun loading selanjutnya akan lebih ringan. Namun, browser menghandle cache dari sisi front end (javascript dan css), pada sisi backend terdapat beberapa plugins yang mendukung cache dari sisi server, contohnya wp total cache, wp super cache, wp rocket, dan lain lain.

Link download: wp total cache, wp super cache, wp rocket

#2. Image Optimization

Sering kali saya melakukan blog walking menemui blog yang sangat berat pada saat melakukan load gambar. Cara yang biasa kalian lakukan untuk melakukan optimisasi pada gambar adalah dengan mengkompressnya satu per satu. Salah satu tools untuk mengkompres image adalah tools dari yahoo yaitu smush.it. Namun bagaimana jika ada suatu plugins yang dengan otomatis akan mengkompress gambar kalian tanpa mengurangi kualitas ? Well, that’s it WP Smush it,

Wp smush it ada 2 versi yang berbayar dan free, namun yang free sudah cukup untuk mengoptimisasi gambar kita. Tidak ada alasan untuk tidak menginstall plugins ini 🙂

Link download : wp smush it

#3. Database Optimization

Mengacu pada wikipedia,

Pangkalan data atau basis data (bahasa Inggris: database) adalah kumpulan informasi yang disimpan di dalam komputer secara sistematik sehingga dapat diperiksa menggunakan suatu program komputer untuk memperoleh informasi dari basis data tersebut. Perangkat lunak yang digunakan untuk mengelola dan memanggil kueri (query) basis data disebut sistem manajemen basis data (database management system, DBMS).

Semakin banyak post, plugins, page, dan semua yang berhubungan dengan konten pasti akan memberi drawback kepada database kita. Semakin popular website kita dan semakin banyak pengunjung, maka akses database akan sering terjadi.

Namun dari semua konten terkadang ada yang sebenarnya sudah kita tidak pakai lagi, contohnya saja revisi, setiap kali kita menekan tombol update pada post, maka data dalam database kita akan bertambah. Maka itu lah fungsi dari plugins wp optimize. Plugin ini memungkinkan kalian melakukan hanya satu tugas sederhana: mengoptimalkan database Anda (spam, pasca revisi, draft, tabel, dll) untuk mengurangi overhead pada database wordpress anda. Plugin ini adalah gratis dan sangat membantu Anda dalam optimasi database. Jika kalian sudah menginstall plugins ini kalian akan merasakan betapa otomatisnya plugins ini tinggal 1 x klik saja sudah selesai.

Link download: wp optimize

#4. Limit your Revision post

Sebenarnya fitur membatasi revisi post sudah ada dalam wordpress, hanya saja fitur ini sering kali terlupakan. kalian dapat membatasi revisi post menjadi 2 atau 3 revisi. Karena setiap kali kalian melakukan edit dan update pada postingan, maka akan tersimpan di dalam database, dan itu akan memberi drawback ke database WordPress kita, untuk menanggulangi hal itu kalian hanya cukup menuliskan sebaris code pada wp config.

define ( ' WP_POST_REVISIONS ', 3 ) ;

#5. Lazyload at Image

Ketika kalian masuk ke suatu website, maka semua komponen (gambar, javascript, css) dalam website akan terload dan website akan dapat dilihat. Lazyload adalah cara untuk memotong proses load pada gambar, sehingga gambar akan diload ketika pengguna melihatnya / scroll ke gambar tersebut saja. Dengan cara ini website tak perlu meload semua gambar yang belum terlihat oleh user.

Hal ini tidak hanya akan mempercepat load website kalian juga dapat menghemat bandwidth dengan memuat sedikit data (dalam hal ini gambar) bagi pengguna yang tidak menscroll semua halaman ke bawah pada halaman web kalian.

Untuk melakukan hal tersebut Andrew Ng membuat suatu plugins lazyload dalam bentuk jquery yaitu Jquery Image Lazy Load. Cara settingnya pun sangat mudah.

Link download: Jquery Image Lazy Load

#6. Edit .htaccess

file .htaccess adalah file text sederhana (dalam format ascii). Pada umumnya kita bisa menggunakan file .htaccess untuk merubah beberapa konfigurasi untuk mengarahkan pada web server apache. File .htaccess dapat ditaruh dimana pun pada folder website anda.

.htaccess ini merupakan file yang cukup kuat yang dapat mengatur behaviour website kita. Berikut beberapa hal yang dapat kita lakukan untuk melakukan optimisasi dengan mengedit .htaccess.

a. menonaktifkan hotlinking dan leeching konten anda

Hotlinking adalah bentuk “pencurian” bandwidth . Hal ini terjadi ketika website lain link langsung ke gambar di website kalian dari artikel mereka membuat beban server Anda semakin tinggi. Cara hotlinking biasanya dengan a href image source.

Hal ini dapat bertambah karena semakin banyak orang “mengikis” posting kalian atau website kalian (dan terutama gambar) menjadi lebih populer , seperti harus dilakukan jika kalian membuat gambar kustom untuk website kalian secara teratur.

RewriteEngine on

RewriteCond %{HTTP_REFERER} !^$

RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?nginy.net [NC]

RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.com [NC]

RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?feeds2.feedburner.com/nginy [NC]

RewriteRule \.(jpg|jpeg|png|gif)$ – [NC,F,L]

Kalian akan melihat feed saya ( dari FeedBurner ), kalian harus menggantinya dengan nama feed kalian , jika tidak maka gambar kalian tidak akan ditampilkan dengan benar .

b. tambahkan expires header dengan static resource

Expires header adalah cara untuk menentukan waktu yang cukup jauh dimuatan pengunjung berikutnya sehingga ( browser) pengunjung tidak perlu kembali mengambil konten statis (seperti file css , javascript , gambar dll). Cara kerjanya mirip dengan cache pada browser.

Dengan menambahkan code ini di htaccess

ExpiresActive On

ExpiresByType image/gif A2592000

ExpiresByType image/png A2592000

ExpiresByType image/jpg A2592000

ExpiresByType image/jpeg A2592000

Pada umumnya, jika kalian sudah menambahkan plugin cache, maka plugin tersebut akan mengoverwrite htaccess, namun untuk lebih jelas bisa di check langsung di htaccess kalian 🙂

c. disable pingbacks dan trackbacks

Secara default, wordpress berinteraksi dengan website lain dengan pingbacks dan trackbacks. Setiap kali blog lain mengkaitkan website kalian , itu akan memberitahuwebsite Anda, yang pada gilirannya update data pada post.

Mematikan ini tidak akan menghancurkan backlink ke situs website. Dengan cara ini beban ke server akan terkurangi.

Cara nya cukup mudah cukup menu settings -> discussions -> hilangkan centang pada Allow link notifications from other blogs (pingbacks and trackbacks) on new articles.

Cloudflare merupakan salah satu cdn (content delivery network) yang berperan sebagai penengah antara domain dan web hosting. Mengapa cloudflare mempercepat loading website ? Karena cloudflare menyediakan fitur cache, lagi — lagi kita ketemu dengan kata cache. Sebenarnya cloudflare tidak hanya berfungsi sebagai cache dan mempercepat website banyak kelebihan lain menggunakan cloud flare.

Cara pasangnya pun sangat — sangat mudah. Seorang developer wordpress pun menyediakan pluginsnya, dan untuk installasi kalian dapat daftar di sini.

Sedikit berbagi pengalaman, awalnya saya tidak mengetahui apa itu cloudflare. Pada awalnya website saya sering sekali muncul “site cannot be reach” namun setelah memakai cloud flare, jarang sekali terjadi hal seperti itu. Dan yang awalnya website saya menggunakan apache berubah menjadi nginx. Dimana nginx dipercaya memiliki banyak kelebihan dibanding apache. Cloud flare bagi saya salah satu yang wajib dilakukan pertama kali setelah membuat wordpress 🙂

Sekian post saya tentang 7 Cara Mempercepat Loading Page Website Pada Wordrpress. Semakin banyak konten dari suatu website tentang berbanding lurus dengan performance website tersebut. Adalah suatu kewajiban sebagai developer untuk meningkatkan konten dan menjaga performance website. Tentunya masih banyak cara untuk menjaga performance website diantara menggunakan server search seperti solr search / elastic search, server cache seperti redis, menggunakan database nosql seperti mongo db. Namun untuk tahap ini saya masih belum merasa harus menggunakannya karena menurut saya pribadi terlalu over engineer jika harus menyewa server untuk kondisi website ini.

“When people say you can’t do it ― that it’s impossible ― never lose hope. Just because they couldn’t doesn’t mean you can’t.” David Copperfield

Originally published at nginy.net on April 2, 2017.