Cara Membuat Permintaan HTTP Lebih Sedikit Di WordPress & GTmetrix YSlow

Perlu membuat permintaan HTTP lebih sedikit di laman WordPress anda?


Ini hanya bermaksud anda perlu mengurangkan berapa banyak elemen (permintaan) yang dimuat di laman web anda.

Buat Lebih sedikit Permintaan HTTP

Menggabungkan fail CSS dan JavaScript dapat membantu, tetapi ada pengoptimuman lain yang dapat mengurangi permintaan HTTP, seperti mematikan plugin secara selektif yang tidak perlu dimuat pada halaman tertentu, menonaktifkan skrip dan gaya WooCommerce pada halaman bukan e-commerce, atau menghindari CPU yang tinggi pemalam yang menghasilkan banyak permintaan dan memperlahankan laman web anda.

Membuat permintaan HTTP lebih sedikit adalah cadangan dalam GTmetrix, Pingdom, dan alat ujian kelajuan lain. Cadangan di bawah akan membantu mengurangkan permintaan dan menjadikan laman web anda lebih cepat.

1. Gabungkan Lembaran Gaya CSS + JavaScript

Menggabungkan Lembaran Gaya CSS + JavaScript bermaksud anda perlu menyalin / menampal semua fail CSS anda ke dalam 1 fail tunggal. Ini membolehkan penyemak imbas membuat 1 permintaan tunggal untuk fail CSS dan bukannya berbilang permintaan. Sebilangan besar pemalam cache mempunyai pilihan untuk menggabungkan fail CSS + JavaScript anda.

Langkah 1: Dalam tetapan pemalam cache anda, cari pilihan untuk menggabungkan dan meminimumkan CSS + JavaScript.

Langkah 2: Aktifkan setiap tetapan satu demi satu dan hasil ujian dalam GTmetrix.

Minimumkan Gabungkan Fail CSS

Minimumkan Gabungkan Fail JavaScript

Langkah 3: Periksa kesilapan yang dapat dilihat di laman web anda. Sekiranya anda melihat kesilapan, lihat kod sumber, cari fail yang bermasalah, dan kecualikannya dari tetapan pengurangan CSS atau JavaScript anda. Sebagai contoh, jika slaid anda hilang ketika mengaktifkan tetapan tertentu, periksa fail slaid anda dalam kod sumber dan kecualikan fail yang bermasalah. Sekiranya anda tidak melihat kesilapan, tidak ada keperluan untuk ini.

Sebagai alternatif, anda boleh menggabungkan fail CSS anda secara manual di WordPress di bawah Appearance > Penyunting Tema. Anda hanya akan menyalin dan menampal kandungan dalam semua fail ke dalam 1 fail CSS.

Fail CSS WordPress

2. Lumpuhkan Pemalam Secara Selektif

Banyak pemalam berjalan di seluruh laman web anda, walaupun di halaman yang tidak diperlukan.

Bentuk hubungan, perkongsian sosial, coretan kaya, slaid, dan beberapa pemalam lain hanya perlu dimuat pada jenis kandungan tertentu. Anda boleh melumpuhkannya di tempat lain dengan menggunakan Pembersihan Aset.

Dengan mematikan pemalam pada halaman yang tidak perlu dimuat, ini mengakibatkan permintaan HTTP lebih sedikit. Ini tidak terhad kepada pemalam; skrip dan gaya juga dapat dinonaktifkan pada halaman tertentu (mis. skrip, gaya, fragmen keranjang WooCommerce dapat dinonaktifkan pada halaman bukan eCommerce).

Langkah 1: Pasang Asset CleanUp atau Perfmater (kedua-duanya membolehkan anda mematikan pemalam secara selektif).

Langkah 2: Edit halaman atau pos, tatal ke bawah ke bahagian Asset CleanUp, dan tinjau fail CSS + JavaScript mana yang dimuat di halaman. Ini boleh dari plugin, tema, atau skrip luaran.

Lumpuhkan Skrip Luaran WordPress

