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 telah mencoba untuk mempercepat situs web Anda dan Anda menggunakan alat pengujian seperti Google PageSpeed Insight, satu peringatan yang mungkin Anda dapatkan adalah menghilangkan sumber daya yang memblokir render.
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 memecahkan masalah pemblokiran render, Anda perlu mengetahui dari mana asalnya. Anda dapat mengetahui sumber daya mana yang memblokir render dengan menjalankan pengujian pada Google PageSpeed Insight or Web.Ukur.
Anda dapat mengikuti langkah-langkah di bawah ini untuk menemukan sumber daya pemblokiran render:
1. Mengunjungi 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 Alat Blog, kami tidak memiliki masalah pemblokiran render untuk Desktop, tetapi kami memilikinya untuk seluler. Jadi untuk itu, kami akan menggunakan Seluler seperti yang dapat 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 yang disebut HasilkanTekanKami juga hosting di web host yang sangat cepat yang dikenal sebagai Cloudways.
Note: Anda tidak boleh terobsesi untuk mendapatkan skor 100 pada skor wawasan PageSpeed. Itu hanya panduan. Biasanya skor rata-rata 65 hingga 80 sudah cukup bagi kebanyakan orang. Jangan hapus file yang penting bagi 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
Ada banyak plugin WordPress yang dapat melakukan ini seperti W3 total cache, WP Rocket dan seterusnya. Namun, berdasarkan pengalaman saya dengan banyak situs web, Autoptimize selalu menanganinya jauh lebih baik daripada yang lain. Hebatnya, Autoptimize kompatibel dengan hampir semua plugin caching WordPress dan gratis.
Kunjungi direktori plugin WordPress untuk instal dan aktifkan 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 menghilangkan lebih lanjut, Anda dapat menggunakan JavaScript Asinkron, plugin yang dibuat oleh 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 masalah yang paling mungkin adalah tema atau host web Anda buruk, atau Anda memiliki plugin yang buruk terpasang. Saya sarankan Jalan Tol sebagai web host terbaik dan HasilkanTekan sebagai tema terbaik. Jika Anda seorang pemula, Bluehost dapat menanganinya tetapi jika Anda mampu membelinya, Cloudways adalah yang terbaik. Anda dapat memulainya secara gratis. Saya menggunakan GeneratePress dan Coudways untuk TargetTrend
Baca juga:
Cara membuat WordPress sangat cepat
Cara mengarahkan lalu lintas ke blog Anda
Artikel terkait
