Cara Menghilangkan Sumber Daya Pemblokiran Render di WordPress (Sangat Mudah)
Sumber daya yang memblokir render dapat menjadi masalah besar bagi para blogger. Google terus memperingatkan untuk menghilangkannya. Ada banyak cara untuk menghapusnya, tetapi berikut ini adalah cara yang sangat sederhana yang tidak memerlukan pengkodean.
Memiliki blog atau situs web yang cepat sangatlah penting. Hal ini penting jika Anda ingin mendapatkan peringkat tinggi di mesin pencari. Jika situs web Anda sangat lambat, hal itu pasti akan merugikan SEO Anda.
Selain itu, situs web yang lambat dapat meningkatkan rasio pentalan, yang secara teknis akan merugikan merek Anda dalam banyak hal. Situs web yang lambat dapat memengaruhi pendapatan dan konversi.
Sebagian besar pengguna tidak sabar, jika situs Anda membutuhkan waktu terlalu lama untuk dimuat, mereka akan meninggalkannya dan beralih ke alternatif yang lebih cepat. Itu artinya pelanggan potensial atau pendorong pendapatan hilang.
Jika Anda mencoba mempercepat situs web Anda dan menggunakan alat pengujian seperti Google PageSpeed Insight , salah satu peringatan yang mungkin Anda dapatkan adalah untuk menghilangkan sumber daya yang menghambat rendering.
Dalam artikel ini, Anda akan mempelajari cara menghilangkan sumber daya yang memblokir render dengan mudah.
Apa yang dimaksud dengan sumber daya yang memblokir perenderan?
Sumber daya pemblokiran render adalah CSS dan JavaScript yang memperlambat waktu muat situs web karena harus diunduh oleh peramban web sebelum konten halaman dapat dirender.
Saat pengunjung mencoba mengakses situs web, browser akan segera mulai membaca situs web tersebut dari atas ke bawah. Jika ada CSS atau JavaScript, browser akan berhenti membaca hingga mengunduh dan memproses berkas tersebut. Sebelum browser dapat menampilkan konten di atas lipatan, browser harus mengunduh berkas CSS atau JavaScript.
Plugin atau tema yang Anda instal dapat menambahkan beberapa CSS dan JS tersebut. Beberapa tidak perlu dimuat terlebih dahulu, mereka dapat dimuat kemudian. Namun karena mereka ada di bagian atas, mereka memperlambat situs web Anda.
Jadi, yang dimaksud Google dengan "menghilangkan sumber daya yang menghalangi render" adalah Anda menghilangkan sumber daya yang tidak diperlukan dari bagian atas situs web Anda karena sumber daya tersebut memperlambat pemuatan konten situs web.
Cara menemukan sumber daya yang menghalangi render
Sebelum Anda dapat menyelesaikan masalah yang menghambat rendering, Anda perlu mengetahui dari mana masalah itu berasal. Anda dapat mengetahui sumber daya mana yang menghambat rendering dengan menjalankan pengujian di Google PageSpeed Insight atau Web.Measure.
Anda dapat mengikuti langkah-langkah di bawah ini untuk menemukan sumber daya pemblokiran render:
1. Kunjungi Google PageSpeed Insight
2. Masukkan alamat situs web Anda dan klik analisis
3. Gulir ke bawah dan perhatikan peringatan "eliminate render-blocking resources".
Periksa pada ketukan seluler dan desktop.
Untuk BloggingTools , kami tidak memiliki masalah pemblokiran rendering untuk desktop, tetapi kami memilikinya untuk perangkat seluler. Jadi, untuk keperluan ini, kami akan menggunakan perangkat seluler seperti yang Anda lihat di bawah ini.
Untuk perangkat seluler seperti yang dapat Anda lihat di atas, kami memiliki 2 masalah pemblokiran render. Dengan skor 93. Skornya memang lebih tinggi, tetapi demi postingan ini, saya harus menonaktifkan plugin Autoptimize.
BloggingTools.org mencapai skor ini tanpa optimasi karena kami menggunakan tema yang sangat cepat dan ringan bernama GeneratePress . Kami juga menggunakan layanan hosting web yang sangat cepat bernama Cloudways.
Catatan : Anda tidak perlu terobsesi untuk mendapatkan skor 100 pada PageSpeed Insight. Itu hanya panduan. Biasanya skor rata-rata 65 hingga 80 sudah cukup baik untuk sebagian besar orang. Jangan menghapus file yang penting untuk bisnis Anda.
Hal yang baik tentang WordPress adalah Anda tidak perlu melakukan semuanya secara manual. Ada beberapa plugin berkode bagus yang dapat membantu.
Cara memperbaiki masalah menghilangkan sumber daya yang menghalangi render di WordPress
Ikuti langkah-langkah berikut untuk memperbaiki masalah pemblokiran sumber daya render:
1. Instal dan aktifkan Autoptimize
Terdapat banyak plugin WordPress yang dapat melakukan hal ini, seperti W3 Total Cache, WP Rocket , dan sebagainya. Namun, berdasarkan pengalaman saya dengan banyak situs web, Autoptimize selalu menanganinya jauh lebih baik daripada plugin lainnya. Hal yang luar biasa adalah Autoptimize kompatibel dengan hampir semua plugin caching WordPress dan gratis.
Kunjungi direktori plugin WordPress untuk menginstal dan mengaktifkan Autoptimize.
2. Kunjungi pengaturan Autoptimize
Jika Anda perlu menemukan pengaturan Autoptimize, pada dasbor WordPress Anda klik pengaturan lalu klik Autoptimize.
3. Optimalkan JavaScript
Di bawah opsi JavaScript, pilih Optimalkan kode skrip dan pilih juga agregat file JS. Anda dapat menemukan pengaturan yang saya gunakan untuk BloggingTools di bawah ini.
4. Optimalkan CSS
Di bawah opsi Optimalkan CSS, pilih Optimalkan kode CSS. Pilih juga agregat file CSS dan “Juga agregat CSS sebaris.” Lihat Opsi yang saya gunakan untuk BloggingTools di bawah ini.
5. Optimalkan HTML
Jika Anda menginginkan kinerja yang lebih baik, Anda juga dapat menggunakan Autoptimize untuk mengoptimalkan HTML. Di bawah Opsi HTML, pilih optimalkan Kode HTML. Anda dapat melihat pengaturan yang saya gunakan untuk BloggingTools di bawah ini.
6. Periksa Opsi Lain-lain
Anda dapat memeriksa Opsi Lain-lain dan mengubah beberapa pengaturan sesuai keinginan Anda. Anda dapat menemukan pengaturan untuk BloggingTools di bawah ini.
7. Simpan dan kosongkan cache.
Selanjutnya, klik saja Simpan dan kosongkan cache. Itu saja!
Setelah semua ini, Anda dapat memeriksa situs Anda lagi di Google PageSpeed Insight. Untuk BloggingTools, segera setelah melakukan ini, skor kami melonjak hingga 95 dan semua peringatan menghilangkan sumber daya yang menghalangi render menghilang sepenuhnya. Lihat di bawah.
Harap perhatikan bahwa tergantung pada berapa banyak sumber daya pemblokiran render yang Anda miliki dan seberapa pentingnya sumber daya tersebut bagi situs Anda, beberapa di antaranya mungkin tetap ada. Jangan mencoba menghapusnya.
Jika Anda ingin melakukan penghapusan lebih lanjut, Anda dapat menggunakan Async JavaScript , sebuah plugin dari penulis yang sama dengan Autoptimize. Keduanya bekerja bersama. Saya tidak merekomendasikan ini karena dapat merusak situs Anda. Autoptimize saja sudah cukup!
Kesimpulan
Kecepatan itu penting dan menghilangkan sumber daya yang menghalangi render dapat membantu situs web Anda dimuat lebih cepat dan memberi situs Anda skor yang lebih baik pada alat uji kecepatan. Namun, Anda tidak boleh terobsesi dengan skor ini karena skor tersebut hanya ada sebagai panduan.
Jika situs web Anda masih sangat lambat setelah ini, tiga kemungkinan masalah yang paling mungkin adalah tema atau penyedia hosting web Anda buruk, atau Anda memiliki plugin yang buruk terpasang. Saya merekomendasikan Cloudways sebagai penyedia hosting web terbaik dan GeneratePress sebagai tema terbaik. Jika Anda seorang pemula, Bluehost dapat menanganinya, tetapi jika Anda mampu, Cloudways adalah yang terbaik. Anda dapat memulai secara gratis. Saya menggunakan GeneratePress dan Cloudways untuk TargetTrend.
Baca juga:
Cara membuat WordPress sangat cepat
Cara mengarahkan lalu lintas ke blog Anda
Artikel terkait