Langkah 3: Lumpuhkan semua pemalam dan permintaan yang tidak anda perlukan di halaman tersebut. Anda boleh melumpuhkannya pada 1 halaman tunggal, di seluruh laman web anda, mengikut jenis pos, atau menggunakan RegEx (ungkapan biasa) untuk menonaktifkannya pada corak URL tertentu. RegEx hanya disertakan dengan Perfmatters atau Asset CleanUp Pro.

3. Lumpuhkan Skrip, Gaya, Fragmen Keranjang WooCommerce

Laman web WooCommerce secara semula jadi menghasilkan lebih banyak permintaan HTTP.

Mereka bukan sahaja memerlukan lebih banyak plugin, tetapi mereka juga memuat skrip WooCommerce tambahan, gaya, dan serpihan troli. Sama seperti anda boleh mematikan pemalam secara selektif pada langkah sebelumnya, anda juga boleh melumpuhkan permintaan WooCommerce secara selektif yang memuat di seluruh laman web anda.

Dengan menggunakan Asset CleanUp atau Perfmatters, nonaktifkan ini di halaman yang tidak perlu dimuat:

Asset CleanUp WooCommerce

Sebagai alternatif, Perfmatters membolehkan anda melumpuhkannya dengan 1 klik:

pengoptimuman woocommerce perfmatters

4. Elakkan Plugin CPU Tinggi

Plugin CPU yang tinggi dapat menghasilkan banyak permintaan HTTP.

Ini biasanya perkongsian sosial, statistik (analitik), slaid, portfolio, pembina halaman, kalendar, sembang, dan pemalam borang hubungan. Pada dasarnya, elakkan sebarang pemalam yang menarik permintaan luaran dari laman web luar, menjalankan proses yang sedang berjalan, atau hanya memerlukan masa yang lama untuk dimuat.

Langkah 1: Periksa plugin lambat di Air Terjun GTmetrix atau Monitor Pertanyaan.

Plugin lambat-WordPress

Langkah 2: Elakkan pemalam CPU tinggi yang diketahui.

  1. Tambah ini
  2. Pemantauan Penipuan Klik AdSense
  3. Kalendar Acara Semua Dalam Satu
  4. Rakan Sandaran
  5. Pembina Beaver
  6. Peta Laman Google XML WordPress yang lebih baik
  7. Pemeriksa Pecah Pautan (gunakan Dr. Link Check)
  8. Hubungan Tetap untuk WordPress
  9. Borang Hubungan 7
  10. Lihat Semua 65 Pemalam Lambat

Langkah 3: Gantikan pemalam lambat dengan pemalam yang lebih cepat dan ringan. Penyelidikan dan ujian diperlukan.

5. Gantikan Pemalam Dengan Kod

Anda boleh mengelakkan banyak pemalam dengan menggantinya dengan kod.

Contoh:

  • Fon Google: hos fon anda secara tempatan
  • Kod penjejakan Analitis Google: masukkan secara manual
  • Jadual kandungan: reka secara manual dalam HTML + CSS
  • Tweet Tertanam atau Peta Google: ambil tangkapan skrin sebagai gantinya
  • Widget Facebook terbenam: ganti dengan widget Facebook sebenar

Menggabungkan pemalam juga menolong. Salah satu contoh klasik adalah menggunakan WP Rocket yang dilengkapi dengan hosting fon, analitik, dan Facebook Pixel secara tempatan, pemuatan gambar + video yang malas, pembersihan pangkalan data, pramuat, kawalan degupan jantung, dan penyatuan kedua Cloudflare dan beberapa CDN. Dengan plugin cache yang lain (kerana kebanyakan mereka tidak mempunyai ciri-ciri ini), anda perlu memasang 6-7 plugin tambahan untuk mendapatkan pengoptimuman kelajuan tersebut, ketika mereka terpasang di WP Rocket.

6. Hapuskan Skrip Luar

Skrip luaran adalah apa sahaja yang menarik permintaan dari laman web luar.

