Langsung ke konten utama

Cara Menghilangkan Render-Blocking Scripts dan CSS Blogger

Gambar
Oleh
Karena kecepatan dalam loading atau memuat sebuah halaman blog sangat penting, inilah yang menjadi alasan saya menulis tentang bagaimana membuat blog atau situs memuat lebih cepat Apa itu Render-Blocking Scripts dan CSS? Render blocking script biasanya merupakan skrip dari sumber eksternal yang disebut dengan tag <srcipt src="...../files/style.css"/> dan masalahnya terletak pada URL atau penyimpanan file javascript. Beberapa masalah umum dengan skrip eksternal adalah: URL yang berisi file Javascript dialihkan ke beberapa URL dan kemudian mencapai file Javascript. URL yang berisi file Javascript merespon secara perlahan karena kesalahan server. URL yang berisi file Javascript terkadang tidak merespon karena status server down. Mirip dengan file Javascript, ada beberapa file CSS yang tersimpan secara eksternal memiliki masalah yang sama seperti yang disebutkan di atas. Cara Mengidentifikasi Render-Blocking Scripts Untuk mengidentifikasi skrip pemblokiran atau css, Kamu perlu menggunakan PageSpeed ​​Insights. Ini akan menunjukkan file script dan css yang menghalangi dan membuat load halaman Kamu lambat. Cara Hapus Render-Blocking Scripts Dan CSS Dari Blogger Langkah 1: Temukan skrip render-blocking dengan menggunakan Google PageSpeed ​​Insights seperti yang ditunjukkan pada gambar di atas. Langkah 2: Pergi ke dashboard blogger> Template> Edit Html. Langkah 3: Cari script atau CSS dengan menggunakan CTRL + F di kode yang Kamu temukan untuk diblokir di alat PageSpeed ​​Insights. Langkah 4: Lakukan hal-hal berikut: Untuk Javascript: 1. Tambahkan Tag "Defer" Tag defer adalah tag yang menghentikan skrip saat memuat sehingga meningkatkan kecepatan pemuatan halaman blog. Untuk menambahkan tag defer ke javascript Kamu cukup tambahkan defer='defer' seperti yang ditunjukkan pada contoh di bawah ini: <Script defer="defer" src="...file/code.js"/> 2. Tambahkan Javascript Eksternal secara internal: Jika kamu melihat javascript saat memuat di blog, yang di alihkan atau membutuhkan waktu yang lama untuk memuat daripada menambahkan kode di atas </head> lebih baik memindahnya ke host lain seperti GitHub. baca caranya di sini 3. Hapus Blocking Code: Jika kamu sudah mencoba cara di atas dan masih merasa bahwa skrip tersebut masih terasa berat maka hapus skrip atau salin dan tambahkan di Tata Letak sebagai gadget. 4. Gunakan "async" Tag: Tag ini memberi tahu halaman bahwa kode yang disinkronkan akan dijalankan saat tersedia (avalible) dan tidak akan dijalankan bila tidak tersedia sehingga meminimalkan kecepatan pemuatan halaman. Untuk menambahkan tag async ke kode template cukup tambahkan async='async' karena blogger tidak menerima async saja. Berikut adalah contohnya: <Script async="async" src="...file/code.js"/> Untuk CSS: 1. Tambahkan CSS di <head>: Jika kamu memiliki kode CSS yang tersimpan secara eksternal namun kamu memasukkannya ke dalam body dengan menggunakan kode di bawah ini: <Link href="...file/code.css" rel ="stylesheet" type="text/css"/> Cukup pindahkan di bawah <head> di template blog 2. Gunakan Github: Jika hosting milikmu tidak merespons pada waktunya atau memiliki banyak pengalihan (seperti pada GOOGLE DRIVE), gunakan Github untuk menyimpan kode. Langkah 5: Simpan template Anda dan Anda berhasil dilakukan. Apa yang Harus Dilakukan Untuk Memblokiran Internal Javacript Atau CSS? Jika kamu memiliki kode internal yang memblokir halamanmu saya sarankan untuk mencopotnya/membuangnya, karena kamu tidak dapat mengubahnya. Dengan mengikuti langkah-langkah di atas kamu dapat menghapus pemblokiran javascript dan css namun jika kamu memerlukan kode tersebut dan kamu ingin menyimpannya namun meminimalkan kecepatan pemuatan maka jangan hapus kode tapi simpan di github atau di tata letak. kamu mungkin tidak melihat peningkatan alat di Google PageSpeed ​​Insights namun pasti akan ada beberapa perbaikan yang akan kamu amati saat memuat halaman blog. Saya harap posting ini bermanfaat bagi kalian, Terima kasih telah mengunjungi UNDI LIFE. Jangan sungkan untuk meninggalkan komentar di bawah. keep blogging. Keyword Tag: Cara Menghilangkan Render-Blocking Scripts Dan CSS - Blogger, Blogger blog page loading speed, cara menghapus script dan css dari blog blogger, cara mempercepat blog, cara membuat blog lebih cepat loading.

