Buat teman-teman yang ingin mengetahui bagaimana cara meningkatkan kecepatan & kinerja website. Tepat sekali, teman-teman datang ke blog yang sangat tepat sekali. Pada kesempatan ini saya akan memberikan Tutorial: Cara Meningkatkan Kecepatan & Kinerja Website.

Teman-teman mungkin sudah tahu bahwa website yang lambat dapat berakibat fatal dan bisa kehilangan pengunjung, lalu lintas organik, hingga penjualan. Dan waktu loading sebuah website itu sangat penting dalam dunia bisnis.

Teman-teman mungkin bertanya “Bagaimana saya dapat mempercepat website saya?. Saya sudah mencoba semua tutorial yang ada di hasil pencarian search engine, tapi hasilnya tidak maksimal”. Sebenarnya semua itu tergantung dan ada beberapa faktor lainnya. Dan biasanya banyak tips dan trik acak tidak akan membantu jika teman-teman tidak mengerti bagaimana semuanya itu bekerja bersama.

Bagaiamana Proses Loading Sebuah Website

Sebelum kita mulai Tutorial: Cara Meningkatkan Kecepatan & Kinerja Website. Ada baiknya kita belajar bagaimana proses loading sebuah website itu agar kita tahu dimana letak masalah dari website itu sendiri.

Ada 3 aktor dalam proses loading website.

  1. Client adalah browser pengguna seperti Chrome, Firefox, Safari atau Edge.
  2. Pipa merupakan jalur atau kabel yang membawa informasi dari Server ke Client adalah Penyedia Layanan Internet (ISP).
    Ingat: Setiap Pipa dibuat dari berbagai perusahaan yang berbeda.
  3. Server adalah hosting. Ini merupakan tempat dimana website teman-teman disimpan.

Ketika seseorang mengetikkan nama domain ke Client, maka Pipa akan melakukan permintaan ke Server. Kemudian Server mengatakan “ohh. Lu mau file-file ini” dan mengirimkannya kembali ke Client melalui Pipa. Client kemudian mengatur file-file tersebut sehingga pengunjung dapat melihat produk yang sudah jadi tersebut dalam bentuk halaman website.

Bayangkan jika teman-teman pergi ke sebuah restoran. teman-teman akan memesan makan. Kemudian Pelayan akan mengambil pesanan ke koki. Dan Koki akan memberikan semua hidangan makan (daging, sayuran, nasi, minuman, dll) kepada Pelayan. Dan kemudian Pelayan akan membawa semuanya makanan untuk teman-teman dan terakhir teman-teman menyajikan makanan tersebut.

Nah, itulah analogi yang akan kita gunakan.

  • Pelanggan = Browser Pengunjung
  • Makanan = Website
  • daging, sayur, nasi, minuman = File-file dari Website
  • Pelayan = Pipa
  • Koki = Hosting

Sebagai Koki dalam analogi ini, bagaimana teman-teman bisa menyajikan makanan secepat mungkin?

Dalam analogi ini teman-teman tidak dapat mengontrol seberapa cepat pelayan berjalan, tidak dapat mengontrol kapan pelanggan lain memesan makanan. Tetapi sebagai Koki, teman-teman memiliki banyak pilihan. Jadi mari kita gali lebih dalam.

Bagaimana Cara Meningkatkan Kecepatan & Kinerja Website

Layani Permintaan dengan Cepat

Bayangkan jika setiap kali pelayan pergi ke dapur, ia harus menunggu makanan dimasak. Dan bayangkan jika koki itu memasak dengan lambat seperti seekor siput berjalan. Makan untuk layanan itu sangat buruk.

Jika teman-teman memiliki server hosting yang lambat, maka itulah yang sebenarnya terjadi. Metrik ini disebut Time To First Byte (TTFB). TTFB mengukur seberapa cepat server website melayani firts byte informasi setelah menerima permintaan.

Jika teman-teman menggunakan layanan shared hosting, nilai ini akan bervariasi dari waktu ke waktu. Tetapi secara umum, ini adalah nilai yang harus tetap rendah. Minimal 500ms untuk layanan shared hosting dengan katagori baik. Ketika teman-teman mendapatkan nilai ini secara konsisten di atas 1 detik, berarti hosting itu lambat.

Jika server saja sudah lambat melayani permintaan maka tidak banyak yang dapat teman-teman lakukan.

Apa yang Harus Dilakukan?

Untuk menguji TTFB, teman-teman bisa menggunakan layanan sepert WebPageTest atau dengan Pingdom Tools.
Untuk dapat memperbaiki masalah ini caranya hanya satu yaitu dengan beralih ke perusahaan hosting yang baik atau teman-teman bisa melalukan upgrade hosting menjadi VPS.

