Bagaimana cara mengurangi jumlah file javascript di wordpress?

Pelajari cara mengurangi waktu eksekusi javascript dan meningkatkan Pagespeed. Eksekusi Javascript. waktu adalah apa namanya sudah mengatakan. Ini adalah waktu yang dibutuhkan js untuk melakukan parsing, kompilasi, dan menjalankan fungsi, panggilan, dll

Daftar isi

Cara mengidentifikasi waktu eksekusi Javascript yang besar di WordPress

Lakukan tes menggunakan Pagespeed, dan identifikasi file yang mengandung kesalahan

Menggunakan Webpagetest

Lakukan pengujian Data Web Inti menggunakan Webpagetest. org, klik “Total Blocking Time” dan identifikasi file javascript dengan waktu eksekusi yang besar

Setelah mengidentifikasi kesalahan, terapkan langkah-langkah berikut untuk mengurangi waktu eksekusi javascript di WordPress

Tunda javascript plugin

Flying Scripts adalah plugin gratis, teruji, dan terkini yang memungkinkan Anda memuat javascript setelah interaksi pengguna. Instal di WordPress dan tempatkan kata kunci yang Anda inginkan untuk menunda plugin javascript

Untuk menemukan kata kunci, Anda dapat menggunakan nama aset atau menggunakan Alat Pengembang Chrome;

Tempatkan kata kunci domain pada Flying Scripts

Consider hosting the 3rd party heavy javascript locally on your website, and then delay it if delaying inst supported.

Tunda menggunakan WP Rocket

Wp Rocket memperbarui logikanya untuk menunda javascript, sekarang menunda semua javascript, termasuk skrip sebaris, dan memiliki daftar pengecualian default (di samping daftar pengecualian js internal)

Menunda plugin pihak ke-3 juga akan memperbaiki peringatan "Kurangi dampak pihak ketiga" Pagespeed

Kotak teks sekarang adalah untuk menempatkan javascript yang ingin Anda kecualikan. Gunakan itu untuk menempatkan javascript penting yang tidak dapat dimuat dengan malas

Rumus berikut akan disertakan secara default di WP Rocket dan mengecualikan Javascript penting untuk menghindari kesalahan

(?:wp-content|wp-includes)(.*)
/jquery-?[0-9.]*(.min|.slim|.slim.min)?.js
js-(before|after)

Alasan di balik formula ini adalah sebagai berikut

• (?. wp-content. wp-termasuk)(. ) – mengecualikan semua file javascript internal
• /jquery-?[0-9. ](. min. langsing. langsing. menit)?. js – tidak termasuk jQuery
• js-(sebelumnya. setelah) – mengecualikan skrip sebaris. Hanya skrip sebaris yang ditambahkan menggunakan wp_add_inline_script() yang akan dikecualikan

Beralih ke plugin yang lebih baik

Beralih ke plugin dengan fungsi yang sama tetapi dengan ukuran yang lebih kecil, dan muatan javascript yang lebih kecil

• Pertimbangkan Novashare daripada Social Warfare
• Pertimbangkan Crisp daripada plugin obrolan javascript yang berat. Lihat artikel ini tentang membandingkan kecepatan plugin obrolan

Terapkan pemecahan kode

Jika Anda memiliki aplikasi situs web WordPress dan menggunakan Javascript di tumpukan Anda, terapkan pemecahan kode, membagi JavaScript menjadi potongan-potongan yang lebih kecil, yang memungkinkan pemuatan berbagai komponen yang lebih cerdas

Read here how Instagram improved their infinite scrolling feed performance with 25% reduction in time taken to load photos using task priorization and other techniques.

Hapus Recaptcha dan gunakan pertarungan bot, atau tunda Recaptcha Javascript

Pertimbangkan untuk menggunakan captcha yang lebih kecil seperti tantangan matematika, bukan Recaptcha. Siapkan Cloudflare dan aktifkan perlindungan bot/email jika sesuai dengan pertempuran spam/bot Anda

Anda juga dapat menunda ReCaptcha hingga interaksi pengguna untuk mengurangi waktu js exec, tetapi perlu pengujian, karena bot pintar dapat melewatinya

Minta pengembang untuk meningkatkan plugin

Jika Anda memerlukan plugin tetapi mengalami masalah javascript, minta pengembang untuk mengaktifkan penonaktifan fungsi yang tidak digunakan di frontend

Bukankah lebih bagus jika situs Anda dapat bekerja lebih baik, meskipun hanya sedikit lebih cepat?

Pada artikel ini, kami akan menjelaskan cara mengecilkan file CSS, HTML, dan JavaScript di WordPress untuk memastikan kinerja terbaik mutlak

Mengapa Penting untuk Meminimalkan File Anda

Jika Anda pernah melihat file HTML, CSS, atau JavaScript, kemungkinan besar Anda telah memperhatikan bahwa ada banyak jeda baris. Karakter ini membuat kode lebih mudah dibaca, tetapi file yang memuatnya akan lebih besar dan lebih lambat dimuat

Itu sebabnya minify WordPress sangat penting bagi pemilik situs. Proses ini menghilangkan spasi, karakter, dan baris yang tidak perlu dari kode dan menghasilkan data yang lebih ringkas

Meskipun banyak ahli berpendapat bahwa minifikasi membuat sedikit perbedaan, kami tetap sangat merekomendasikannya. Anda perlu memeras setiap pengoptimalan yang bisa Anda dapatkan untuk meningkatkan pengalaman pengguna dan kecepatan situs web. Bagaimanapun, bahkan sepersekian detik pun penting

Dua Cara Sederhana untuk Memperkecil File

