Cara menggunakan javascript set performance

Gtmetrix merupakan salah satu tools yang dapat digunakan untuk menganalisa performa pada suatu website. GTmetrix menggunakan beberapa parameter seperti performa dan struktur script untuk menentukan grade sebuah website.

Daftar Isi

Pada panduan ini, kami akan memberikan cara menggunakan GTmetrix untuk menganalisa kecepatan pada website Anda. Berikut informasi selengkapnya.

Apa itu GTmetrix?

Gtmetrix adalah salah tool online yang digunakan untuk menganalisa performa sebuah website. GTmetrix memiliki tujuh wilayah pengetesan, dimana Vancouver Canada digunakan sebagai default server pengetesan.

Pada tahun 2019, GTmetrix melakukan perombakan yang cukup besar pada sistem testingnya. Dulu, GTmetrix menilai kinerja sebuah website berdasarkan pustaka PageSpeed/YSlow open source Google. Sekarang GTmetrix menggunakan data dari Lighthouse sebagai standar penilaian kinerja sebuah website.

Cara kerja GTmetrix

Dengan GTmetrix yang sekarang didukung oleh Lighthouse, laporan kinerja website di desain ulang secara menyeluruh untuk menggabungkan data dan metrik Lighthouse.

Sistem penilaian baru yang telah diterapkan ini, membuat Grade GTmetrix baru. Mulai dari kinerja and skor performa. Laporan GTmetrix juga mengalami perubahan tampilan, dengan penambahan beberapa tab, visual, grafik, dan insight yang lebih dalam.

Pada artikel yang lalu, kami telah membahas optimasi ini mulai dari pemilihan themes, pemakaian plugin, opstimasi gambar sampai pemakaian versi php terbaru. Kali ini, kami akan menganalisa website WordPress dari tool GTmetrix.com.

Untuk analisa kecepatan website kali ini, kami akan menggunakan CMS WordPress dengan nama domain panduanwordpress.my.id sebagai sample.

Pengecekan Performa Website

Panduan instalasi plugin di CMS WordPress

Eliminate render-blocking resources

Ilustrasinya, ketika halaman web mulai dimuat dibrowser pengunjung, proses rendernya akan dimulai dari script atas sampai kebawah web. Dalam proses memuat web dibrowser, jika proses render menemui baris javascript dan css.

Proses ini akan berhenti untuk mendownload file js dan css. Hal ini yang menyebabkan waktu muat website lebih lama untuk menampilkan konten keseluruhan, yang berarti pengunjung website akan menganggap website Anda lambat.

Cara mengatasinya adalah dengan menghilangkan render-blocking resources. Untuk CMS WordPress rekomendasinya adalah memasang plugin:

Autoptimize + Async JavaScript (free)

  1. Install dan aktifkan plugin Autoptimize. Pilih Settings > Autoptimize.
  2. Centang Optimize JavaScript Code dan Optimize CSS Code.
Panduan instalasi plugin di CMS WordPress

First Contentful Paint

First Contentful Paint (FCP) adalah metrik yang mengukur kinerja sebuah website dari seberapa cepat pengunjung dapat melihat konten aktual (yaitu teks, gambar, video, dll).

FCP pada halaman adalah total waktu yang dibutuhkan pengunjung dari awal pemuatan halaman website sampai seluruh konten ditampilkan dilayar. Memiliki FCP rendah merupakan hal positif. Karena pengunjung menganggap halaman website kita dimuat dengan cepat.

Pada bagian ini optimasi yang dapat dilakukan adalah optimasi gambar.

  • Optimasi gambar menggunakan Tinypng
  • Optimasi gambar dengan plugin WP Smush

Setelah melakukan beberapa optimasi diatas, website panduanwordpress.my.id mendapat kinerka lebih baik.

Pengecekan performa website di GTmetrix

Skor Performance sebelumnya 83% setelah dioptimasi naik menjadi 84%.

Kesimpulan

Beberapa kasus pengetesan performa website di GTmetrix bisa berbeda-beda, sehingga cara optimasinya bisa berbeda. Tergantung kasus yang dihadapi. Tetapi secara umum, optimasi website WordPress tidak jauh-jauh dari yang sudah dibahas diatas.

Postingan terbaru

LIHAT SEMUA