Velkommen til min tredje veiledning om optimalisering av Google Page Speed. For de som ikke vet, er Google PageSpeed et gratis verktøy som vurderer ytelsen og brukervennligheten til nettstedet ditt for mobile og stasjonære plattformer. Det er ekstra viktig fordi Google bruker det til å bestemme viktige elementer i SEO-rangeringen, dvs. hvor høyt vi ser i søkeresultatene.
Så webmastere vet at det er noe viktig å ha en god PageSpeed, selv om det er debatt over dette. For eksempel, The New York Times sidens hastighet er for tiden på 60 og 68 av 100.
I den første episoden gikk jeg deg gjennom å prøve å forbedre min PageSpeed med et tema laget av en nå avsluttet leverandør, Hands On Improving Google PageSpeed (Envato Tuts +). Til slutt gjorde jeg det til en PageSpeed for mobil på 70 og desktop 86.
I den andre episoden gjorde jeg bloggen min en fokusert utviklingsside og tilpasset min WordPress-kode på måter å nå PageSpeed 100 på både mobil og skrivebord. Se optimalisering av Google PageSpeed til 100 i WordPress (Envato Tuts +).
Og jeg var vellykket på dette for en tid:
I dag skal jeg fortelle deg mer om min erfaring med PageSpeed-optimalisering og et mindre kjent alternativ til å gjøre det selv, Googles egen PageSpeed-modul. Du kan installere den for Apache og nginx.
PageSpeed kan integrere med Apache eller Nginx webserver for å optimalisere nettstedet ditt automatisk. - Google
Før vi begynner, vær så snill og husk, jeg prøver å delta i diskusjonene nedenfor. Hvis du har et spørsmål eller et emneforslag, vennligst legg inn en kommentar nedenfor eller kontakt meg på Twitter @ reifman. Jeg er interessert i din erfaring med WordPress og PageSpeed.
Hvis bloggen min var heltidsperspektivet, ville det kanskje ikke vært for vanskelig å opprettholde den optimaliserte koden for PageSpeed som WordPress-plugin-oppdateringer, og temaoppdateringer kom med. Men det er det ikke. Og oppriktig, å opprettholde dette arbeidet viste seg altfor tidkrevende.
Jeg ønsket å gå tilbake til gamle dager med museklikk oppdateringer.
Jeg la også merke til at etter at jeg byttet til et nytt tema og optimalisert min PageSpeed til 100, gikk trafikken faktisk ned og holdt seg nede. Sikkert, den responsive temaoppsettet hadde noe å gjøre med det, men Google belønnet meg aldri for å nå 100 PageSpeed.
På samme måte, som jeg diskuterte i Installering av AMP i WordPress (Envato Tuts +), ble AMP opprettet for å fange medieutgiveres oppmerksomhet, men legger ikke mye til små utgivere. Google ga aldri mer trafikk til bloggen min etter at jeg hadde gitt AMP-støtte.
Så jeg bestemte meg for å legge ned fokuset mitt på PageSpeed og bytte til et nytt tema som vil hjelpe brukerne til å navigere på nettstedet mitt lettere. Jeg har også avinstallert AMP for tiden.
Det virket som den perfekte muligheten til å deaktivere alle mine tilpassede JavaScript- og CSS-bunter og eksperimentere med Googles PageSpeed-modul, som fungerer på servernivå for å gjøre dette for deg.
I utgangspunktet automatiserer Google PageSpeed-modulen mange ytelsesoptimaliseringer som PageSpeed-rangeringer ser etter. Og den er tilgjengelig på populære open source-servere Apache og nginx.
PageSpeed-modulen komprimerer og kombinerer inkluderte filer som JavaScript og CSS stilark, men erstatter også bilder med komprimerte, progressive filformater (.webp).
Etter å ha installert mitt nye tema tok jeg "før" øyeblikksbilder av min PageSpeed-poengsum. Jeg mottok en 83 på skrivebordet:
Og en lavere 64 for mobil:
For denne veiledningen vil jeg veilede deg gjennom installasjonen for Apache. Google tilbyr også nginx installasjonsinstruksjoner.
PageSpeed-modulen er ikke inkludert i Ubuntu pakke kataloger, så du må manuelt laste den ned via wget
:
$ wget https://dl-ssl.google.com/dl/linux/direct/mod-pagespeed-stable_current_amd64.deb --2016-10-02 15: 10: 54-- https://dl-ssl.google .com / dl / linux / direct / mod-sidespeed-stable_current_amd64.deb Løsning dl-ssl.google.com (dl-ssl.google.com) ... 74.125.22.136, 74.125.22.91, 74.125.22.190, ... Tilkobling til dl -ssl.google.com (dl-ssl.google.com) | 74.125.22.136 |: 443 ... koblet til. HTTP-forespørsel sendt, venter på svar ... 200 OK Lengde: 7009850 (6.7M) [application / x-debian-pakke] Lagre til: 'mod-pagespeed-stable_current_amd64.deb' 100% [========== ================================================== ===================================================================================================================================== [7009850/7009850]
Bruk deretter dpkg
for å installere modulen:
$ sudo dpkg -i mod-sidespeed - *. deb Velger tidligere ikke valgt pakke mod-sidespeed-stable. (Leser databasen ... 668500 filer og kataloger som for tiden er installert.) Forbereder å pakke ut mod-sidespeed-stable_current_amd64.deb ... Pakke mod-sidespeed-stable (1.11.33.2-r0) ... Konfigurere mod-sidespeed-stable (1.11.33.2-r0 ) ... Aktiverer modulen sidespeed. For å aktivere den nye konfigurasjonen må du kjøre: service apache2 på nytt
Og endelig, apt-get -f installasjon
å fikse eventuelle avhengigheter:
$ sudo apt-get -f installere [sudo] passord for ...: Lese pakke lister ... Ferdig Bygg avhengighet treet Lese state informasjon ... Ferdig Følgende pakker ble automatisk installert og er ikke lenger påkrevd: ca-sertifikater-java default-jre default- jr-headless skrifttyper-dejavu-ekstra gconf-service gconf-service-backend gconf2 gconf2-vanlig icedtea-6-jre-cacao icedtea-6-jre-jamvm icedtea-netx icedtea-netx-vanlig java-vanlig java-wrappers libasyncns0 libatk -wrapper-java libatk-wrapper-java-jni ... openjdk-7-jre openjdk-7-jre-headless lyd-tema-freedesktop ttf-dejavu-ekstra tzdata-java Bruk 'apt-get autoremove' for å fjerne dem. 0 oppgradert, 0 nylig installert, 0 for å fjerne og 0 ikke oppgradert.
Start deretter Apache-serveren på nytt:
$ sudo service apache2 restart * Omstart av webserver apache2
Tidligere skrev jeg et sponset innlegg Forbedre innholdsleveransen med KeyCDN og bruk den fortsatt. Hvis du bruker en CDN for nettstedet ditt, må du fortelle PageSpeed-modulen om det.
Slik viser og redigerer du modulens konfigurasjonsfil:
$ sudo nano /etc/apache2/mods-available/pagespeed.conf
Og her er den grunnleggende konfigurasjonen:
# Slå på mod_pagespeed. For å deaktivere mod_pagespeed helt, kan du # sette dette til "av". ModPagespeed på # Vi vil at VHosts skal arve global konfigurasjon. # Hvis dette ikke er inkludert, vil de være uavhengige (unntatt for iboende # globale alternativer), i hvert fall for bakoverkompatibilitet. ModPagespeedInheritVHostConfig på
Alle nettstedene dine vil fungere som standard. Men du må legge til CDN-underdomenene manuelt:
# ModPagespeedDomain # tillater omskrivning av JS, CSS og bildefiler som finnes i dette # domenet. Som standard er bare ressurser med samme opprinnelse som # HTML-filen omskrevet. For eksempel: # # ModPagespeedDomain cdn.myhost.com # # Dette vil tillate ressurser funnet på http://cdn.myhost.com å bli # omskrivet i tillegg til de i samme domene som HTML. # # Andre domenelaterte direktiver (som ModPagespeedMapRewriteDomain # og ModPagespeedMapOriginDomain) kan også autorisere domener. # # Wildcards (* og?) Er tillatt i domenespesifikasjonen. Vær # forsiktig når du bruker dem som om du skriver om domener som ikke sender deg trafikk, så vil nettstedet som mottar trafikken ikke # vite hvordan du skal tjene det omskrivne innholdet. ModPagespeedDomain c? .Jeffreifman.com
Mine CDN er på c1-, c2-, c3- og c4- .jeffreifman.com, så jeg brukte en ?
jokertegn for å referere til alle fire over.
Da må du selvfølgelig starte Apache igjen, som vi gjorde tidligere.
Du kan sjekke kildekoden på nettstedet ditt for å se om PageSpeed-modulen fungerer. Her er et eksempel fra toppen av siden på JeffReifman.com:
Legg merke til at URL-adressen er nå:
568f4.js.pagespeed.jm.7B4hJGmADB.js
Her er et større, manuelt plassert bilde (forresten et av mine husannonser) som PageSpeed konverterer til .webp:
Alt dette skjer automatisk.
Underwhelming Changes to PageSpeed
Samlet sett var resultatene fra bruk av PageSpeed-modulen undervældende alene. Jeg fikk 4 poeng på skrivebordet og (bedre) 8 poeng på mobilen.
Her er etterscore for skrivebordet:
Her er etterscore for mobil:
I Avslutning
Hvis du er system administrator, vil Google PageSpeed-modulen være svært nyttig. Den er fullt konfigurerbar, og du kan tilpasse den på flere måter for bedre innvirkning. Men for den gjennomsnittlige utvikleren, har jeg tvil om dens effekt:
Jeg er glad for at Google tilbyr modulen, og den er utviklet for å fungere innenfor komplekse systemer, men det er begrenset for hverdagen for DIY-systemadministratorer..
Hvis du har spørsmål, vennligst legg inn dem nedenfor. Eller du kan kontakte meg på Twitter @ reifman. Vennligst sjekk ut min Envato Tuts + instruktørside for å se andre opplæringsprogrammer jeg har skrevet, for eksempel Kloning WordPress i Linux (på 90 sekunder.) Og jeg oppfordrer deg til å sjekke ut mine to programmeringsserier her: Hvordan programmerer du med Yii2 og bygger din Oppstart med PHP.