Muhammad Ariffudin SEO | Content | Tech Writing

Apa itu GTMetrix? Cara Menggunakan GTMetrix di Website Anda

9 min read

Apa itu GTMetrix

Apakah Anda penasaran seberapa cepat website Anda? Anda merasa performa website melambat, tapi bingung cara memperbaikinya? Jangan khawatir, Anda bisa menggunakan tools bernama GTMetrix.

Singkatnya, GTMetrix adalah tools untuk mengetes kecepatan website. Tools ini sekaligus memberi Anda langkah-langkah yang harus dilakukan untuk memperbaiki performa website yang lambat.

Di artikel kali ini, Anda akan belajar cara menggunakan GTMetrix sekaligus cara meningkatkan skornya. Penasaran kan? Baca hingga selesai, ya!

Apa itu GTMetrix?

gtmetrix adalah

GTMetrix adalah sebuah tools yang memudahkan Anda untuk mengetes performa website. Dengan tools yang satu ini, Anda bisa mengetahui berapa skor kecepatan website berdasarkan beberapa metriks.

Apabila skor website Anda dianggap lambat, GTMetrix akan menunjukkan celah kekurangan website. Kemudian, memberi Anda rekomendasi yang dapat dilakukan untuk meningkatkan kecepatan website.

Perlu Anda ketahui, GTMetrix sudah dikembangkan sejak 2009 oleh perusahaan Carbon60. Hingga kini, ia telah dipercaya lebih dari 900 ribu pengguna. Jadi, Anda tidak perlu khawatir mengenai akurasi skor GTMetrix.

Cara kerja GTMetrix sangat simpel sehingga mudah digunakan pemula. Singkatnya, Anda tinggal membuka laman resmi GTMetrix dan menuliskan URL website. Lalu, GTMetrix akan menampilkan skor website Anda beserta analisisnya.

Dari situ, Anda bisa mengoptimalkan performa website berdasarkan saran dari GTMetrix. Nah, pembahasan mengenai hasil analisis GTMetrix akan kami ulas lebih lengkap di poin selanjutnya.

Baca juga: Cek Kecepatan Website Anda dengan 10 Tools Gratis Ini!

Bagaimana Cara Menggunakan GTMetrix untuk Tes Kecepatan Website?

Tanpa perlu berlama-lama, di poin yang satu ini kami akan mengajari Anda cara menggunakan GTMetrix. Mulai dari mendaftarkan akun sampai memahami hasil analisis website.

1. Daftar Akun GTMetrix

Langkah pertama ini sebenarnya opsional. Anda tetap bisa mengecek kecepatan website tanpa punya akun GTMetrix. Meski begitu, ada beberapa fitur yang akan Anda lewatkan, seperti histori performa website.

Makanya, kami tetap menyarankan Anda untuk mendaftar akun GTMetrix. Tenang, pendaftaran akun ini gratis, kok. Anda tinggal mengunjungi laman resmi GTMetrix. Lalu, klik tombol Sign Up di pojok kanan atas.

laman utama gtmetrix

Akan muncul sidebar berisi form pendaftaran akun. Kemudian, isi semua kolom yang tersedia dan klik Create an Account.

daftar akun gtmetrix

Pihak GTMetrix akan mengirimkan email validasi pendaftaran. Silakan klik link yang ada di email tersebut untuk mulai menggunakan GTMetrix.

Baca juga: 8+ Cara Mempercepat Loading Website dan Blog Anda (Beserta Video)

2. Tes Kecepatan Website

Dalam keadaan login, Anda akan dibawa ke laman utama GTMetrix. Di sini, silakan tulis URL website Anda dan klik Analyze.

cara menggunakan gtmetrix

GTMetrix akan mulai menganalisis kecepatan website Anda. Jika sudah, berikut tampilan yang akan muncul:

hasil analisis gtmetrix

Anda bisa melihat sendiri hasil analisis GTMetrix. Mulai dari GTMetrix Grade, Web Vitals, Top Issues, dan banyak lagi.

analisis lanjutan gtmetrix