Fon Google boleh digabungkan menjadi 1 fail. Video boleh dimuat dengan malas dan iframe diganti dengan gambar pratonton. Banyak skrip dapat dioptimumkan, yang lain tidak dapat. Berikut adalah beberapa contoh.

  • Fon Google: gabungkan fon dan hos mereka secara tempatan menggunakan pemalam seperti WP Rocket, Autoptimize, OMGF, Self-Hosted Font Google, dan Asset CleanUp.
  • Analitis Google: kod penjejakan host di WP Rocket / CAOS Analytics.
  • Google AdSense: muat secara tidak segerak dan cuba Cloudflare Rocket Loader.
  • Peta Google: ambil gambar Google Map dan sertakan pautan ke arah pemanduan ketika orang mengklik gambar (ini kelihatan sama baiknya dengan Peta)!
  • Pengurus Teg Google: biasanya melakukan lebih banyak keburukan daripada kebaikan ketika cuba menggabungkan pelbagai skrip. Hanya boleh digunakan untuk laman web yang besar dan tidak dioptimumkan.
  • Video Terbenam: gunakan WP Rocket atau WP YouTube Lyte untuk memuatkan video dengan malas dan ganti iframe dengan gambar pratonton (video adalah elemen yang sangat berat).
  • Widget Terbenam + Catatan: ambil tangkapan skrin dan bukannya menyematkannya.
  • Pixel Facebook: WP Rocket dapat menambahkan cache penyemak imbas ke Facebook Pixel.
  • Gravatars: tidak ada yang berfungsi untuk saya selain melumpuhkan Gravatars (WP Rocket juga tidak menggunakannya di blog mereka). Tetapi, anda boleh mencuba Harrys, FV, atau Cache Gravatar Optimum, atau mencuba memecahkan atau menyembunyikan komen yang boleh dikembangkan.
  • Plugin Perkongsian Sosial: menjana permintaan dari Facebook, Twitter, dan rangkaian sosial untuk menyegarkan seperti jumlah yang tidak diketahui. Cuba pemalam yang lebih pantas seperti Pug Sosial, Mashsharer, Snap SosialTambahToAny, Perkongsian Sosial WP, atau Perkongsian Sosial yang Mudah

7. Gabungkan Fon Google

Font Google boleh digabungkan untuk menghasilkan 1 permintaan dan bukannya beberapa permintaan.

Google-Font-GTmetrix

Plugin berikut mempunyai pilihan untuk mengoptimumkan Font Google:

  • Roket WP
  • Pembersihan Aset
  • Optimumkan secara automatik
  • OMGF

Walau bagaimanapun, kaedah terbaik adalah dengan mengadakan Google Font secara tempatan. Ini melibatkan memuat turun fon anda secara langsung dari laman web Google Font sambil minimum dengan jumlah fon dan bobot fon. Seterusnya, gunakan alat seperti Transfonter atau menukar fon ke fail fon web. Anda kemudian akan memuat naik fail fon web baru ke folder wp-content / muat naik anda, menambahkan fon khusus ke CSS, dan menguji font untuk memastikannya berfungsi. Sekali lagi, lihat pautan itu untuk tutorial lengkap.

Transfonter-Google-Font-Penukaran

7. Minimumkan HTML, CSS, JavaScript

Mengurangkan fail biasanya dilakukan oleh pemalam cache anda (lihat langkah 1).

Tetapi kadang-kadang, ini boleh merosakkan laman web anda. Dalam kes ini, anda harus menguji setiap tetapan satu demi satu, memeriksa fail yang bermasalah dalam kod sumber, kemudian mengecualikan fail tersebut dari pengurangan menggunakan plugin cache anda. Sekiranya anda tidak melihat ralat yang kelihatan, anda tidak perlu melakukan ini.

8. Mengoptimumkan Penyampaian CSS

Ini harus memperbaiki sumber penyekat-render item dalam Wawasan PageSpeed.

WP Rocket, Autoptimize, dan plugin serupa lainnya harus mempunyai pilihan untuk mengoptimumkan penghantaran CSS. Cukup masuk ke tetapan anda dan pastikan anda mengaktifkannya, dan mesti memperbaikinya.

