Fix Google PageSpeed Novērst renderēšanas bloķēšanu JavaScript un CSS, izmantojot augstākā līmeņa saturu
- Atrisiniet renderēšanas bloķēšanu Javascript un CSS
- Novērst renderēšanu bloķējošos JavaScript un CSS satura augšdaļā: parādiet, kā to salabot
- Javascript failu ielāde tiek atlikta
- Pēc HTML ielādēšanas ielādējiet CSS
- Iziet Google vietnes ātruma testu!
- Kā novērst resursu bloķēšanas resursus programmā WordPress
- Vai jums ir ārēja sistēma, kas jūsu vietni optimizē
- Bieži Uzdotie Jautājumi
- Perfect Chrome Lighthouse Score: Kas notiek? - video
- Komentāri (8)
Atrisiniet renderēšanas bloķēšanu Javascript un CSS
Google PageSpeed [1] tests Izvairieties no renderēšanas bloķēšanas JavaScript un CSS augšējā kārtā saturošā satura piedāvā, lai jūsu vietnes JS un CSS faili tiktu rādīti pēc tam, kad HTML ir pilnībā ielādēts, un tādēļ neuztrauciet HTML ielādi lai tos lejupielādētu.
[1] - PageSpeed Insights - developers.google.comRenderēšanas bloķējošo skriptu definīcija: skripti, kas tiek ielādēti pirms pilna HTML DOM parsēšanas. Piemēram, skripti, kas iekļauti galvenē vai saturā, bez īpašas instrukcijas pārlūkprogrammām atlikt skriptu ielādi līdz HTML krāsošanai.
Novērst renderēšanu bloķējošos JavaScript un CSS satura augšdaļā: parādiet, kā to salabot
- Ļaujiet ārējai sistēmai optimizēt savu vietni jūsu vietā
- Izmantojiet CDN, kas jūsu vārdā veiks visas iespējamās optimizācijas, tostarp trīs tālāk norādītās optimizācijas, kas nepieciešamas renderēšanas bloķējošu resursu novēršanai:
- Atlikt Javascript failu ielādi
- Pēc HTML ielādes ielādējiet CSS
- Izmantojiet WordPress spraudni
Lai novērstu renderēšanu bloķējošos resursus, ir nepieciešamas daudzas optimizācijas, un tas var būt garlaicīgs, lai pats tos ieviestu - turklāt jums būs nepārtraukti jāmeklē jaunie testi, kas iekļauti Chrome LightHouse un Google PageSpeed, kā arī citi lapu ātruma testi.
Nav nekāda risinājuma, lai htaccess kodā novērstu renderēšanu bloķējošus resursus, jo problēma ir saistīta ar DOM, kas nozīmē vietnes saturu un secību, kādā tiek ielādēti iekļauti resursi, piemēram, Javascript un CSS, bet ne tikai. Tos nevar aktivizēt vietnē Htaccess, bet tikai HTML DOM saturā.
Ja jūs atrisināsiet šīs problēmas darbvirsmā, jūs vienlaikus novērsīsit renderēšanu bloķējošos resursus mobilajām ierīcēm, jo abi ir pilnīgi vienādi!
Did you know that you can even have all these steps executed automatically for you by using an external Vietnes ātruma paātrinātājs technology, which through artificial intelligence will preload your site, optimize it, and deliver it to your visitors? It is possible with tools such as Ezoic platform offering, with a free trial and no credit card required. Otherwise, implement below optimizations in your website!
Javascript failu ielāde tiek atlikta
Lai atliktu jūsu JS failu slodzi [2], jūs varat pievienot async vai atlikt norādījumus saviem skriptu saitēm. Async negarantēs, ka tie tiek ielādēti vienā secībā, tādēļ, ja jums ir vairāki skripti, kuriem vajadzētu palaist vienu pēc otra, vēlams atlikt, lai nodrošinātu secību:
[2] - Noņemt renderēšanu bloķējošo JavaScript | PageSpeed Insights | Labi izstrādātāji - developers.google.comPēc HTML ielādēšanas ielādējiet CSS
Lai CSS, kas tiek ielādēts pēc pilna HTML pārraides, Google piedāvā [3] šo koda daļu, kas jāpievieno HTML beigās, piemēram, pēc kājenes aizvēršanas taga un pirms ķermeņa aizvēršanas taga:
[3] - optimizēt CSS piegādi PageSpeed Insights | Labi izstrādātāji - developers.google.comLai optimizētu jūsu vietni, tā ir arī laba ideja, lai noņemtu neizmantoto CSS kodu, darbību, kas var būt garlaicīgs, ja jums nav zināšanu web dizains. Ja neesat izveidojis savu tīmekļa vietnes tēmu, tas varētu būt gudrāks, lai izmantotu ārējo sistēmu, lai noņemtu neizmantoto CSS kodu jūsu vārdā, piemēram, Ezoic Leap, piemēram, jaunā (un pilnīgi brīva) versija viņu apbrīnojamo vietni Ātruma paātrinātājs.
Iziet Google vietnes ātruma testu!
Tas ļāva mani izsniegt Google PageSpeed [1] testu. Noņemiet renderēšanas bloķēšanu JavaScript un CSS augšējā saraksta saturā (kopā ar sviras pārlūka kešatmiņu [4]) vietnē, pieaugot no 51 vietnes mobilajās ierīcēs ( Attēls 1) līdz 72 (attēls 2) un uz augšu no 59 (3.att.) Līdz 79 uz galda (4.attēls).
[4] - Labojiet Google PageSpeed, izmantojot pārlūka kešatmiņu, izmantojot htaccess - Yoann Bierling, Starptautiskais SAP / tīmekļa konsultants - www.ybierling.comKā novērst resursu bloķēšanas resursus programmā WordPress
Lai novērstu WordPress resursus, kas padara bloķēšanu, ir nepieciešams instalēt spraudni, piemēram, JetPack.
Pēc tam dodieties uz opcijām, kurām jābūt administratoram, un dodieties uz JetPack opcijām> Rakstīšana> Veiktspēja un ātrums> Pārbaudiet Iespējot vietnes paātrinātāju, paātriniet attēlu ielādes laiku, paātriniet statisko failu ielādes laiku un iespējojiet slinku ielādi attēlus.
Uzziniet SEO pamatus: reģistrējieties jau šodien!
Palieliniet savas vietnes redzamību un trafiku, apgūstot SEO pamatus ar mūsu viegli izpildāmajiem pamatiem.
Sāciet mācīties SEOTas novērsīs resursus, kas bloķē WordPress resursus un ielādē lapas ātrāk, ļaujot JetPack optimizēt attēlus un apkalpot savus attēlus un statiskos failus (piemēram, CSS un JavaScript) no globālā servera tīkla.
Kā likvidēt JavaScript un CSS bloķēšanu programmā WordPressNeaizmirstiet atlikt attēlus no ekrāna, izmantojot slinks slodzes funkciju. Lai gan tas bija grūti un nepieciešams, lai ārējo bibliotēku atlikt ielādējot attēlus ārpus ekrāna, tagad ir iespējams dabiski HTML5!
Lai ieviestu slinks ielādes attēlus jūsu mājas lapas, vienkārši pievienot vērtības slinks uz atribūtiem jūsu mājas lapā attēlus, un jaunākās pārlūkprogrammas sapratīs, ka šie attēli būtu jāpieprasa un jāielādē tikai tad, ja tie tiek parādīti, kas nozīmē, ka, ja lietotājs ritina uz leju Attēla vietnieki.
<img src=”SRC” alt=”ALT” loading=”lazy”></img>
Lazy Loading - Web Performance - Mozilla izstrādātāja tīklsPapildus tam, slinks ielāde darbojas arī ar iFrames, un tā ir svarīga īstenošana, lai novērstu render-bloķējošus resursus no jūsu tīmekļa lapām.
Kad renderēšanas bloķējošie resursi būs instrukcijas pēc galvenā satura, kas nozīmē HTML DOM, jūs jau nopelnīsiet daudz punktus Google Lighthouse testā, lapas ātruma ieskatu tests vai Google Core Web Vitals.
Vai jums ir ārēja sistēma, kas jūsu vietni optimizē
Vai jūs zināt, ka faktiski visas Google PageSpeed problēmas jūs varētu atrisināt jūsu vārdā bez lielas pūles no savas vietnes - izņemot reģistrēšanos bezmaksas izmēģinājumam un DNS maiņu?
Izmantojot Ezoic platformas vietnes ātruma paātrinātāja tehnoloģiju, visas parastās Google PageSpeed problēmas atrisinās viņu sistēma, kas būs starpnieks starp jūsu vietni un apmeklētājiem. Viņi optimizēs tīmekļa lapu, lai jūs to parādītu jūsu apmeklētājam.
Kļūstiet zaļš, vienkārši reģistrējoties bezmaksas izmēģinājumam vietnē Ezoic un izmēģiniet to pats - dažu dienu laikā jūsu vietne sasniegs visaugstākos lapas ātruma optimizācijas standartus: padarīs nākamās paaudzes tīmekļa attēlus, optimizēs CSS un JavaScript, noņemot neizmantoto CSS. un JS, slinki ielādējiet attēlus, mainiet attēlu izmērus, saglabājiet vietnes lapu kešatmiņā, optimizējiet fontus, iepriekš izveidojiet savienojumu ar visām jūsu iekļautajām vietnēm un vēl daudz vairāk.
Kredītkarte nav nepieciešama - viss, kas jums jādara, ir reģistrēties bez maksas un izmēģināt. Turklāt, ja jūsu vietne nopelna naudu no attēla reklāmām, papildus tam, ka vietne tiek padarīta daudz ātrāka, tās var arī dot jums iespēju nopelnīt vairākas reizes vairāk naudas nekā jūs nodarbojaties ar Google AdSense, optimizējot savas reklāmas ar mašīnmācīšanos un modernu mākslīgo intelektu.
Bieži Uzdotie Jautājumi
- Kā novērst renderēšanas bloķēšanu JavaScript un CSS virsotnē?
- Lai novērstu renderēšanas bloķēšanu JavaScript un CSS iepriekšējam saturam, jums jāpārliecinās, ka jūsu vietnes JS un CSS faili tiek ielādēti pēc HTML pilnībā ielādēšanas. Tas nozīmē, ka šo failu lejupielādēšanai nav apturēta HTML ielādes procesa apturēšana. Javascript failus var atlikt ar Async vai atlikt atribūtu, un CSS varat izmantot īpašu kodu, lai to ielādētu pēc HTML. To automātiski var apstrādāt arī ārēja optimizācijas sistēma, piemēram, Ezoic.
- Kā tīmekļa izstrādātāji var uzrunāt Google PageSpeed ieteikumu novērst Render bloķējošus JavaScript un CSS?
- Tīmekļa izstrādātāji var optimizēt savu vietni, minificējot JavaScript un CSS failus, izmantojot asinhronu JavaScript ielādi, iekļaujot kritisko CSS tieši HTML un atliekot nekritisku CSS un JavaScript failu ielādi. Šo stratēģiju ieviešana var ievērojami uzlabot iekraušanas laiku un lapu rādītājus.
Perfect Chrome Lighthouse Score: Kas notiek?
Yoann Bierling ir tīmekļa izdošanas un digitālo konsultāciju profesionālis, kas globāli ietekmē zināšanas un inovācijas tehnoloģijās. Kaislīgi dodot iespēju indivīdiem un organizācijām attīstīties digitālajā laikmetā, viņš tiek virzīts, lai sniegtu izcilus rezultātus un izaugtu, izmantojot izglītības satura izveidi.
Uzziniet SEO pamatus: reģistrējieties jau šodien!
Palieliniet savas vietnes redzamību un trafiku, apgūstot SEO pamatus ar mūsu viegli izpildāmajiem pamatiem.
Sāciet mācīties SEO