Anda dapat memperkecil resource WordPress Anda secara manual atau menggunakan plugin WordPress minify. Baca terus untuk mengetahui mana yang paling cocok untuk Anda

Perkecil File Secara Manual

Ketika kami mengatakan "secara manual", itu tidak berarti Anda harus menghapus semua karakter yang tidak perlu sendirian. Ada banyak alat bermanfaat yang dapat mempercepat prosesnya. Namun, Anda perlu mengunggah file yang diperkecil ke situs Anda nanti, jadi berhati-hatilah saat mengikuti panduan ini

1. Temukan file yang ingin Anda perkecil dengan menggunakan GTMetrix. Masukkan URL situs web Anda, dan alat akan menampilkan file yang dapat Anda optimalkan. Jika Anda ingin mempelajari lebih lanjut, lihat artikel kami tentang kecepatan halaman GTMetrix
   
2. Klik Lihat Versi yang Dioptimalkan untuk mengunduh versi yang diperkecil
3. Gunakan klien FTP untuk menimpa file asli di direktori situs Anda dengan versi yang diperkecil. Atau, Anda dapat menggunakan pengelola file hPanel

Sebagai alternatif, Anda juga dapat menggunakan Minify Code — alat minify WordPress yang menawarkan minifier CSS, HTML, dan JavaScript terpisah

1. Unduh file yang ingin Anda perkecil dari situs web Anda. Simpan salinan sebagai cadangan
2. Salin konten file dan tempelkan ke alat minifier yang sesuai
   
3. Setelah selesai, rekatkan kode kembali ke file yang diunduh dan unggah ke direktori situs web Anda

Jika Anda ingin menghindari berurusan dengan kode, periksa metode kedua di bawah ini

Gunakan Plugin Minify WordPress

Menggunakan plugin minify WordPress jauh lebih mudah karena alat ini akan mengecilkan file Anda secara otomatis. Berikut adalah pilihan terbaik kami untuk melakukan pekerjaan itu, dipilih berdasarkan fitur dan kemudahan penggunaannya

• Fast Velocity Minify mengecilkan file JavaScript dan CSS Anda dengan menggunakan PHP Minify. Terlebih lagi, Anda bahkan dapat meminta pengembang untuk membuat opsi pengoptimalan khusus untuk plugin tersebut
  
• WordPress Minify yang lebih baik memastikan bahwa minifikasi tidak akan merusak tema Anda dan plugin lainnya. Selain itu, plugin ini juga menyediakan banyak fitur praktis seperti integrasi CDN dan kompatibilitas multisite
  
• WordPress Super Minify adalah plugin minify WordPress yang dapat memperkecil, menggabungkan, dan memanfaatkan cache browser dari file situs Anda. Selain itu, ini adalah salah satu alat paling mudah dan ringan yang tersedia untuk tujuan ini

Plugin mana pun yang Anda pilih, yang perlu Anda lakukan hanyalah memilih file yang ingin diperkecil dan alat tersebut akan bekerja di latar belakang

Namun, karena plugin minify WordPress tersebut menawarkan fitur lain yang berbeda, alangkah baiknya jika Anda mencoba semuanya untuk melihat mana yang memberi Anda nilai paling banyak.

Menguji Perubahan Setelah Minifikasi

Pastikan untuk memeriksa apakah Anda telah mengoptimalkan situs Anda sepenuhnya dengan menggunakan GTMetrix. Alat ini akan menilai ukuran file Anda dan menampilkan masalah yang belum terselesaikan

Misalnya, pengujian kami menunjukkan bahwa kami mendapat skor 99 untuk CSS, dengan dua file yang dapat ditingkatkan lebih lanjut

Setelah kami memperbaiki masalah tersebut, kami mendapat nilai sempurna 100

Pastikan situs web Anda dapat menangani semuanya – mulai dari lalu lintas tinggi hingga waktu pemuatan yang cepat, dan banyak lagi. Beli Hosting Web

Kesimpulan

WordPress minify adalah pengoptimalan praktis yang dapat meningkatkan kinerja situs web Anda. Dan yang terbaik adalah, siapa pun dapat melakukannya tanpa masalah

Mari kita lihat sekali lagi tentang cara memperkecil file WordPress

• Perkecil file secara manual — gunakan GTMetrix untuk mengunduh file yang dioptimalkan atau persingkat konten dengan menggunakan Minify Code. Kemudian, ganti file yang belum diedit di direktori situs web Anda dengan yang baru
• Gunakan plugin minify WordPress — instal salah satu plugin yang kami rekomendasikan dan sesuaikan konfigurasi berdasarkan preferensi Anda. Alat ini akan menangani sisanya

Setelah selesai, pastikan Anda mendapatkan skor sempurna di GTMetrix

Beri tahu kami di bagian komentar jika Anda mengalami masalah

Baca Lebih Lanjut Tentang Pengoptimalan Situs Web

Cara Mengaktifkan Kompresi GZIP
Apa itu Caching Situs Web dan Cara Menghapusnya
Apa itu SEO
Cara Mengaktifkan Keep-Alive

Penulis

Domantas G

Domantas memimpin tim konten dan SEO ke depan dengan ide-ide segar dan pendekatan out of the box. Berbekal pengetahuan SEO dan pemasaran yang luas, dia bertujuan untuk menyebarkan berita tentang Hostinger ke seluruh penjuru dunia. Selama waktu luangnya, Domantas suka mengasah keterampilan pengembangan web dan bepergian ke tempat-tempat eksotis

Bagaimana cara mengurangi file JavaScript di WordPress?

Bagaimana cara mengurangi file JavaScript?

Bagaimana cara mengoptimalkan file JS dan CSS di WordPress?

Bagaimana cara mengurangi JavaScript yang tidak terpakai di Elementor?