Tutorial: Cara Meningkatkan Kecepatan & Kinerja Website

Layani Lebih Sedikit Permintaan

Apa yang benar-benar membuat makanan menjadi enak? Apa yang benar-benar membuat website yang bagus? Apakah nilai ini semata-mata hanya sebuah angka acak atau kualitas dari apa yang dilayani?

Apakah koki yang menyajikan lebih banyak hidangan daripada apa yang bisa dinikmati oleh pelanggan? Maka hentikan beberapa yang tidak diperlukan dengan cara mengurangi ukuran website teman-teman.

Setiap situs web terdiri dari kumpulan file. Dan setiap elemen memerlukan file. Setiap gambar, setiap widget, setiap tombol, setiap script pelacakan, setiap iklan, setiap slider. Pada dasarnya semuanya adalah sebuah code yang disimpan berbentuk file.

Apakah teman-teman benar-benar membutuhkan barang-barang sebanyak itu? Saya meningkatkan kecepatan website ini dengan menghapus banyak tombol, slider, dan sedikit menghapus beberapa CSS yang tidak digunakan.

Tutorial Cara Meningkatkan Kecepatan & Kinerja Website 1

Apa yang Harus Dilakukan?

Periksa tema, plugin, dan script yang teman-teman miliki. Kemudian. Lihatlah widget, lencana, dan desain keseluruhan. Dan Hapus apa pun yang tidak diperlukan.

Perlu diingat: Jangan lupa untuk melakukan backup data sebelum melalukan perubahan pada script.

Layani Permintaan dengan Benar

Bayangkan jika menu makanan mencantumkan semua hidangan yang salah dalam makanan teman-teman. Itu akan menambah perjalanan antara koki dengan pelanggan. Misal: “Teman-teman meminta brokoli, tetapi kokinya tidak memiliki stock brokoli.” Kemudian pelayan menawarkan kubis (sayur kol). Maka itu akan memperlambat layanan.

Jika website teman-teman memiliki elemen (javascript, css, gambar, halaman, dll) yang salah atau telah pindah (melakukan perubahan pada url). Itu akan memperlambat waktu muat website teman-teman. Server akan mencari elemen yang benar dan kemudian mengirimkannya. Jika tidak ditemukan maka yang akan dikirim adalah pesan kesalahan (error).

Tutorial Cara Meningkatkan Kecepatan & Kinerja Website 2

Apa yang Harus Dilakukan?

Lakukan audit terhadap website untuk permintaan yang buruk dan pengalihan dengan Webpage Test, Pingdom Tools atau Google PageSpeed. Cari tahu apa yang menyebabkan kesalahan. Kemudian perbaiki.

Di WordPress, biasanya itu adalah tema, plugin, atau konten yang sudah ketinggalan zaman. Jadi untuk menjaga teknologi website teman-teman harus melakukan update terhadap tema, plugin, dan juga WordPress itu sendiri. Termasuk juga melakukan update di sisi hosting seperti versi PHP, MySQL, dll.

Layani Permintaan Lebih Kecil

Jika piring yang besar membutuhkan waktu lebih lama untuk dibawa. Maka begitu juga dengan file yang ukurannya besar pasti akan membutuhkan waktu lebih lama untuk diload.

Dengan mengurangi ukuran file yang teman-teman miliki, itu biasanya dapat meningkatkan kecepatan website. Keuntungan terbesar di sini biasanya dengan gambar. Teman-teman dapat mengurangi ukuran dimensi gambar dan data gambar. Jika website teman-teman menampilkan lebar maksimum 1280px. Maka untuk gambar tidak boleh melebihi ukuran 1280px. Dan gambar juga tidak perlu sebesar ukuran website.

Perangkat lunak gambar biasanya menambahkan data ekstra (informasi tambahan seperti: lokasi, dll) yang tidak terlihat oleh mata manusia. Teman-teman dapat menggunakan tools untuk melakukan kompres dengan menghapus data-data tambahan tersebut.

Apa yang Harus Dilakukan?

Sebelum mengunggah, gunakan editor gambar untuk mengubah ukuran gambar. Usahakan tidak mengurangi kualitas dari gambar tersebut. Dengan tools kompres gambar, baik yang online maupun offline teman-teman dapat mengurangi ukuran file gambar tanpa kehilangan kualitas apa pun.

Untuk WordPress, ada beberapa plugin yang bagus seperti Compress JPEG & PNG images, WP Smush, dan W2E Image Optimizer yang secara otomatis akan mengompres gambar saat teman-teman mengunggahnya.