Lantas, apa maksud dari semua parameter tersebut? Jangan khawatir, kami akan membantu Anda memahami semuanya di poin berikut ini.

3. Pahami Hasil Analisis GTMetrix: GTMetrix Grade

gtmetrix grade

GTMetrix Grade adalah hasil keseluruhan dari performa website Anda. Di bagian ini, ada tiga metriks yang dinilai, yaitu:

  • Overall Score – Skor keseluruhan website Anda. Dinilai dalam bentuk grade (A, B, C, dan seterusnya). Semakin tinggi grade, semakin bagus performa website Anda.
  • Performance – Skor performa website, menunjukkan seberapa cepat website Anda ketika diakses pengunjung. Dinilai dalam bentuk persentase. Semakin tinggi persentase, semakin cepat website Anda.
  • Structure – Skor struktur website, menunjukkan seberapa baik website Anda dibangun untuk performa yang optimal. Sama seperti Performance, Structure juga dinilai dalam bentuk persentase.

Baca juga: Cara Mempercepat Loading WordPress Menggunakan WP Smush

4. Pahami Hasil Analisis GTMetrix: Web Vitals

gtmetrix web vitals

Web Vitals adalah hasil pengukuran beberapa di elemen inti website Anda. Gunanya untuk menghitung berapa lama waktu loading website. Web Vitals ini merupakan salah satu faktor penting yang mempengaruhi ranking website di Google.

Nah, ada tiga metriks yang dinilai di Web Vitals, yaitu:

  • Largest Contentful Paint (LCP) – Mengukur waktu loading elemen konten terbesar, seperti gambar atau teks heading, sampai bisa ditampilkan ke pengguna. Standar maksimal dari GTMetrix adalah 1.2 detik.
  • Total Blocking Time (TBT) – Mengukur waktu loading halaman web sampai semua fungsinya bisa diakses pengguna. Standar maksimal dari GTMetrix adalah 150 milisekon.
  • Content Layout Shift (CLS) – Mengukur perubahan layout halaman saat loading, sampai tampilannya benar-benar utuh. Skor standar maksimal dari GTMetrix adalah 0.1.

Baca juga: Faktor Apa Saja yang Mempengaruhi Google Ranking? (Edisi 2022)

4. Pahami Hasil Analisis GTMetrix: Speed Visualization

gtmetrix speed visualization

Tab Speed Visualization menggambarkan secara detail rentang waktu loading yang dibutuhkan website Anda. Di sini, Anda bisa melihat kapan konten pertama muncul, kapan website mulai bisa diakses pengguna, dan sebagainya.

5. Pahami Hasil Analisis GTMetrix: Performance

Tab Performance menampilkan hasil pengujian waktu loading website Anda secara lebih rinci. Tab ini terdiri dari dua bagian utama, Performance Metrics dan Browser Timings.

Performance Metrics

gtmetrix performance metrics

Performance Metrics mengukur kecepatan website menggunakan tools Lighthouse. Nah, beberapa metriks yang dinilai antara lain:

  • First Contentful Paint – Seberapa lama waktu yang dibutuhkan konten terbesar pertama untuk tampil. Standar maksimalnya adalah 0.9 detik.
  • Speed Index – Seberapa cepat konten website Anda terlihat penuh. Standar maksimalnya adalah 1.3 detik.
  • Time to Reactive – Seberapa lama waktu yang dibutuhkan website Anda untuk bisa digunakan sepenuhnya. Standar maksimalnya adalah 2.5 detik.
  • Largest Contentful Paint, Total Blocking Time, Cumulative Layout Shift – Sama seperti penjelasan di bagian Web Vitals.

Baca juga: Google WebP: Format Gambar Digital yang Bisa Mempercepat Website

Browser Timings

gtmetrix browser timings

