Checklist Optimasi Website Yang Sering Dilupakan

Checklist Optimasi Website Yang Sering Dilupakan. Checklist merupakan hal yang penting dalam optimasi website. Terkadang kita lupa untuk mengoptimasi beberapa hal yang seharusnya dioptimasi dalam website. Dalam artikel ini saya akan memberikan Checklist Optimasi Website Yang Sering Dilupakan.

Checklist Pertama : Menyiapkan Gambar Yang Sesuai dengan Ukurannya

Banyak sekali website yang saya temui tidak mengukur gambar dengan tepat. Biasanya menggunakan gambar dengan ukuran yang besar. Hal ini dapat mengurangi performa dalam website. Jika Anda menggunakan ukuran yang tepat, akan menghemat banyak ukuran.

Sebelum masuk ke website biasanya saya mengolah gambar terlebih dahulu. Saya biasa menggunakan Adobe Photoshop untuk mengolah gambar, agar sesuai dengan ukuran website.

Saya menggunakan alat bantu untuk mencari ukuran yang sesuai. Saya menggunakan Calculator Aspect Ratio untuk mencari ukuran yang paling sesuai. Saya juga memiliki pakem-pakem tertentu dalam ukuran. Jika saya ingin membuat Hero Section biasanya saya menggunakan ukuran 1366x768px (lebar x panjang). Tidak terlalu besar dan tidak terlalu kecil.

Ukuran tadi berdasarkan atas resolusi layar monitor. Yang tampil adalah gambar background penuh untuk menutup hero section. Jika Anda ingin membuat ukuran yang tidak penuh pastikan tinggi gambar tidak lebih dari 768px biasanya saya menggunakan 400px hingga 550px (tergantung kebutuhan)

Checklist Kedua : Mengoptimasi Gambar

Saya lebih menyarankan untuk tidak menggunakan plugin dalam mengoptimasi gambar. Pasalnya ada beberapa plugin yang menggunakan Javascript tambahan. Meskipun ukuran gambar berkurang tapi ada beberapa Javascript baru yang muncul. Dan juga dalam beberapa plugin menduplikasi gambar sehingga ruang penyimpanan hosting Anda akan berkurang drastis.

Ada dua tools yang biasa saya gunakan untuk mengoptimasikan gambar

  1. Website Planet
  2. Tinypng atau Tinyjpg

keduanya, memiliki nilai kompresi yang berbeda. Jika Anda membutuhkan kompresi yang besar gunakan Website Planet. Jika Anda ingin mengompresi tetapi output yang dikeluarkan memiliki kualitas tinggi tetapi ukuran lebih besar dibandingkan Website Planet maka gunakan Tinypng atau Tinyjpg.

Checklist Ketiga : Memilih Plugin yang tepat

Plugin juga mempengaruhi performa dari website. Jika Anda menggunakan terlalu banyak plugin akan berdampak pada performa website Anda. Plugin biasanya akan memunculkan beberapa elemen tambahan baik CSS maupun Javascript. Pada beberapa plugin tidak opsi khusus untuk menon-aktifkan beberapa elemen pada halaman yang tidak menggunakan plugin tersebut.

Selain mempengaruhi performa website. Terlalu banyak plugin juga berdampak pada CPU Usage pada hosting.

Komparasi Plugin Form WordPress
Komparasi Ukuran Plugin Form

Pilih plugin yang benar-benar ringan. Sebagai contohnya memilih plugin form ada berbagai macam opsi yang bisa Anda pilih. Pastikan kebutuhan Anda terlengkapi pada plugin tersebut. Tabel diatas membantu untuk melihat ukuran dalam kilobytes(kb) baik Javascript (JS) maupun CSS.

Checklist Keempat : Merapikan Database

Kebanyakan kita lupa untuk membersihkan database. Meskipun cukup kecil pada ukurannya, jika kita memiliki website yang lebih besar akan berdampak pada kecepatan website. Biasanya setelah menghapus plugin, ada beberapa data yang masih tersisa di dalam database.