Karena kecepatan dalam loading atau memuat sebuah halaman blog sangat penting, inilah yang menjadi alasan saya menulis tentang bagaimana membuat blog atau situs memuat lebih cepat

Apa itu Render-Blocking Scripts dan CSS?

Render blocking script biasanya merupakan skrip dari sumber eksternal yang disebut dengan tag <srcipt src="...../files/style.css"/> dan masalahnya terletak pada URL atau penyimpanan file javascript. Beberapa masalah umum dengan skrip eksternal adalah:

URL yang berisi file Javascript dialihkan ke beberapa URL dan kemudian mencapai file Javascript.
  • URL yang berisi file Javascript merespon secara perlahan karena kesalahan server.
  • URL yang berisi file Javascript terkadang tidak merespon karena status server down.
  • Mirip dengan file Javascript, ada beberapa file CSS yang tersimpan secara eksternal memiliki masalah yang sama seperti yang disebutkan di atas.

Cara Mengidentifikasi Render-Blocking Scripts

Untuk mengidentifikasi skrip pemblokiran atau css, Kamu perlu menggunakan PageSpeed ​​Insights. Ini akan menunjukkan file script dan css yang menghalangi dan membuat load halaman Kamu lambat.


Cara Hapus Render-Blocking Scripts Dan CSS Dari Blogger

Langkah 1: Temukan skrip render-blocking dengan menggunakan Google PageSpeed ​​Insights seperti yang ditunjukkan pada gambar di atas.

Langkah 2: Pergi ke dashboard blogger > Template > Edit Html.

Langkah 3: Cari script atau CSS dengan menggunakan CTRL + F di kode yang Kamu temukan untuk diblokir di alat PageSpeed ​​Insights.

Langkah 4: Lakukan hal-hal berikut:

Untuk Javascript:
1. Tambahkan Tag "Defer"
Tag defer adalah tag yang menghentikan skrip saat memuat sehingga meningkatkan kecepatan pemuatan halaman blog. Untuk menambahkan tag defer ke javascript Kamu cukup tambahkan defer='defer' seperti yang ditunjukkan pada contoh di bawah ini:

<Script defer="defer" src="...file/code.js"/>

2. Tambahkan Javascript Eksternal secara internal:
Jika kamu melihat javascript saat memuat di blog, yang di alihkan atau membutuhkan waktu yang lama untuk memuat daripada menambahkan kode di atas </head> lebih baik memindahnya ke host lain seperti GitHub. baca caranya di sini

3. Hapus Blocking Code:
Jika kamu sudah mencoba cara di atas dan masih merasa bahwa skrip tersebut masih terasa berat maka hapus skrip atau salin dan tambahkan di Tata Letak sebagai gadget.

4. Gunakan "async" Tag:
Tag ini memberi tahu halaman bahwa kode yang disinkronkan akan dijalankan saat tersedia (avalible) dan tidak akan dijalankan bila tidak tersedia sehingga meminimalkan kecepatan pemuatan halaman. Untuk menambahkan tag async ke kode template cukup tambahkan async='async' karena blogger tidak menerima async saja. Berikut adalah contohnya:

<Script async="async" src="...file/code.js"/>

Untuk CSS:
1. Tambahkan CSS di <head>:
Jika kamu memiliki kode CSS yang tersimpan secara eksternal namun kamu memasukkannya ke dalam body dengan menggunakan kode di bawah ini:

<Link href="...file/code.css" rel ="stylesheet" type="text/css"/>

Cukup pindahkan di bawah <head> di template blog

2. Gunakan Github:
Jika hosting milikmu tidak merespons pada waktunya atau memiliki banyak pengalihan (seperti pada GOOGLE DRIVE), gunakan Github untuk menyimpan kode.


Langkah 5: Simpan template Anda dan Anda berhasil dilakukan.


Apa yang Harus Dilakukan Untuk Memblokiran Internal Javacript Atau CSS?

Jika kamu memiliki kode internal yang memblokir halamanmu saya sarankan untuk mencopotnya/membuangnya, karena kamu tidak dapat mengubahnya.

Dengan mengikuti langkah-langkah di atas kamu dapat menghapus pemblokiran javascript dan css namun jika kamu memerlukan kode tersebut dan kamu ingin menyimpannya namun meminimalkan kecepatan pemuatan maka jangan hapus kode tapi simpan di github atau di tata letak. kamu mungkin tidak melihat peningkatan alat di Google PageSpeed ​​Insights namun pasti akan ada beberapa perbaikan yang akan kamu amati saat memuat halaman blog.

Saya harap posting ini bermanfaat bagi kalian, Terima kasih telah mengunjungi UNDI LIFE. Jangan sungkan untuk meninggalkan komentar di bawah. keep blogging.