Browser Timings mengukur kecepatan website menggunakan web browser. Berikut beberapa metriks yang dipakai:

  • Redirect Duration – Waktu yang dibutuhkan untuk meredirect URL sebelum semua script HTML ditampilkan.
  • Time to First ByteWaktu yang dibutuhkan untuk merequest halaman website ke server yang bersangkutan.
  • DOM Content Loaded Time – Waktu yang dibutuhkan untuk memproses DOM agar siap ditampilkan di website.
  • Connection Duration – Total waktu yang dibutuhkan untuk terhubung ke server setelah proses redirect URL.
  • First Paint – Waktu yang dibutuhkan browser untuk memproses rendering halaman website untuk pertama kali.
  • Onload Time – Total waktu yang dibutuhkan untuk mendownload dan memproses halaman website sampai semuanya bisa ditampilkan.
  • Backend Duration – Waktu yang dibutuhkan server untuk memproses permintaan halaman website.
  • DOM Interactive Time – Waktu yang dibutuhkan untuk memanipulasi DOM agar bisa digunakan sepenuhnya di website.
  • Fully Loaded Time – Total waktu yang dibutuhkan untuk memproses semua metriks di atas sampai website bisa digunakan pengguna.

6. Pahami Hasil Analisis GTMetrix: Structure

gtmetrix structure

Tab Structure menunjukkan hasil audit GTMetrix terhadap struktur front end website Anda. Di sini, Anda bisa melihat apa saja kendala terkait script front end beserta dampaknya terhadap performa website Anda.

Oh ya, dampak atau Impact masing-masing kendala telah dikelompokkan sesuai urgensinya, yakni High, Med, dan Low. Jadi, Anda bisa memprioritaskan pembenahan struktur website sesuai rekomendasi urgensi tersebut.

Sebenarnya, hasil audit struktur ini tidak berpengaruh secara langsung terhadap kecepatan website. Akan tetapi, memperbaiki struktur front end dapat meningkatkan waktu loading secara keseluruhan.

Jadi, ada baiknya Anda mengikuti saran audit struktur dari GTMetrix.

Baca juga: Cara Mempercepat Loading Website dengan Add Expires Headers

7. Pahami Hasil Analisis GTMetrix: Waterfall

gtmetrix waterfall

Tab Waterfall menggambarkan hasil pengukuran waktu loading elemen front end website dalam bentuk diagram Waterfall. Di sini, Anda bisa memfilter berdasarkan kategori elemen seperti HTML, CSS, atau Font.

Anda juga bisa mengetahui status, ukuran file, dan timeline loading masing-masing elemen. Tak hanya itu, di sini juga tersedia info mengenai persentase CPU, jumlah memori yang terpakai, serta kecepatan upload dan download.

8. Pahami Hasil Analisis GTMetrix: Video

gtmetrix video

Tab video memperlihatkan hasil pengujian waktu loading website Anda dalam bentuk video. Di sini, Anda bisa melihat kapan konten pertama website muncul dan seterusnya, hingga semuanya tampil dengan sempurna.

Hal ini berguna, terutama jika website Anda susah loading tanpa alasan yang jelas. Jadi, Anda bisa tahu konten atau bagian mana yang sebenarnya jadi penghalang website untuk bisa muncul secara sempurna.

Baca juga: WP Rocket – Plugin Cache untuk Mempercepat WordPress

9. Pahami Hasil Analisis GTMetrix: History

gtmetrix history

Sesuai namanya, tab History menyimpan semua pengujian yang Anda lakukan. Di sini, Anda bisa melihat dan membandingkan waktu loading website dari waktu ke waktu, dalam rentang waktu satu hari hingga satu tahun.

Tak hanya itu, Anda juga dapat membandingkan ukuran website serta skor GTMetrix website Anda secara berkala. Rentang waktunya masih sama, mulai dari satu hari sampai satu tahun.

10. Pahami Hasil Analisis GTMetrix: Top Issues dan Page Details

gtmetrix top issues & page details

Kembali ke tab Summary dan scroll ke bawah, Anda akan menemukan dua bagian berbeda. Yang pertama, Top Issues yang merupakan rangkuman kendala website dari tab Structure.

Dan yang kedua adalah Page Details. Bagian yang satu ini adalah versi lebih ringkas dari diagram di tab Waterfall.

