Apa yang dimaksud render yang memblokir?
- Render artinya loading, jadi sesuatu yang memblokir render maksudnya bahwa javascript yang menghalangi halaman dari loading cepat.
Catatan: Artikel ini adalah tentang hal yang membuat blokir javascript, tidak menjadikan memblokir css (yang merupakan hal yang sama sekali berbeda). cara mengeliminasi css pemblokir render.
Javascript yang memblokir loading/render
Google merekomendasikan 1 untuk menghapus atau menunda javascript yang mengganggu dalam loading konten paruh atas halaman web Anda. Google merekomendasikan 1 untuk dihapus atau menunda javascript yang mengganggu konten paruh atas pada halaman web anda.
Bagaimana untuk mengenali javascript yang memblokir render
Anda perlu tahu apa halaman anda sedang loading. Ada beberapa cara untuk mengatasi hal ini. Saran saya anda harus lihat apa halaman anda sedang memuat dengan menggunakan alat Pagespeed tool untuk mereview isu-isu yang ada pada halaman anda secara spesifik file-file yang berlaku dalam perenderan, dapat menggunakan alat
Google pagespeed insights tool. Alat ini akan menceritakan dwngan tepat tetntang file-file yang memblokir halaman Anda.
Cara menghapus javascript yang memblokir render
Pelakunya paling umum adalah javasrip, dan contoh yang benar-benar hebat untuk ini adalah jQuery yang merupakan file javascript yang digunakan pada sebagian besar halaman web. Hal ini sangat mungkin anda menggunakanya ( mengetahui alat). File javascript ini agak besar, sebenarnya mungkin itu sangat baik menjadi file terbesar pada halaman web anda yang sedang loading untuk membuat halaman anda. jQuery adalah file javasceipt populer,yang sering digunakan untuk melakukan hal-hal yang sangat kecij, seperti fade in atau gambar yang keluar misalnya. Tidak biasanya ada alasan untuk memuat jQuery sebelum anda memuat halaman web anda namun sebagian besar dari halaman melakukannya. Jika anda menggunakan jQuery untuk merender di paruh bawah maka tidak ada alasan untuk memuatnya sebelum di perlukan.Jika anda memuat sebelumnya, maka anda tidak mengikuti pedoman Page speed ini dan anda membuat pengguna menunggu.
Untuk memperbaiki ini anda harua mengubah mana panggilan untuk yang jQuery lakukan. Hal ini dilakukan dalam html halaman web anda. Cara yang sering website saat memanggil jQuery adalah pada dokumen jead seperti yang ditunjukan dibawah ini.
.
Untuk memperbaiki ini anda harua mengubah mana panggilan untuk yang jQuery lakukan. Hal ini dilakukan dalam html halaman web anda. Cara yang sering website saat memanggil jQuery adalah pada dokumen jead seperti yang ditunjukan dibawah ini.
.
<head>
<meta name=description content="description here."/>
<title>title here</title>
<style>
styles here
</style>
<script src="jquery.js">
</script>
</head>
<meta name=description content="description here."/>
<title>title here</title>
<style>
styles here
</style>
<script src="jquery.js">
</script>
</head>
Atas flip berarti apa yang pengguna melihat pada layar. Layar dekstop atau apapun, layar ponsel, ipad,komputer dekstop atau apapun yang pengguna lihat halaman web anda.
Panggilan untuk jQuery (file agak besar) dibuat dan harus di-download oleh browser sebelum hal lain ditampilkan pada halaman. Ini buruk. Ini benar-benar benar-benar buruk jika hal yang Anda gunakan jQuery bahkan tidak diperlukan untuk konten paruh atas seperti yang ditunjukkan pada gambar di atas.
Sebuah parsial sering digunakan untuk solusi parsial
Sering panggilan untuk jQuery akan dihapus dari dokumen head dan pindah ke tempat lain di bagian bawah halaman, karena tidak diperlukan sampai saat itu. Sayangnya hal ini tidak cukup.
<!-- the things you don't need jquery for (most of your page) is here -->
<script src="jquery.js">
</script>
<!-- the thing you need jQuery for is here -->
<script src="jquery.js">
</script>
<!-- the thing you need jQuery for is here -->
Solusi Nyata
Untuk menghapus javascript dari jalur render akan ditunda sampai setelah beban halaman.
Untuk mengikuti arahan ini anda perlu tahu baik, apa halaman anda memuat dan mengapa memuatnya
Apa pun yang memanggil (call page web anda ,biaya pengguna anda lebih banyak waktu menunggu mereka. Jika Anda tidak tahu apa yang meminta halaman web anda perbuat, Anda harus mulai mengetahui. JQuery adalah contoh yang baik karena sangat umum dan seperti file besar (sekitar 100kb). Skenario umum semua adalah bahwa halaman web kecil yang hanya 10kb memanggil file besar seperti jQuery (yang 10 kali lebih besar dari halaman web itu sendiri) untuk melakukan beberapa tugas biasa seperti fade dalam beberapa kata di halaman. Anda mungkin berpikir "hey kelihatan keren!" ketika Anda melihatnya, tetapi apakah itu cukup tenang untuk membuat pengguna anda menunggu 10 kali lebih banyak waktu untuk melihat halaman anda? efek yang sama persis bisa terjadi dengan css atau javascript yang lebih kecil. Menggunakan jQuery sebagai contoh, tapi bukan berarti itu jelek. Hal yang sama bisa dikatakan bahkan javascript biasa seperti Google analystic, atau javascript pihak ketiga yang menunjukan widget sosial atau bahkan tombol-tombol facebook, Twitter, yang banyak disukai orang.
Mengetahui apa yang halaman Anda gunakan? dan keputusan apa yang layak membuat pengunjung anda menunggu.
Mengetahui apa yang halaman Anda gunakan? dan keputusan apa yang layak membuat pengunjung anda menunggu.
- Menggunakan alat uji kecepatan bis anda gunakan untuk mengetahui webpage Anda. Pagespeed tool.
- Untuk menghapus javascript yang membloking render anda bisa menundanya. mengeliminasi css memblokir render.
- permintaan css dan javascript.
0 komentar:
Untuk Melanjutkan Membaca Silahkan Lengkapi Form Ini