Mengurangi total cache wordpress w3 javascript yang tidak terpakai

“Hapus JavaScript yang tidak terpakai” adalah rekomendasi yang mungkin Anda temui saat menjalankan uji kecepatan halaman situs WordPress Anda di Lighthouse. File JavaScript yang tidak digunakan adalah sumber pemblokiran render yang merupakan salah satu penyebab utama memperlambat kecepatan halaman. Selain itu, mereka sangat memengaruhi kinerja situs dan pengalaman pengguna

Oleh karena itu, saat Anda menjalankan pengujian kecepatan halaman, Lighthouse menandai file JavaScript dengan lebih dari 20 KB kode yang tidak digunakan. Dalam hal ini, Anda harus menghapus file JS yang tidak terpakai ini. Tapi, bagaimana cara menghapus JavaScript yang tidak terpakai di WordPress? . Jadi, mari kita mulai.  

Cara Menghapus JavaScript yang Tidak Digunakan di WordPress

Saat merender halaman Anda, browser harus memuat, mengompilasi, dan mengevaluasi JavaScript yang tidak terpakai sebelum melanjutkan pekerjaan lain yang diperlukan. Yang pada akhirnya memperlambat waktu pemuatan dan berdampak pada kinerja

Mengurangi total cache wordpress w3 javascript yang tidak terpakai

Solusi terbaik untuk memperbaiki masalah ini adalah menghapus JS yang tidak terpakai. Jadi, inilah cara menghapus JavaScript yang tidak terpakai di WordPress

Deteksi JavaScript yang Tidak Digunakan

Pertama, Anda harus menganalisis dan mendeteksi JavaScript yang tidak terpakai. Menggunakan tab cakupan di Chrome DevTools, Anda dapat melakukan tugas ini

  • Tekan Ctrl+Shift+C dan Command+Shift+C (pengguna MAC) untuk membuka DevTools
  • Kemudian, tekan Ctrl+Shift+P dan Command+Shift+P (pengguna MAC)
  • Setelah itu akan muncul menu perintah, maka ketik Coverage dan pilih perintah “Show Coverage”.
  • Dari tab cakupan, klik tombol muat ulang untuk memuat ulang dan mulai menangkap file JS dan CSS
  • Filter cakupan dengan memilih JavaScript untuk hanya melihat file JS
  • Sekarang Anda akan melihat sesuatu seperti gambar berikut. Di sini, di kolom terakhir, warna merah menyiratkan JS yang tidak digunakan, dan warna biru menyiratkan JS yang digunakan

Mengurangi total cache wordpress w3 javascript yang tidak terpakai

  • Klik pada URL, dan itu akan membuka sumber daya dan menampilkan perincian semua kode yang digunakan dan tidak digunakan

Hapus JS yang Tidak Digunakan di WordPress

  • Masuk ke Antarmuka Admin WordPress Anda
  • Arahkan ke opsi Penampilan dari bilah sisi kiri lalu klik Editor Tema
  • Dari bilah sisi kanan, klik fungsi. php. , dan ini akan memunculkan fungsi. editor kode php
  • Sekarang, mengikuti gambar di bawah ini, Anda dapat mengedit kode untuk menghapus file JS yang tidak terpakai pada fungsi Anda. php. file

* so that it is after the script was enqueued.
 */
function wp_remove_scripts() {
// check if user is admin
	if (current_user_can( 'update_core' )) {
            return;
        } 
	else {
    // Check for the page you want to target
    if ( is_page( 'homepage' ) ) {
        // Remove Scripts
		wp_dequeue_style( 'jquery-ui-core' );
	    }
	}
}
add_action( 'wp_enqueue_scripts', 'wp_remove_scripts', 99 );

Selain itu, Anda dapat menggunakan plugin untuk menghapus file JavaScript yang tidak penting. Yang terbaik adalah-

  • Roket WP
  • Pembersihan Aset
  • Masalah
  • Gonzales
  • Penyelenggara Plugin

Kesimpulan

Pengunjung Anda akan merasa frustasi ketika mereka melihat bahwa halaman Anda membutuhkan banyak waktu untuk memuat. Kecepatan pemuatan halaman yang lambat bahkan dapat meningkatkan rasio pentalan. Untuk mengoptimalkan kecepatan halaman, menghapus file JavaScript yang tidak terpakai adalah salah satu cara penting

Untuk memastikan kinerja terbaik, Anda harus berusaha memiliki file JS sesedikit mungkin di situs Anda. Sekarang Anda tahu cara menghapus javascript yang tidak digunakan di WordPress, mulailah mengerjakannya sekarang. Memang, Anda dapat meningkatkan kinerja situs serta pengalaman pengguna.   

