Trim blodet Lean It Out

I de to foregående innleggene i denne serien har vi diskutert hvordan vi har gått fra små nettsteder til de enorme appene og nettstedene vi har i dag. Vi har diskutert noen av de valgene vi kan gjøre som det gjelder å lene ut vår WordPress-nettside, hva skal du passe på, og hvorfor hver ting viktig. 

I dette innlegget skal jeg gi noen konkrete eksempler på hva jeg snakker om. Det vil ikke være en rett opp guide som passer perfekt til alle bruksområder, men hensikten er å gi noen eksempler for å hjelpe deg med å komme i gang med rengjøring og trimning av de fremmede biter på bloggen din som du ikke gjør trenge.

Lene ut malfiler

Nedenfor har jeg tatt et stykke HTML fra et nylig prosjekt. Det opprinnelige nettstedet inneholdt mange ting det egentlig ikke trengte. Over tid hadde selskapet akkumulert plugins og tillegg til deres tema og opplevde nå absurde sakte lastetider. 

I dette tilfellet ville den mest enkle løsningen være å slå et caching-lag foran det og bli gjort. Men det løser egentlig ikke problemet. En av de tingene jeg endte med, var å fjerne omtrent 50% av HTML-en i temaet, omskrive den der det var nødvendig, og justere CSS tilsvarende for å holde designet det samme.

Her er en del av HTML som var i det opprinnelige temaet. Jeg reparerte formateringen litt.

 
 
 
 
 
 
  
Posttittel går her 
  
 
 
 
 
kategori navn
 
 
 
 
 postet på 28 feb 2014 - 2:40 pm av Bob The Admin 
 
 
 
 
  Kommentar  
 
 
 
 
 
 
    
 
 
 
post innhold her
 
 
 
 
 
 
 
 
 
 
 
 
 

Det er ikke den verste HTML jeg noensinne har sett, og absolutt ikke en av delene som virkelig gjorde nettstedet mye langsommere, men det er perfekt for det jeg prøver å vise her: Det er mye rengjøring som kan gjøres. Det er en overdreven mengde wrappers og clearing div elementer. 

Etter litt rengjøring endte jeg med:

 
 
  
Posttittel går her 
  
 
 
 
 
kategori navn
 
 
 
 postet på 28 feb 2014 - 2:40 pm av Bob The Admin 
 
 
 
 Kommentar 
 
 
 
 
 
 
    
 
 
post innhold her
 
 
 
 

Dette stykke kode har mesteparten av pakkene strippet. Hvis du ikke trenger dem, legg dem ikke til. Riktig bruk av CSS vil tillate deg å unngå å bruke de fleste, om ikke alle, pakkerne i det originale stykke kode. 

Dette eksemplet kan virke ubetydelig, og i seg selv er det. Men gjør dette overalt for hver mal i temaet ditt, og du vil ende opp med en betydelig mindre utgang. 

Når du gjør nettstedet ditt, vil nettlesere bli lykkeligere for det. Mobil besøkende overalt vil sette pris på at nettstedet ditt åpnes raskere på sine telefoner fordi mindre data betyr raskere lastetider, og du vil bli lykkeligere når du må justere noe i koden.

Det er mye mer å diskutere her, men denne serien er ikke ment som den endelige veiledningen for å skrive ren HTML. I stedet er det meningen å gjøre deg oppmerksom på de potensielle forbedringene du kan søke på nettstedet ditt. 

Rachel McCollin har skrevet en svært forseggjort og omfattende guide til å bygge et tema for WordPress. Hennes serie detaljer i eksepsjonell detalj hvordan man bygger et tema og hennes eksempler er helt tom for noen oppblåsthet, jeg kan anbefale noen som ser etter noen poeng på hvordan de skal få deres HTML sortert for å se på serien hennes.

Trimming Våre Plugins

Nå som vi har tatt titt på temaene, la oss snakke plugins.

Mange av de samme reglene gjelder her. Rengjør plugin er skrevet, jo lettere vil det justere det når du trenger det. Husk at du vil miste kompatibiliteten hvis du justerer et plugin direkte, så det er generelt best å prøve å unngå det.

Plugins kommer i alle størrelser. Det er si at noen gjør det de trenger å gjøre og ingenting mer, andre gjør det de må gjøre, så vel som mange andre ting. Feature bloat er ikke uvanlig, og noe du virkelig vil holde øye med når du velger pluginene du vil bruke. I noen (men ikke alle) tilfeller, jo flere plugins du har, vil tregere ting ende opp med å bli. 

Selvfølgelig er dette i stor grad avhengig av kodenes kvalitet på plugin. Derfor er det viktig å sørge for at du utfører din due diligence når du undersøker pluginene du skal installere. 

Individuelt ser det ut til at hver plugin ikke virker mye, men hvis du legger sammen et stort antall dårlig kodet plugin, ser du en betydelig nedgang i ytelsen.

Da jeg først skrev denne artikkelen, skulle jeg ta på meg mange ting for å holde øye med når du valgte pluginene dine; Barış Ünver har imidlertid skrevet en utmerket guide til hva du skal se etter når du velger et plugin, og jeg trenger ikke å gjenta ordene her. 

I stedet, les opp på sin guide hvis du leter etter tips om hvilket plugin du skal bruke.

Hva blir det neste?

La oss først oppsummere: Rengjøreren skriver du koden din - det være seg HTML, PHP, JavaScript, C - jo lettere blir det å vedlikeholde og justere senere. Dette innlegget forsøkte å gi deg et par håndhold på å rengjøre maler og refererer til gode ressurser på å komme i gang med dette og finne plugins.

Noen av dere har lagt merke til at jeg ikke snakket om noe relatert til CSS, JavaScript, minimering av elementer og andre former for optimalisering. Det er fordi neste innlegg vil være omtrent akkurat det.

I mellomtiden, gi meg beskjed i kommentarene dine tanker er etter å ha lest!