Yang kedua cek Revisions. WordPress Revisions merupakan salah satu fitur yang dimiliki oleh WordPress dengan fitur yang dapat menyimpan revisi pada website Anda. Semisal sewaktu-waktu Anda ingin mengembalikan lagi hasil kerja Anda. Akan tetapi, jika Anda sudah merasa tidak ada revisi atau mengulang kembali. Pastikan untuk menghapusnya. Karena akan mempengaruhi dari performa website Anda.

Draft yang sudah tidak digunakan jangan lupa untuk dibersihkan.

Ada plugin yang membantu kita dalam mencari database mana yang tidak kita pakai kembali.yaitu WP-Optimize. Biasanya saya menggunakan Swift Performance Pro karena memiliki fitur yang sama untuk menghapus database yang tidak digunakan kembali. Menggunakan WP-Optimize merupakan opsi gratisan terbaik. Jangan lupa untuk backup website Anda. Semisal sewaktu-waktu ada hal yang penting ingin Anda munculkan kembali.

Checklist Kelima : Memilih Tema yang Ringan

WordPress memiliki berbagai macam tema yang dapat dipilih. Jika Anda menggunakan Pagebuilder atau Site Builder pastikan Anda menggunakan tema yang ringan. Tema sendiri juga membawa beberapa CSS maupun Javascript yang tersedia.

Checklist Keenam : Gunakan Plugin Optimasi Yang Komplit

Plugin optimasi hanya membantu Anda yang tidak biasa dalam hal optimasi. Jika ingin mendapatkan kecepatan website yang baik. Jangan berlebihan dalam menggunakan plugin. Plugin optimasi bersifat opsional, hanya diperuntukkan untuk Anda yang tidak terbiasa otak-atik backend atau tidak mau ribet.

Banyak saya temui dari beberapa klien saya menggunakan 2 atau lebih plugin optimasi. Hal ini tentu tidak baik, bahkan bisa membuat website Anda lemot dan bahkan bisa merusak website Anda.

Pastikan Anda menggunakan satu plugin optimasi yang komplit

Plugin Optimasi yang komplit ini memiliki berbagai macam fitur untuk optimasi website. Mulai dari mengecilkan Javascript, CSS, HTML, Caching yang sesuai dengan kebutuhan Anda dan lain sebagainya.

Saya merekomendasikan beberapa plugin optimasi untuk Anda.

  1. Swift Performance Pro (Berbayar)
  2. Swift Performance Lite (Gratis)
  3. Litespeed Cache
  4. WP-Rocket (Berbayar)

Plugin diatas saya rekomendasikan berdasarkan pengalaman saya dalam mengoptimasi website. Saya lebih memilih Swift dibandingkan WP-Rocket karena Swift lebih kaya fitur dibandingkan dengan WP-Rocket. Selain fitur yang diberikan berlimpah, Swift Performance memiliki output yang lebih baik dibandingkan dengan WP-Rocket.

Litespeed Cache juga menjadi pilihan yang baik untuk Anda yang menggunakan server Litespeed. Jika Anda tidak ingin yang berbayar pilih salah satu diantara dari Swift Performance Pro atau Litespeed Cache. Karena hasil keduanya tidak jauh berbeda.

Adapun Panduan Lengkap Swift Performance Pro 2020 bisa Anda kunjungi dan bisa Anda pelajari bagaimana cara mengoptimalkan Swift Performance Pro maupun yang Lite.

Checklist Ketujuh : Menggunakan PHP Versi Terbaru

Checklist yang sering dilupakan adalah menggunakan PHP terbaru. Semakin baru versi PHP semakin cepat dalam memproses data. Perbedaan PHP 7.2 dengan PHP 7.3 sebesar 30%. Selain faktor kecepatan dalam memproses data, versi PHP terbaru juga lebih aman dibandingkan versi-versi sebelumnya.

Sebelum melakukan pembaruan terhadap versi PHP pastikan untuk mengecek kembali apakah plugin maupun tema support dengan versi PHP terbaru.

Panduan Lengkap Swift Performance Pro 2020

Panduan Lengkap Swift Performance Pro dan juga settingan yang terbaik untuk Anda. Kecepatan Website merupakan indikator yang utama pada SEO (Search Engine Optimatization). Terlepas dari SEO pula, tentu Anda sebagai user sangatlah kecewa ketika Anda mengunjungi website yang lemot. User akhirnya keluar dari website yang lemot karena konten tidak segera muncul. Tentu sangat merugikan Anda, jika Anda memiliki website lemot.