Beberapa waktu lalu, saya menyebutkan tentang Plugin Organizer dan manfaat memuat plugin di halaman saat kita hanya membutuhkannya karena kita ingin memperkecil ukuran halaman dan membuat halaman WordPress kita memuat lebih cepat, terutama jika kita menggunakan plugin cache seperti W3 Total Cache

Namun, ada situasi ketika kita membutuhkan plugin di halaman atau kita menggunakan tema, tetapi beberapa file CSS dan JavaScript tidak diperlukan. Bayangkan halaman kontak di mana Anda hanya memiliki beberapa teks dan formulir dan Anda menggunakan tema yang memuat banyak file CSS dan JavaScript yang tidak berguna. Tidak ideal untuk pengunjung situs web kami yang seharusnya menikmati pemuatan halaman yang lebih cepat

Saya telah memutuskan untuk menulis plugin gratis resmi pertama saya dan membaginya dengan komunitas WordPress

WP Asset Clean Up memindai halaman yang sedang Anda edit, mendeteksi skrip dan gaya yang dimuat, dan menampilkannya dalam daftar tempat Anda dapat memilih yang tidak ingin Anda muat

Mengurangi total cache wordpress w3 javascript yang tidak terpakai

Apa keuntungan menggunakan plugin ini?

  • Permintaan HTTP di situs web Anda akan berkurang sehingga menghemat bandwidth Anda (bagus, jika Anda tidak memiliki host tanpa batas) dan halaman Anda akan memuat lebih cepat
  • Jika ada konflik antar skrip (dari plugin/tema) yang dimuat di halaman yang sama, Anda dapat menghapus skrip yang tidak diperlukan, sehingga meminimalkan risiko kesalahan JavaScript. Jika Anda seorang pengembang, Anda tahu betapa sakit kepala yang Anda alami ketika Anda men-debug kesalahan pada halaman yang memiliki 20. file js dimuat dari berbagai plugin (dan Anda hanya membutuhkan 5 di antaranya)
  • Kode sumber HTML akan lebih kecil, lebih bersih, dan lebih mudah dibaca saat Anda perlu menemukan sesuatu
  • File log Apache juga akan lebih kecil dan lebih mudah dibaca karena lebih sedikit permintaan yang dibuat ke server

Plugin ini sangat kuat dalam kombinasi dengan plugin cache yang juga menggabungkan sisa aset yang dimuat (. css dan. js) untuk meminimalkan jumlah permintaan HTTP

Bagaimana cara memperbaiki pengurangan JavaScript yang tidak digunakan di WordPress?

Menghapus atau Mengurangi Sumber Daya JS yang Tidak Digunakan dengan Plugin . Anda tidak harus benar-benar melakukan hal lain. WP Rocket akan menangani semuanya, dan Anda akan melihat perbedaan nyata dalam skor kinerja dan laporan PSI Anda. In the File Optimization tab, go to the Delay JavaScript Execution option and flag it. You don't have literally to do anything else. WP Rocket will take care of everything, and you'll see an evident difference in your performance score and the PSI report.

Bagaimana cara menghapus CSS yang tidak terpakai dari total cache W3?

Bagaimana cara “Menghapus CSS yang tidak digunakan” dengan W3 Total Cache? .
Hapus CSS yang tidak digunakan
Hilangkan resource yang memblokir render
Kurangi waktu respons server awal
Hapus JavaScript yang tidak digunakan

Bagaimana Anda mengurangi JavaScript yang tidak terpakai?

Cara Menghapus JavaScript yang Tidak Digunakan Di WordPress (Biasanya Disebabkan Oleh Plugin, Kode Pihak Ketiga, Pembuat Tema/Laman) .
Temukan file JavaScript terbesar Anda
Gunakan tema yang ringan
Hindari plugin yang membengkak
Kurangi kode pihak ketiga
Tunda JavaScript pihak ketiga
Aktifkan pengaturan kinerja Elementor/Divi

Bagaimana cara menghapus JavaScript dan CSS yang tidak digunakan di WordPress?

Pada layar edit postingan, Anda akan menemukan kotak Pembersihan Aset tepat di bawah editor postingan . Plugin akan secara otomatis mengambil dan mencantumkan semua file dan aset yang dimuat saat pengunjung melihat halaman ini di situs web Anda. Anda kemudian dapat membongkar file CSS atau JavaScript yang tidak terpakai yang tidak Anda perlukan di halaman itu.