Tetapi melayani permintaan yang lebih kecil tidak cuma untuk gambar. Teman-teman juga dapat menggunakan teknik seperti Kompresi HTTP dalam plugin caching seperti LiteSpeed Cache dan WP Fastest Cache untuk mengurangi ukuran file website tanpa kehilangan kualitas.

Sajikan Permintaan dalam Urutan yang Tepat

Bagaimana jika koki menyuruh pelayan untuk tidak menyajikan makanan pembuka sampai makanan penutup selesai dimasak? Bagaimana jika pelayan secara acak membawa hidangan saat pelanggan makan?

Browser mencoba memuat website saat mereka menerima file. Teman-teman mungkin telah memperhatikan bagaimana website akan bergerak dan berubah sedikit saat tampilan dimuat (browser menerima file).

Tetapi tidak semua file dibuat sama. Beberapa file, seperti JavaScript dikenal sebagai “blocking resource“. Browser bahkan tidak akan mulai memuat halaman sampai ia menerima bagian JavaScript yang diperlukan.

Selain itu, teman-teman tidak boleh menggunakan CSS atau JavaScript “in-line” (di dalam halaman web). Ini akan mengesampingkan CSS atau JavaScript asli dan akan menyebabkan halaman web bergerak dan bercampur aduk.

Apa yang Harus Dilakukan?

Lihat laporan dalam tes audit di WebPage, Pingdom Tools, atau Google PageSpeed. Lihatlah sumber halaman teman-teman. Lacak setiap elemen yang dimuat dalam urutan yang salah. Pindahkan mereka ke lokasi yang benar.

Siapkan Permintaan Untuk Pergi

Bagaimana jika koki sudah memasak setiap hidangan di dalam makanan, dan pelayan hanya harus mengambilnya dan pergi?

Istilah teknis untuk ini dalam kecepatan situs adalah caching. Jika teman-teman menjalankan situs dengan WordPress tanpa caching, setiap kali seseorang meminta halaman web, server harus membuat file dari awal melalui database.

Jika teman-teman menjalankan cache, maka server secara berkala membuat setiap halaman web tanpa permintaan dan kemudian melayani halaman yang sudah dibuat saat diminta.

Ini biasanya menciptakan keuntungan besar dalam kecepatan. Ini juga melindungi server teman-teman dari crash yang terlalu banyak permintaan sekaligus.

Apa yang Harus Dilakukan?

Jika teman-teman menggunakan platform WordPress instal dan konfigurasikan LiteSpeed Cache.

Apa yang Harus Dilakukan (advanced)

Baca artikel ini di rel = “prerender” oleh Mike King. Ini adalah artikel yang sangat bagus untuk pengguna Chrome yang memungkinkan teman-teman memuat ulang seluruh website untuk masing-masing pengguna. Ini seperti pelanggan yang menelepon terlebih dahulu sehingga koki dapat memasak sebelum dan menyajikan seluruh makanan.

Bundling Beberapa Permintaan

Menyajikan satu hidangan satu per satu? Bagus, tapi bagaimana jika teman-teman bisa menggabungkan beberapa hidangan serupa di piring yang sama?

Itulah ide di balik minifying dan combining scripts.

Misalkan website teman-teman memiliki 2 file CSS dan 2 file JavaScript. Biasanya, itu akan menjadi 4 permintaan untuk server. Jika teman-teman minifying dan combining scripts. Itu akan menggabungkan 2 file CSS menjadi 1 dan 2 file JavaScript menjadi 1.

Jadi server akan hanya akan melayani dua permintaan, bukan satu.

Namun ada risiko dengan metode ini. Sama seperti teman-teman tidak ingin saus steak ada di dalam sebuah kue, terkadang file yang diperkecil akan bertentangan.

Apa yang Harus Dilakukan?

Test minification plugins. Jika teman-teman menggunakan plugin LiteSpeed Cache, minification adalah modul bawaan. Mulailah dengan file CSS, yang kemungkinan paling tidak akan menimbulkan konflik.

Melayani Permintaan Lebih Dekat dengan Pelanggan

Menyajikan beberapa hal seperti air, makanan penutup, dan roti dari dapur. Tapi bagaimana jika teman-teman bisa menyiapkannya di samping meja pelanggan? Itu akan mempercepat banyak hal.

Website akan menjadi Content Delivery Network (CDN). CDN adalah jaringan server yang berlokasi di seluruh dunia yang meng-host file website dimana jarang berubah dari hari ke hari. Seperti gambar, video, JavaScript dan CSS.

