Sepuluh Cara untuk Meningkatkan Waktu Pemuatan Situs Web Anda dan Google Core Vitals

Diterbitkan: 2021-08-15

Daftar isi

Apa Itu Vital Web Inti?

Pada awal tahun ini, Google memperkenalkan serangkaian kriteria baru yang menentukan stabilitas, kecepatan, dan daya tanggap situs web tertentu. Tiga kriteria utama tersebut adalah sebagai berikut:

  • Pergeseran Tata Letak Kumulatif menentukan seberapa banyak struktur halaman web harus bergeser dan berubah posisi. Patokan untuk ini adalah 0,1.
  • Cat Contentful Terbesar mengukur berapa lama waktu yang dibutuhkan untuk memuat konten utama halaman. Hasil terbaik harus 2,5 detik atau kurang.
  • First Input Delay adalah waktu antara pembukaan halaman web dan saat pertama kali menjadi interaktif. Jangka waktu yang paling sering dicari adalah sekitar 100 milidetik.

Dengan mengingat istilah-istilah dasar ini, mari kita lihat bagaimana Anda dapat menggunakan Core Vitals untuk membuat situs web Anda secepat dan seefisien mungkin.

1. Optimalkan CDN dan Cache Browser Anda

Skor FID dan LCP Anda harus ditingkatkan cukup cepat menggunakan metode ini. Sajikan aset statis Anda dari CDN, atau simpan di cache pada layanan seperti Cloudfront dari AWS. Browser akan mendapatkan hasil yang dibutuhkan jauh lebih cepat setelah ini.

Selain itu, halaman dinamis dapat di-cache di CDN Anda dengan nilai TTL yang benar sudah diterapkan tergantung pada bagaimana aplikasi Anda berperilaku.

2. Gunakan Ukuran Tepat untuk Semua Iklan Dan Media

Ukuran Penting tanda Sejauh skor CLS Anda berjalan, ini adalah salah satu faktor terpenting. Selalu periksa apakah Anda telah menetapkan ketinggian tertentu pada gambar atau aset yang diberi tag, yang sangat penting, terutama untuk komponen tingkat lipatan. Jika Anda terdesak waktu, Anda selalu dapat mengatur ketinggian ke otomatis dan mendapatkan perkiraan ukuran yang akan bekerja cukup baik dalam keadaan darurat.

Iklan juga menjadi faktor dalam CLS, dan Anda perlu memeriksa tinggi dan ukurannya secara menyeluruh untuk memastikan iklan tidak menggantikan konten dengan ditampilkan secara tidak benar. Ini mungkin memerlukan menghubungi penyedia layanan periklanan Anda atau mencari beberapa opsi berbeda jika CLS Anda terpengaruh secara konsisten.

Jika Anda menggunakan platform WordPress, sebaiknya pertimbangkan plugin seperti Ewww , yang dapat secara otomatis mengirimkan gambar Anda di Webp dan mengaktifkan fitur seperti lazy load untuk menunda pemuatan semua gambar saat pemuatan halaman.

3. Muat Gambar Resolusi Kanan dengan Cara Malas Berdasarkan Jenis Perangkat Yang Digunakan

Teknik ini menghasilkan hasil yang sangat cepat dan harus menjadi salah satu pertimbangan pertama Anda. Dengan menggunakan paket pemuatan lambat, cukup mengejutkan, pemuatan lambat semua gambar di situs Anda, LCP Anda akan terpengaruh secara positif, terutama dengan menurunkan bobot halaman dan memastikannya dimuat secepat mungkin.

Penting juga untuk menyetel resolusi untuk setiap aset berdasarkan jenis perangkat yang digunakan untuk melihat situs Anda. Memuat resolusi sebagai satu ukuran untuk semua akan membuat situs jauh lebih lambat pada perangkat yang lebih kecil atau kurang kuat dan memengaruhi LCP Anda dengan cara yang paling buruk.

4. Gunakan SSR dan CSR dengan Cara Cerdas

Google selalu tertarik untuk mendorong dan mempromosikan halaman Server Side Rendered (SSR) dengan skor bagus untuk menginspirasi kinerja SEO yang berharga. Namun, Anda harus mempertimbangkan keseimbangan antara SEO dan Page Load Performance. Laman dengan terlalu banyak konten dapat memakan waktu lama untuk memuat sisi server dan menurunkan kinerja umum di situs Anda.