Sampai di sini, artinya Anda belajar semua cara menggunakan GTMetrix. Setelahnya, apa yang harus Anda lakukan? Jangan panik, jawabannya ada di poin selanjutnya.

Baca juga: 11+ Tips Mempercepat WordPress untuk Website Toko Online [Terbaru]

[Bonus Tips] Bagaimana Cara Meningkatkan Skor GTMetrix?

Setelah menggunakan GTMetrix, Anda wajib mengoptimalkan website agar skornya meningkat. Nah, berikut ini beberapa cara meningkatkan GTMetrix yang bisa Anda coba:

  1. Mengoptimasi Gambar
  2. Melakukan Minify CSS
  3. Mengaktifkan Leverage Browser Caching
  4. Meminimalkan Permintaan HTTP
  5. Mengaktifkan Kompresi Halaman
  6. Mengaktifkan Kompresi Halaman
  7. Mengecek Website secara Berkala

Langsung saja menuju langkah yang pertama!

1. Mengoptimasi Gambar

Cara meningkatkan GTMetrix yang pertama adalah mengoptimasi ukuran gambar. Alasannya simpel, ukuran gambar yang terlalu besar dapat menyebabkan performa website melambat.

Untuk itu, Anda wajib memperkecil ukuran gambar sebelum menguploadnya ke website. Caranya sangat gampang, Anda bisa memakai tools kompresi gambar online, seperti ILoveIMG.com.

Selain itu, format file gambar juga ternyata berpengaruh pada kecepatan website. Selengkapnya mengenai cara optimasi gambar yang tepat untuk website bisa Anda baca di artikel berikut → Cara Optimasi Gambar di WordPress Supaya Performa Meningkat

2. Melakukan Minify CSS dan JavaScript

Minify adalah proses menghapus karakter yang tidak dipakai setelah proses coding, seperti tab, spasi, dan enter. Melakukan minify dapat memperbaiki struktur website, sehingga kinerjanya meningkat.

Nah, minify itu sendiri biasanya dilakukan pada file CSS, JavaScript, dan HTML. Untuk meminify tiga jenis file di atas, ada beberapa cara yang bisa dilakukan. Namun yang paling mudah adalah menggunakan plugin WordPress.

Plugin apakah itu ? Jawabannya ada di artikel cara minify CSS berikut ini → Cara Minify CSS untuk Mempercepat Loading Website [Termudah]

3. Mengaktifkan Leverage Browser Caching

Leverage Browser Caching adalah upaya untuk memperluas kapasitas penyimpanan sementara (cache) di website. Dengan ini, website dapat dimuat lebih cepat, terutama ketika pengguna sering berkunjung ke website.

Sama seperti proses minify, ada beberapa opsi yang bisa Anda lakukan untuk mengaktifkan Leverage Browser Caching. Selengkapnya bisa Anda baca dengan mengklik tautan berikut → Leverage Browser Caching: Cara Mudah Meningkatkan Kecepatan Website

4. Menggunakan Teknologi HTTP/3

HTTP/3 adalah generasi ke tiga dari Hypertext Transfer Protocol, sebuah protokol transfer data dari satu perangkat ke perangkat yang lain. Nah, HTTP/3 ini mengadopsi teknologi UDP yang lebih canggih dari pendahulunya.

Artinya, proses transfer data dapat berlangsung tanpa jeda, meski terdapat salah satu data yang gagal terkirim. Sayangnya, tidak semua penyedia hosting telah mendukung HTTP/3. Untuk memastikannya, silakan cek artikel berikut →  Apa Itu HTTP/3? Pengertian dan Manfaatnya

Untungnya, Niagahoster termasuk salah satu penyedia hosting yang mendukung HTTP/3. Jadi, pelanggan Niagahoster tidak perlu khawatir mengenai proses transfer data website, karena dijamin kecepatannya.

5. Mengaktifkan Kompresi Halaman