Ketika seorang pengunjung mengetikkan nama domain, aset-aset itu akan dilayani dari server CDN yang paling dekat dengan pelanggan. Bukan dari server utama, ini sangat baik dalam mengatasi masalah kecepatan.

Apa yang Harus Dilakukan?

Hubungkan CDN ke website teman-teman. Saya menggunakan Cloudflare untuk website ini. Ini terintegrasi dengan sangat baik dengan WP Fastest Cache maupun Litespeed.

Jika teman-teman menggunakan WordPress, teman-teman dapat menginstal plugin JetPack dan memanfaatkan CDN untuk gambar.

Selain itu, CDN memiliki pertimbangan SEO dan kompatibilitas yang berada di luar cakupan posting ini. Saya akan membahasnya secara mendalam di lain waktu.

Jangan Bebankan Server dengan Banyak Proses

Seorang koki yang sibuk dengan tugas-tugas lain seperti membersihkan, memperbaiki dan melayani pelanggan lain akan lebih lambat untuk memenuhi permintaan makanan pelanggan.

Sama dengan server. Jika sibuk dan macet dengan tugas-tugas lain, akan sangat lambat untuk melayani website.

Masalah ini sangat umum dengan WordPress dan plugin WordPress. Plugin yang dirancang dengan buruk (bahkan tema) dapat menyerap sumber daya server dan kinerja dari server.

Apa yang Harus Dilakukan?

Instal P3 Performance Profiler untuk sementara waktu. Gunakan plugin ini untuk mengetahui plugin dan tema mana yang menyerap sumber daya server. Hapus atau ganti plugin/tema tersebut.

Terakhir, jika proses dari website sudah melampaui dari spek server, teman-teman mungkin perlu melakukan upgrade ke paket hosting yang baru. Atau bahkan harus bermigrasi ke server VPS,

Melayani Permintaan Secara Aman & Cepat

Apa maksudnya melayani permintaan secara aman dan cepat? Itu artinya website teman-teman harus menggunakan teknoogi HTTPS melalui SSL. Ini lebih aman tetapi juga dapat memperlambat kecepatan website.

Apa yang Harus Dilakukan?

Ada beberapa cara untuk mempercepat HTTPS melalui SSL, mungkin teman-teman bisa mencari tutorialnya di search engine favorit teman-teman. Tapi jika saya ada waktu nanti akan saya buatkan untuk tutorial ini.

Peningkatan Kecepatan Lebih Lanjut

Penting untuk diingat bahwa selalu ada hal lain yang dapat teman-teman lakukan. Yaitu teman-teman harus mempertimbangkan utilitas.

Dalam analogi saya. Teman-teman selalu dapat menyewa koki khusus, mendapatkan pisau yang lebih tajam, peralatan dapur yang lebih baik dan canggih, dll. Dengan semua utilitas tersbut maka teman-teman akan menyiapkan makanan lebih cepat.

Dalam pengembangan web, teman-teman dapat beralih ke Nginx, menerapkan cache Varnish, memindahkan database ke server database, dll. Semua itu di luar ruang lingkup untuk pemula. Tetapi penting untuk mengetahui apa yang ada di luar sana dan di mana opsi-opsi itu berada.

Apa yang Harus Dilakukan?

Teman-teman harus memiliki pemahaman umum tentang opsi lanjutan ini untuk meningkatkan kecepatan website. Jika websie teman-teman adalah website yang kompleks, maka teman-teman dapat mencari pengembang web profesional untuk mengevaluasi opsi dan mengimplementasikan solusi khusus ini.

Tapi jangan langsung ke solusi itu sampai teman-teman sudah menerapkan dasar-dasarnya.

Langkah Selanjutnya

Ada banyak variabel yang masuk ke dalam kecepatan loading website. Sebelum menggunakan tips dan trik yang sudah banyak beredar di Internet, teman-teman harus mencari tahu akar dari permasalahnya terlebih dahulu. Cari apa yang membuat waktu loading website itu menjadi lambat.

Teman-teman bisa menggunakan tools dibawah ini untuk melakukan audit:

Teman-teman juga dapat menggunakan GeoPeek untuk melihat kecepatan secara internasional (dari berbagai negara).

Terima kasih, mungin itu saja yang bisa saya share untuk teman-teman jika dirasa ini bermanfaat bisa dishare ke teman-teman yang lain.

Informasi Tambahan

Untuk teman-teman yang ingin meningkatkan performa dan kecepatan website secara lebih lengkap, saya merekomendasikan artikel-artikel dibawah ini untuk dibaca dan dipelajari karena ada hubungannya dengan performa sebuah website.

5/5 (20 Reviews)