Swift Performance Pro merupakan plugin caching berbayar terbaik menurut saya. Fitur yang ditawarkan lebih beragam dan bervariasi dibandingkan dengan kompetitornya yaitu WP Rocket. Canggihnya, plugin caching ini dapat menyesuaikan dengan webserver yang Anda pakai, builder yang Anda pakai, dan beragam opsi lainnya yang bisa Anda lakukan. Tidak hanya sebagai plugin caching yang memiliki kemampuan untuk minify javascript, css, dan html. Swift Performance Pro dapat melakukan Optimatisasi gambar meskipun tidak sebaik Shortpixel dan Optimole.

Jika Anda memiliki masalah :

Sayangnya, opsi yang beragam dari Swift Performance Pro ini terkadang membingungkan pengguna untuk menyesuaikan ke website pengguna. Oleh karena itu dalam tulisan saya kali ini, saya akan memberitahukan fitur-fitur dan opsi mana yang harus diaktifkan untuk Anda pada artikel Panduan Lengkap Swift Performance Pro 2019. Saya juga memberikan cara setting swift performance 2019 yang terbaik untuk Anda.

Saya akan membagi dua opsi settingan yang satu adalah Setup Simple dan yang Kedua Setup Detail. Saya menggunakan web server Litespeed dengan versi PHP 7.2, Memory Limit 256M, dan Versi WordPress 5.3.

Settingan ini berdasarkan dari beberapa artikel, kemudian saya modifikasi dan akhirnya menemukan settingan Swift Performance yang paling baik.

Panduan Lengkap Swift Performance Pro 2019

Setup Simple

Buat Anda yang tidak mau ribet ini opsi yang paling cepat untuk Anda. Tidak butuh waktu yang lama, tapi saya tidak menjamin optimatisasi ini tidak sebaik dibandingkan Setup Detail.

  1. Install Swift Performance Pro, kemudian masukkan lisensi Anda. Kemudian ada beberapa opsi pilihan. Saya sarankan untuk menggunakan Manual Configuration.
  2. Klik Advanced View pada opsi kanan atas plugin Swift Performance Pro
  3. tab General - General Aktifkan Compute API.
  4. tab Media - Images Aktifkan Lazy Load Images.
  5. tab Media - Embeds Aktifkan Youtube Smart Embeds dan Lazy Load Iframes.
  6. tab Optimization - General Non aktifkan Optimize Prebuild Only (di beberapa website saya mengaktifkan opsi ini) dan Fix HTML (fungsi ini bisa Anda aktifkan jika Anda menggunakan tema yang kurang baik. Jika Anda menggunakan tema oleh developer terpercaya seperti Hello Themes by Elementor, Astra, Ocean WP non-aktifkan fitur ini).
  7. tab Optimization - Scripts Aktifkan Merge Scripts (dalam beberapa kasus Anda bisa menggunakan fitur ini jika Anda menggunakan plugin yang menggunakan JS Anda perlu membaca di setup detil dibawah).
  8. tab Optimization - Styles Aktifkan Merge Style (Jika Anda menggunakan CDN seperti Cloudflare, Stackpath (Max CDN), BunnyCDN, dan Content Delivery Network lainnya non-aktifkan opsi ini).
  9. tab Caching - General Pilih Disk Cache Rewrites pada Caching Mode, kemudian untuk Cache Expiry Mode pilih Time Based Mode. Jika Anda memiliki banyak konten seperti Anda memiliki blog saya lebih menyarankan menggunakan Action Based Mode.
  10. tab Caching - Warmup Pilih Unlimited untuk Prebuild Speed.
  11. tab Woocommerce Aktifkan Cache Empty Cart, Non-aktifkan Disable Cart Fragment. dan Non-aktifkan Woocommerce Session Cache (BETA).
  12. Kemudian Save Changes dan Clear Cache.
  13. Kemudian lihat di Dashboard tunggu beberapa saat. Apakah Prebuild Cache benar-benar berjalan. Tunggu beberapa menit kemudian refresh halaman Swift Performance PRO.