Cara meningkatkan GTMetrix yang lain adalah mengkompresi halaman website. Layaknya kompresi gambar, kompresi halaman dapat memperkecil ukuran halaman itu sendiri. Sehingga, ia dapat dimuat lebih cepat.

Salah satu metode kompresi halaman yang populer adalah GZIP Compression. Metode ini dapat mengkompresi halaman website secara otomatis dan real time. Untuk mengaktifkannya, langsung saja baca artikel yang satu ini → Panduan Meningkatkan Performa Website dengan GZIP Compression

6. Memanfaatkan Content Delivery Network

Content Delivery Network (CDN) adalah kumpulan server global yang tersebar di berbagai data center yang ada di seluruh dunia. Dengan CDN, konten akan dimuat melalui server terdekat, sehingga bisa tampil lebih cepat.

Ada banyak penyedia CDN yang bisa Anda coba, baik gratisan maupun berbayar. Salah satunya adalah Cloudflare, yang terintegrasi langsung dengan Niagahoster. Anda bisa mengunjungi artikel apa itu Content Delivery Network untuk mengaktifkan CDN Cloudflare.

7. Mengecek Website secara Berkala

Cara meningkatkan skor website yang terakhir adalah rutin mengecek performanya secara berkala. Sebab, Anda pasti akan melakukan perubahan di website, misalnya menambah plugin baru atau mengupdate isi website.

Oleh karena itu, sering-seringlah memeriksa performa website. Jika sewaktu-waktu performanya melambat, Anda bisa langsung mengoptimalkan kembali website tersebut dengan segera.

Hasilnya, website Anda akan selalu terjaga kecepatannya. Hal ini bermanfaat agar pengguna selalu menjelajahi website Anda dengan nyaman, tanpa mengalami lemot sedikitpun.

Nah, itu tadi tujuh cara meningkatkan GTMetrix secara tepat. Tapi sebelum Anda mempraktikkan semuanya, ada satu lagi informasi yang sayang untuk Anda lewatkan. Yuk simak poin setelah ini!

GTMetrix adalah tools yang sudah cukup bagus untuk mengukur performa website. Tapi tahukah Anda, ada lagi tools pengukur kecepatan website yang lebih disarankan daripada GTMetrix?

Tools tersebut adalah PageSpeed Insight. Kami lebih menganjurkan Anda memakai tools ini, karena hasil analisisnya lebih akurat. Selain itu, ia adalah tools resmi Google, sehingga menggunakan indikator penilaian sesuai standar Google.

Untuk menggunakan PageSpeed Insight, Anda bisa langsung mengunjungi laman resminya. Setelah itu, masukkan URL website di kolom yang tersedia dan klik Analyze.

pagespeed insights

Hasil analisis PageSpeed Insight sekaligus rekomendasi cara optimasinya akan muncul. Oh ya, tools yang satu ini bisa menilai performa website dari dua jenis perangkat yang berbeda, yakni Mobile dan Desktop.

hasil analisis pagespeed insights

Lantas, apakah indikator penilaian PageSpeed Insight sama dengan GTMetrix? Secara umum sama. Keduanya menggunakan beberapa metriks seperti LCP, TBT, dan CLS, serta menilai struktur website.

gtmetrix vs pagespeed insights

Perbedaan keduanya terletak di cara optimasi. Pada GTMetrix, Anda perlu mengoptimasi website secara manual melalui cara-cara yang sudah kami jelaskan sebelumnya.

Sementara dengan PageSpeed Insight, ada cara instan untuk mengoptimasi website sekaligus meningkatkan skornya. Caranya dengan mengaktifkan fitur WordPress Accelerator.

Fitur ini tersedia bagi Anda pelanggan setia Niagahoster. Khususnya di beberapa paket hosting, seperti Unlimited Hosting, Cloud Hosting, WordPress Hosting, dan Simple WordPress.

Cara mengaktifkannya sangat gampang. Pertama, kunjungi Member Area Niagahoster. Kemudian, klik menu WP Management > Website di sidebar.

member area wordpress management

Di halaman Pengaturan WordPress, klik tab WordPress Accelerator. Setelah itu, klik Scan untuk memunculkan website. Jika sudah, geser slider ke kanan agar fitur yang satu ini aktif.

