Mengurangi ukuran konten paruh atas
Tetap teratur dengan koleksi
Simpan dan kategorikan konten berdasarkan preferensi Anda.
Aturan ini berlaku saat PageSpeed Insights mendeteksi bahwa diperlukan perjalanan jaringan tambahan untuk merender konten paruh atas halaman.
Ringkasan
Jika jumlah data yang diperlukan melebihi jendela kongesti awal (umumnya terkompres 14,6 KB), akan diperlukan roundtrip antara server Anda dan browser pengguna. Untuk pengguna pada jaringan dengan latensi yang tinggi seperti jaringan seluler, hal ini dapat menyebabkan penundaan yang signifikan pada pemuatan halaman.
Rekomendasi
Agar halaman dimuat lebih cepat, batasi ukuran data (markup HTML, gambar, CSS, JavaScript) yang dibutuhkan untuk merender konten paruh atas halaman.
Ada beberapa cara untuk melakukannya:
Susun HTML agar memuat konten paruh atas dan penting terlebih dahulu
Muat konten utama halaman Anda terlebih dahulu. Susun struktur halaman Anda agar respons awal dari server mengirimkan data yang diperlukan untuk segera merender bagian penting halaman dan menunda sisanya.
Artinya, Anda harus membagi CSS menjadi dua bagian: bagian inline yang bertanggung jawab untuk menata gaya bagian ATF konten, dan bagian yang dapat ditangguhkan.
Pertimbangkan contoh berikut tentang cara situs dapat disusun ulang agar dapat memuat lebih cepat:
Jika HTML Anda memuat widget pihak ketiga sebelum memuat konten utama, ubah urutannya agar memuat konten utama terlebih dahulu.
Jika situs Anda menggunakan desain 2 kolom dengan bilah sisi navigasi dan artikel, namun HTML Anda memuat sidebar sebelum artikel, pertimbangkan untuk memuat artikel terlebih dahulu.
Kurangi jumlah data yang digunakan oleh resource Anda
Setelah situs Anda didesain ulang agar berfungsi dengan baik di beberapa perangkat dan memuat konten penting terlebih dahulu, gunakan teknik berikut untuk mengurangi jumlah data yang diperlukan untuk merender halaman:
Kurangi resource: HTML, CSS, dan JavaScript dapat dikurangi dengan menghapus whitespace dan komentar yang tidak diperlukan. Pengoptimalan lebih lanjut mungkin dapat dilakukan melalui penggunaan alat yang mengubah nama variabel pada resource Anda.
[[["Mudah dipahami","easyToUnderstand","thumb-up"],["Memecahkan masalah saya","solvedMyProblem","thumb-up"],["Lainnya","otherUp","thumb-up"]],[["Informasi yang saya butuhkan tidak ada","missingTheInformationINeed","thumb-down"],["Terlalu rumit/langkahnya terlalu banyak","tooComplicatedTooManySteps","thumb-down"],["Sudah usang","outOfDate","thumb-down"],["Masalah terjemahan","translationIssue","thumb-down"],["Masalah kode / contoh","samplesCodeIssue","thumb-down"],["Lainnya","otherDown","thumb-down"]],["Terakhir diperbarui pada 2025-07-25 UTC."],[],["The core issue addressed is the delay in page loading caused by excessive data transfer required to render above-the-fold content. Key actions include structuring HTML to prioritize critical content, loading it first, and deferring non-essential parts. Recommendations involve reducing data size by minifying resources (HTML, CSS, JavaScript), using CSS instead of images when feasible, and enabling compression. The document advises optimizing content loading to avoid additional network round trips and improve page speed.\n"]]