Keyword Tag: Cara Menghilangkan Render-Blocking Scripts Dan CSS - Blogger, Blogger blog page loading speed, cara menghapus script dan css dari blog blogger, cara mempercepat blog, cara membuat blog lebih cepat loading.
Label:

Komentar

Posting Komentar

Postingan populer dari blog ini

7 Kesalahan Yang dilakukan blogger Indonesia

Oleh
Saya sering sekali melakukan blogwalking entah itu sengaja mencari menggunakan keyword atau hanya sekedar bertukar komentar di grup facebook, saya tidak hanya berkunjung dan berkomentar, tapi juga mengamati setiap blog yang saya kunjungi, kebanyakan dari mereka tidak ada yang sangat sangat menonjol dalam blogging, hampir semua topik yang ditulis sama bahkan hanya menulis ulang lalu memberi sumber artikel. apakah blog kamu termasuk yang seperti itu? saya sudah meneliti dan mengamati, dan membuat daftar kesalalahan yang dilakukkan oleh blogger Indonesia, sangat jauh beda dengan blogger luar, yang notabenya para ibu muda beranak dua:). berikut daftarnya: 1. Topik Sama mungkin kalau Niche sama itu bukan masalah, hanya bisa berkompetisi atau tidak. namun kalau isi post dan judul sama, topiknya itu itu aja yang orang lain sudah post terlebih dulu, saya rasa mereka terlalu membuang waktu. yah itu memang terserah mereka. tapi ingat Google sangat menyukai sesuatu yang baru, yan...
19 komentar
Read more »

Asa Butterfield for Boys by Girls Issue 10

Oleh
A S A   B U T T E R F I E L D F O R   I S S U E   1 0 "Bahkan hal yang terkecil dapat membuat gelombang kolosal." Dia mungkin telah memulai sebagai anak kecil dengan mata biru yang besar di 'The Boy in the Striped Pyjamas', tapi dia telah berubah sejak menjadi seorang jenius matematika, martian, dan menjadi superhero luar biasa. Asa Butterfield adalah seorang aktor Inggris berusia 18 tahun dari London yang berada di bawah sorotan Boys by Girls dan di sampul untuk Issue 10, 'Muse'. Penggambaran diri 'luar biasa' tidak cukup bersikap adil. Dia lebih dari brilian, lebih dari luar biasa dan dia benar-benar bisa untuk apa pun. Aktor membuka baru, dunia imajiner kita semua bisa melarikan diri ke dalam dan imajinasi Asa adalah bagian kunci bagaimana pikirannya bekerja. Sepanjang Issue 10 pemotretannya dia dengan Editor-in-Chief Cecilie Harris dan Editor Mode David Nolan, kami menemukan Asa cukup jeniu...
8 komentar
Read more »

MattyBRaps Low Key Lyrics

Oleh
Low Key Lyrics by Matty B That’s what it is, what it is When you live, tryna keep it low key You know me, always finding myself in interesting times Growing up, sharing my stories through these intricate rhymes so check it I met this dime she looked kinda familiar But people change with time and I couldn’t remember her so I Struck up a conversation nothing unusual But after a couple hours I knew feelings were mutual and I’m Ready to tell everyone that i know but she like yo, we should keep it on the low Ought oh, I could see through it and I know how it goes There's no reason we should be tryna distance anyone close Especially when we just started having feelings like those I’ll admit it I was digging her so i just let it go For a chance at romance I went along with the plans But then there was a side of me that could see how it would end But then when you get in it, it can get kinda hard to defend against her Feminine venom has got me forgetting wisdom aga...
4 komentar
Read more »

David Parejo 2016

Oleh
Best David Parejo Photo shoot 2016 Hola Daviders Lemme show ya the best David parejo's photo (selfies) 2016 Greeting from #DavidparejoINDONESIA #DavidersINDONESIA save to your computer it's FREE :D
7 komentar
Read more »

Cara Membuat Blog Agar User Friendly

Oleh
Blog User Friendly . Ketika saya membicarakan desain blog, salah satu yang paling sering saya lakukan adalah untuk "membersihkan" layout blog. Jika kamu orang yang sering mengunjungi blog saya , Kamu mungkin memperhatikan bahwa saya baru saja membuat beberapa perubahan pada blog saya sendiri selama beberapa hari terakhir dalam upaya untuk membuat blog saya lebih bersih, efisien dan user friendly. desain blog hampir sama seperti desain interior. Ini subjektif - Setiap orang memiliki selera pribadi mereka sendiri. Tapi ada hal yang dapat kamu lakukan untuk mengoptimalkan pengalaman pembaca kalian ketika mereka mengunjungi blog. Maksud saya, kamu ingin seseorang untuk berlama-lama ketika mereka mengunjungi blog kamu untuk pertama kalinya, kan? Kita semua tahu bahwa konten adalah Raja, tetapi jika blog kamu terlalu berantakan, tak seorang pun akan melihatnya. Berikut adalah beberapa perubahan yang saya buat untuk membantu membuat blog saya lebih user friendly da...
5 komentar
Read more »