Konten yang sebenarnya harus disimpan di paro atas, sementara fitur situs lainnya harus disimpan kembali untuk meningkatkan SSR. Gaya pemuatan asinkron ini membutuhkan banyak waktu untuk memuat dan merender skor Anda.

5. Hancurkan Semuanya dengan Memisahkan Kode Anda

Baris kode Menggunakan ukuran file yang paling signifikan untuk aset (terutama file JS) umumnya merupakan ide yang buruk. Sebagai gantinya, Anda harus mengizinkan protokol h2 dan memanfaatkannya untuk memuat kembali aset secara asinkron dalam bagian yang terpisah.

Selain itu, alih-alih menggunakan satu file HTML besar, Anda dapat membagi situs menjadi beberapa file yang lebih kecil dan dengan demikian mengurangi beban pemuatan.

6. Gunakan Teknik Kompresi Brotli untuk Menurunkan Aset Statis

Sejauh kompresi berjalan, Brotli tampaknya menjadi pilihan terbaik dalam hal kecepatan pemuatan. Namun, rasio kompresi yang lebih tinggi akan menambah waktu pengemasan dan pembuatan dalam hal DevOps.

Tetapi pada akhirnya, waktu pemuatan situs adalah faktor yang paling penting dan harus diprioritaskan di atas segalanya.

7. Buat Konten Respons dan Permintaan Api seefisien Mungkin

Tidak diragukan lagi, elemen paling vital dalam hal kecepatan pemuatan, bahkan perubahan yang paling kecil sekalipun, dapat memberikan hasil yang besar dengan API. Tanggapan dan permintaan API harus sering diperiksa demi pengoptimalan.

Juga, tentukan parameter data dan gunakan hanya yang diperlukan untuk menghemat banyak waktu dan tenaga. Memilih jaringan untuk API Anda juga patut dipertimbangkan dengan cermat, karena hosting di subnet yang salah dapat meningkatkan persyaratan waktu secara besar-besaran.

8. Kurangi Ukuran Keseluruhan Halaman dan Dokumen Anda

Pria melihat dokumen online Halaman arahan kode berat (apa pun di atas 75kb cenderung serius) sangat tidak diinginkan, karena secara drastis meningkatkan waktu pemuatan dan waktu pengambilan.

Selalu mencoba untuk menjaga hal-hal bersih di sisi kode karena mudah untuk melewatkan bit data yang berlebihan.

9. Ganti Thumbnail Video Dengan Gambar Placeholder

Banyak pemirsa situs memilih untuk tidak terlibat dengan konten video, jadi memuat gambar mini pada video yang tidak diputar adalah pemborosan sumber daya dalam kasus ini.

Sebaiknya pilih gambar placeholder atau ruang video kosong untuk menghemat sumber daya dan dengan demikian meningkatkan kecepatan situs.

10. Pilih Server Tercepat yang Tersedia

Garis kecepatan Ini mungkin tampak seperti faktor yang jelas, tetapi masih perlu dikatakan. Berinvestasi dalam infrastruktur server terbaik biasanya merupakan ide bagus karena secara langsung memengaruhi kecepatan seluruh situs Anda tanpa kecuali.

Dengan menghabiskan lebih banyak uang, Anda akan menghemat banyak waktu secara keseluruhan. Cloudflare adalah alat tingkat DNS luar biasa yang memungkinkan Anda mengoptimalkan situs dengan hemat biaya tanpa sumber daya server yang mahal.

Kesimpulan

Kiat-kiat di atas akan membawa Anda ke jalur yang benar untuk mencapai skor Kecepatan Halaman dan vital inti yang lebih baik. Namun, Anda mungkin menemukan diri Anda pada platform atau tema yang membengkak yang sering kali berarti tindakan terbaik untuk membuat situs baru, lebih bersih, dan lebih ringan.

Misalkan Anda menggaruk-garuk kepala karena semua istilah ini atau merasa gentar dengan gagasan untuk mengerjakan ulang seluruh situs Anda untuk kecepatan tambahan. Dalam hal ini, Anda mungkin ingin mempertimbangkan tinjauan situs dari pakar desain web yang kemungkinan akan menyarankan tindakan terbaik untuk mengoptimalkan situs Anda yang ada atau menyarankan untuk mengembangkan situs baru dengan basis kode yang lebih dioptimalkan untuk vital inti.