cara meningkatkan gtmetrix dengan wordpress accelerator

Selesai! WordPress Accelerator telah aktif. Anda bisa berhenti di sini, tapi tidak ada salahnya melakukan konfigurasi tambahan. Gunanya agar kecepatan website semakin optimal.

Langkah-langkahnya mudah. Silakan beralih ke tab WordPress Management. Lalu, klik opsi Login WordPress. Anda akan dibawa ke dashboard WordPress tanpa perlu memasukkan username dan password.

login wordpress

Di halaman dashboard WordPress, klik LiteSpeed Cache > General yang terletak di sidebar.

menu general litespeed cache

Akan muncul beberapa pengaturan LiteSpeed Cache. Di sini, aktifkan opsi Guest Mode dan Guest Optimization. Jika sudah, klik Save Changes.

guest mode dan guest optimization

Setelah itu, pilih opsi Cache di sidebar. Kemudian, aktifkan opsi Cache Mobile. Jangan lupa klik Save Changes.

cache mobile

Kembali ke sidebar, pilih opsi Page Optimization. Jika sudah, pilih tab CSS Settings. Di sini, aktifkan tiga opsi berikut: CSS Minify, Generate UCSS, dan UCSS Inline.

minify css

Beralih ke tab JS Settings. Silakan aktifkan opsi JS Minify.

minify js

Terakhir, klik tab Media Settings dan aktifkan opsi Lazy Load Images.

lazy load images

Selamat! Anda telah mengaktifkan WordPress Accelerator sekaligus melakukan konfigurasi. Sebagai bukti, berikut hasil skor PageSpeed Insight sebelum dan sesudah mengaktifkan WordPress Accelerator.

sebelum vs sesudah wordpress accelerator

Keren banget kan? Skornya langsung melesat mendekati sempurna. Sekarang giliran Anda, buktikan sendiri peningkatan skor PageSpeed Insight hanya dengan melakukan beberapa trik sederhana di atas.

Yuk Tingkatkan Kecepatan Website Anda!

Di artikel ini, Anda telah belajar menggunakan GTMetrix di website. Tak hanya itu, Anda juga sudah mempraktikkan beberapa tips yang ampuh untuk meningkatkan skor GTMetrix.

Tapi yang lebih penting, Anda telah mengetahui tools cek performa website yang lebih akurat, yakni PageSpeed Insight. Bahkan, kami berbaik hati memberikan Anda tips meningkatkan skor PageSpeed Insight secara instan.

Pun demikian, tips di atas hanyalah sebagian kecil cara mengoptimalkan kecepatan website. Hal lain yang wajib Anda perhatikan, yakni kinerja layanan hosting yang digunakan.

Untungnya, Anda bisa menggunakan paket Cloud Hosting Niagahoster. Paket ini menggunakan kapasitas server setara VPS. Ada juga jaminan uptime hingga 99.99%. Jadi, website bisa ON terus meski tengah dibanjiri pengunjung.

Tunggu apa lagi, yuk rasakan akses website super ngebut dengan paket Cloud Hosting terbaik!


Tidak ingin ketinggalan insight seperti ini di kemudian hari? Masukkan email Anda dan klik subscribe sekarang! Kami akan memastikan Anda terus mendapatkan informasi bisnis terbaru & terhangat berikut info promo domain hosting Niagahoster.

Muhammad Ariffudin SEO | Content | Tech Writing

2 Replies to “Apa itu GTMetrix? Cara Menggunakan GTMetrix di Website Anda”

  1. Siap meluncur ke gtmetrix, terima kasih banyak,artikel nya sangat membantu

  2. Setelah menggunakan plugin WP Rocket alhamdulillah skor gtmetrix lumayan baik walaupun belum begitu sempurna dalam optimasi page speed web.

Leave a Reply

Your email address will not be published.

[class^="wpforms-"]
[class^="wpforms-"]
[class^="wpforms-"]
[class^="wpforms-"]