Lihat perubahan kecepatan website Anda pada GTMetrix bagaimana perbedaannya sangat jauh sebelum Anda menggunakan Swift Performance PRO. Maka dari itu Panduan Lengkap Swift Performance Pro 2019 dibuat untuk memudahkan Anda dalam mengenal plugin cache terbaik ini dan juga setting swift performance pro.

Panduan Setup Detil

Tahap #1 - Install Swift Performance PRO

Panduan Lengkap Swift Performance Pro 2019

Panduan Lengkap Swift Performance Pro 2019 harap dibaca baik-baik coba trial dan error jika ada kendala tulis di kolom komentar saya senantiasa membantu Anda.

Swift Performance PRO membutuhkan beberapa requirements. Tapi meskipun beberapa kebutuhan yang harus terpenuhi ini belum bisa Anda penuhi. Anda masih bisa menggunakan Swift Performance PRO. Beberapa kebutuhan itu adalah :

  1. Apache Module - mod_deflate, mod_filter, mod_setenvif (ketiga modul ini biasanya sudah teraktifkan pada webserver Anda)
  2. Loopback - Fungsi ini dibutuhkan oleh Swift Performance PRO dan biasanya sudah otomatis terinstall di website Anda, jika Anda ingin mengaktifkannya Anda harus meminta kepada penyedia hosting Anda untuk mengaktifkan ini.
  3. Rest API - Fungsi ini digunakan untuk membaca API pada beberapa kasus mod_security memblokir REST API dan Loopback sehingga Anda tidak dapat menggunakan Use Compute API dan menggunakan fitur Optimatisasi gambar.

Module yang paling berpengaruh itu pada REST API dan Loopback. Biasanya kebanyakan Shared Hosting sudah memilikinya dan automatis aktif. Pada beberapa VPS tidak teraktifkan maka Anda harus menghubungi sys-admin atau penyedia hosting tersebut. Pada kasus webserver Litespeed terkadang tidak terbaca meskipun Anda menerima error seperti ini plugin masih tetap bisa digunakan.

Tahap #2 - Swift Performance Setting

Menuju ke setting pada Swift Performance pro dan klik tombol Advanced View pada kanan atas di samping simple view

Ini adalah setting, yang biasa saya gunakan pada setiap klien saya baik dalam negeri maupun luar negeri. Saya menjamin akan meningkatkan kecepatan Anda pada settingan ini sekitar 80%-90%

Jika Anda masih mengalami kendala website yang lemot pastikan Anda menggunakan Web Hosting yang terbaik. Jika Anda masih memiliki kendala lain Anda bisa menanyakan di kolom komentar post ini, Anda juga dapat menggunakan jasa saya untuk mempercepat website Anda. Hubungi saya jika Anda ingin menggunakan jasa mempercepat website.

1. General

General
Tweaks
Heartbeat
Google Analytic
Whitelabel

2. Media

Images
Embeds

3. Optimization

General
Scripts
Styles

4. Caching

General
Tweaks
Exceptions
Warmup
Varnish
Appcache

karena saya belum pernah menggunakan fitur ini. Saya akan update di minggu kedepan tentang fitur Appcache

5. Plugin

Contact Form 7
Woocommerce

CDN

General
Cloudlfare
MaxCDN (StackPath)
Impor/Export

Jika Anda menggunakan Swift di berbagai project Anda. ANda dapat menggunakan fitur ini untuk Export Import settingan terbaik untuk Swift Anda.

Tahap #3 - Save Changes dan Tunggu Hasil

Tunggu beberapa saat 5 menit hingga 30 menit tergantung banyak jumlah halaman website Anda. Jika Anda ingin mengecek apakah plugin bekerja atau tidak. Buka website Anda di halaman incognito pada chrome. Jika Anda menggunakan Mozilla Anda bisa menggunakan private browser.

Lakukan test pada GT Metrix atau Tools Pingdom. Lihat perubahan yang terjadi.

Terimakasih untuk mengunjungi artikel : Panduan Lengkap Swift Performance Pro 2019, jika ada pertanyaan. Silahkan tanyakan di kolom komentar.

Referensi