Optimumkan Penghantaran CSS

9. Tangguhkan / Muatkan Fail JavaScript Gabungan Secara Asinkron

JavaScript tak segerak bermaksud fail dimuat selepas halaman selesai dimuat turun.

Ini boleh dilakukan dengan menggunakan WP Rocket atau Async JavaScript dan harus memperbaiki keluarkan item Javascript yang menyekat render. Async JavaScript memberi anda kawalan penuh terhadap skrip mana yang akan ditambahkan atribut ‘async’ atau ‘defer’, sementara WP Rocket menangkis JavaScript secara automatik dengan 1 klik.

Fail JavaScript

10. Video Lazy Load

Video terbenam adalah sumber luaran yang menghasilkan permintaan HTTP.

Masa boleh dimuat 2+ saat! Walaupun anda tidak dapat menghapuskannya sepenuhnya, anda boleh melambatkan pemuatan video sehingga pengguna menatal ke bawah (pemalas malas) dan klik butang main (embed ringan).

Anda mempunyai beberapa pilihan di sini: anda boleh menggunakan WP Rocket untuk membolehkan pemuatan yang malas dan mengganti iframe YouTube dengan gambar pratonton. Tetapi jika anda tidak mempunyai WP Rocket, anda boleh mencuba Pemalam WP YouTube Lyte atau ikuti ini tutorial mengenai penyebaran YouTube ringan. Kedua-duanya berfungsi dengan baik.

Berikut adalah contoh (dan video hebat di WordPress Speed):

11. Tambah CDN

CDN dapat membantu membuat permintaan HTTP lebih sedikit.

Daripada membuat pelayan asal anda menjawab permintaan, pusat data CDN akan menurunkan lebar jalur sambil meringankan beban pada pelayan asal. Cloudflare adalah percuma, jadi ini tidak perlu dipertimbangkan.

Pelbagai CDN = lebih banyak pusat data = penghantaran kandungan yang lebih pantas dan lebih banyak memuatkan sumber. Banyak orang memulakan dengan Cloudflare dan akhirnya melihat StackPath ketika menggunakan banyak CDN (saya menggunakan kedua-duanya). KeyCDN juga bagus. Ini disebut “rantai” CDN.

Menyiapkan Banyak CDN
Dengan Cloudflare, mereka memberikan anda 2 nama yang anda ubah dalam daftar domain anda. Dengan CDN lain seperti StackPath dan KeyCDN, mereka memberikan anda URL CDN yang akan anda tempelkan ke medan URL CDN di plugin cache anda (kebanyakan dari mereka memilikinya) atau menggunakan CDN Enabler.

Pelbagai CDN

12. Minimumkan Pengalihan

Pengalihan yang tidak diperlukan boleh menyebabkan permintaan HTTP tambahan.

Anda perlu melihat laporan GTmetrix untuk mengetahui apa yang menyebabkan ralat ini. Adakah ia dihasilkan oleh skrip luaran atau pemalam di laman web anda? Sudahkah anda mencuba mengoptimumkan skrip itu atau mencari pemalam yang lebih ringan? Adakah kerana anda menukar versi domain anda menjadi bukan WWW atau HTTPS tetapi belum mengemas kini semua pautan / gambar di laman web anda untuk menggambarkan versi baru?

Minimumkan Kesalahan Pengalihan

Punca Biasa

  • Pemalam tidak betul
  • Skrip luaran
  • Diubah menjadi WWW vs Bukan WWW tetapi belum mengemas kini pautan
  • Diubah menjadi HTTPS vs bukan HTTPS tetapi belum mengemas kini pautan

13. Mengoptimumkan Imej

Untuk mengurangkan permintaan HTTP yang disebabkan oleh gambar, terdapat 3 cara utama untuk mengoptimumkan gambar:

Layan Imej Skala: ubah saiz gambar besar menjadi lebih kecil. GTmetrix memberitahu anda gambar mana yang terlalu besar dan dimensi yang betul yang harus dipangkas / diubah ukurannya. Cuba buat cheat dimensi gambar dengan mengukur dimensi slider anda, gambar blog lebar penuh, widget, dan kawasan lain di laman web anda. Kemudian pastikan untuk mengubah ukuran gambar ke dimensi yang betul sebelum memuat naik. Sekiranya anda melakukan ini, anda seharusnya tidak pernah melakukan kesalahan gambar skala.

Optimumkan Imej (Pemampatan Tanpa Kerugian): gunakan pemalam seperti ShortPixel (disyorkan), Smush, atau Imagify untuk memampatkan gambar. Walaupun plugin ini mengatakan tidak ada kerugian, anda kadang-kadang dapat melihat sedikit kehilangan kualiti. Itulah sebabnya yang terbaik adalah membuat sandaran gambar anda dan menguji beberapa gambar sebelum mengoptimumkan secara pukal semua gambar di laman web anda, untuk memastikan anda berpuas hati dengan kualiti.

Nyatakan Dimensi Gambar: tambahkan lebar + tinggi pada HTML atau CSS gambar. Ini dilakukan secara automatik dalam Visual Editor, tetapi bukan HTML khusus, beberapa pembangun halaman, dan mungkin kawasan lain di laman WordPress anda. GTmetrix akan menunjukkan kepada anda gambar mana yang mempunyai kesalahan ini dan memberi anda dimensi yang betul. Untuk memperbaiki ralat, anda perlu mencari gambar di papan pemuka WordPress anda, mengedit HTML atau CSS, kemudian menambahkan lebar + tinggi.

Masih Perlu Membuat Permintaan HTTP Lebih Sedikit?

Sekiranya anda masih memerlukan pertolongan, tinggalkan komen kepada saya. The Kumpulan Facebook Mempercepat WordPress juga berguna, atau anda boleh menyewa kami untuk perkhidmatan kelajuan WordPress dengan sebelum + selepas GTmetrix melaporkan.

Kumpulan Facebook Mempercepat WordPress

Soalan Lazim

&# x1f680; Apa yang menyebabkan permintaan HTTP?

Permintaan HTTP adalah apa sahaja yang membuat permintaan ke pelayan (sebagai contoh, satu gambar membuat 1 permintaan). Tab Air Terjun GTmetrix memberitahu anda semua permintaan yang dimuat di halaman.

&# x1f680; Apakah 5 perkara yang anda dapat untuk mengurangkan permintaan HTTP?

5 perkara mudah yang boleh anda lakukan ialah menggabungkan fail CSS + JavaScript, memuatkan gambar dan video dengan malas, mengelakkan senarai pemalam CPU tinggi kami, melumpuhkan pemalam secara terpilih dari halaman / catatan tertentu dengan Perfmatters atau Asset CleanUp, dan mengoptimumkan fon anda.

&# x1f680; Adakah pemalam cache akan membantu mengurangkan permintaan HTTP?

Ya, plugin cache yang baik akan membantu mengurangkan dan menggabungkan fail, serta mengurangkan permintaan HTTP ketika dikonfigurasi dengan betul. Saya mempunyai tutorial untuk hampir setiap plugin cache.

&# x1f680; Akan memperbaiki item GTmetrix yang lain mengurangkan permintaan HTTP?

Ya, dalam banyak keadaan, ini terutama akan meminimumkan dan menggabungkan fail, menghilangkan kesalahan pengalihan, dan menggunakan CDN juga dapat membantu.

&# x1f680; Plugin cache mana yang paling banyak permintaan HTTP, dan bagaimana mengkonfigurasinya?

Saya mengesyorkan WP Rocket yang diberi peringkat # 1 dalam kebanyakan tinjauan Facebook dan mempunyai lebih banyak ciri pengoptimuman kelajuan daripada kebanyakan pemalam cache, sebab itulah biasanya menghasilkan skor dan masa muat yang lebih baik di GTmetrix. Lihat tutorial saya untuk mengkonfigurasi tetapan WP Rocket.

Terima kasih untuk membaca :)

Sorakan,
Tom

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map