de Stacey Tay

Ce am învățat de la participarea la conferința #PerfMatters

Note de la A conferință de performanță web front-end

Săptămâna aceasta am avut privilegiul de a participa #PerfMatters, o conferință axată pe performanța web front-end. Nu am mai fost la o conferință până acum, dar am fost încântat să particip, deoarece mi-a promis o gama uimitoare de difuzoare și subiecte.

am inceput adâncindu-se în performanța web cu aproximativ un an în urmă, și așa am crezut că aceasta ar fi o mare șansă să-mi aprofundez cunoștințele și să cunosc alte persoane din comunitate.

Această postare cuprinde trei părți:

(1) experiența mea de participare la conferință,

(2) câteva dintre lucrurile pe care le-am învățat la conferință și

(3) gânduri de despărțire.

Gânduri despre experiența conferinței

Toată lumea este atât de prietenoasă și abordabilă

M-am dus singur și a fost o experiență destul de intimidantă, deoarece în general sunt o persoană timidă și pot dura ceva timp să mă încălzesc. Dar, am făcut o regulă să nu stau singur în timpul prânzului și să încerc să vorbesc cu cel puțin 2 persoane în fiecare zi. Mă bucur că am făcut-o pentru că toți cei pe care i-am întâlnit au fost drăguți și amuzanți cu care să vorbesc.

Am ajuns să întâlnesc o mulțime de oameni, vorbind despre lucruri de la Model PRPL, experimentând cu Muncitori Cloudflare pentru a deservi mai bine utilizatorii din Australia (de la servere din SUA), prevalența crescândă a programării funcționale în dezvoltarea web front-end și cum să începeți cu snowboardingul (nu este legat de performanță, în cazul în care vă întrebați).

Discuțiile au fost absolut uimitoare

Toți vorbitorii aveau ceva legat de performanța web într-o formă sau alta despre care să vorbească și era evident că depuneau mult efort în prezentările lor. Jenna Zeigen‘s vorbi a acoperit o lungă listă de trucuri de interpretare și fiecare dintre punctele ei a avut o versiune de melodie pentru a merge împreună cu ele, care a fost atât de distractiv de informativă. Mi-a spus că i-a luat aproximativ 15 minute pentru fiecare cântec și că sunt cam 30 de acolo?

Videoclipurile discuțiilor ar trebui să fie anunțate pe @perfmattersconf în curând, dar o serie de diapozitive au fost deja publicate cu #perfmattersconf.

Discuțiile acoperă numeroasele fațete ale lucrului la performanța web

Îmbunătățirea performanței unei pagini web nu este doar un audit unic, rezolvarea problemelor care fac ca pagina respectivă să fie mai lentă și apoi să continuați. Este nevoie de un efort concertat din partea tuturor părților interesate—Negociere, proiectare, inginerie, marketing, produs — într-o organizație pentru a obține și a rămâne rapid.

Discuțiile nu s-au referit doar la modul în care am putea să ne îmbunătățim TTIs sau timpi de încărcare, care sunt importanți. Dar, au acoperit și celelalte părți importante din făcând webul accesibil și utilizabil pentru cât mai mulți oameni posibil. Din modul în care oamenii percep performanța la împuternicirea unei culturi de performanță, și din modul în care privilegiul definește performanța la intersecția performanței și accesibilitatea.

O listă neexhaustivă de sfaturi și trucuri de performanță învățate

Unele dintre acestea, dacă nu toate, ar putea fi cunoștințe comune, dar multe au fost noi pentru mine.

Cultura spectacolului

• Împuterniciți dezvoltatorii cu instrumente pentru a permite performanțe mai bune. De asemenea, face din performanță parte a procesului de dezvoltare.
• Comparați site-ul dvs. cu cel al concurenților dvs. pentru a obține un buy-in executiv la performanța de conducere. Utilizare Comparație video alăturată WebPagetest a paginii dvs. web împotriva călătoriei de încărcare a unui concurent pentru a vă direcționa succint punctul.
• Măsurați potențialele câștiguri anuale ale veniturilor de la creșterea vitezei site-ului cu Instrumentul Google Test My Site.

Performanță pe web

• Latența are un impact supradimensionat asupra lățimii de bandă la solicitările de rețea.
• Animații SVG sunt minunate pentru animarea încărcătoarelor din cauza dimensiunilor lor (relativ) mai mici.
• Strângeți pagina în 14 KB dacă este posibil, pentru a evita mai multe călătorii dus-întors din cauza pornirii lente TCP.
• Nu toate CDN-urile funcționează Prioritizarea HTTP / 2 conform așteptărilor.
• Dacă trebuie să utilizați fonturi web, Zach Leatherman a scris un ghid excelent despre cum să le încărcați bine.
• Performanța percepută este influențată de durată (durata efectivă pe care o durează un proces, denumită „performanță”), receptivitate, fluenţă (netezimea percepută a unui proces) și toleranţă (cât timp se așteaptă utilizatorul să dureze un proces). Diapozitive din Gemma Petrie și Heather McGawvorbeste mai departe Măsurarea performanței percepute pentru a prioritiza munca produsului.

Unele instrumente îngrijite

• Chrome instrument de acoperire a codului este util pentru a determina unde și când să împărțiți codul. Interacționați puțin cu pagina pentru a vedea cum se schimbă numerele și în funcție de Tim Kaldec, aproximativ 45% cod neutilizat este normal și va fi în scădere câștigurile marginale pentru a optimiza peste asta.
• Chrome suprascrie resursa de rețea caracteristica permite dezvoltatorilor să returneze un fișier salvat local, care este util pentru depanarea a ceva din mers.
• Foaia de calcul Google Docs pentru a efectua audituri în bloc WebPagetest.
• Explorator AST JavaScript online (bine, acesta nu este exact legat de performanța web, dar am aflat despre asta în timpul conferinței și nu mă pot opri din a juca cu el).
• Solicitați harta creează un grafic de rețea dintr-o pagină web și este util pentru vizualizarea solicitărilor terților.

Gânduri de despărțire

Dacă am primit o temă generală de la conferință, este că pentru a fi bun la performanța web, este crucial să înțelegem Cum browserul lucrări (lucruri precum cum redare se întâmplă și cale de redare critică). Dar, performanța nu se oprește doar la câștigurile tehnice.

Achiziționarea tuturor părților interesate, nu doar a ingineriei, este crucială pentru îmbunătățirea și menținerea performanței, deoarece performanța web depășește încărcarea unei pagini cât mai rapid posibil.

Există și performanță percepută să ia în considerare și apoi să stabilească dacă creează alte îmbunătățiri ale performanței îmbunătățiri suplimentare semnificative pentru afaceri sau utilizatori. Este important să rețineți că performanța este doar unu parte din experiența utilizatorului.

Nu am făcut prea multe fotografii în timpul conferinței (nota de sine pentru a face cu siguranță mai multe fotografii data viitoare), dar am reușit să o fotografiez.

Dacă sunteți interesat de performanța web sau doar dezvoltarea web în general, aceasta este o conferință uimitoare pentru verifică și este programat să se întâmple și anul viitor! Există, de asemenea, un program de burse pentru cei care nu pot participa fără asistență financiară. Aștept cu nerăbdare să ne vedem acolo anul viitor!

Mulțumim lui Hui Yi, Jingwen Chen și Yao Hui Chua pentru că au citit o versiune anterioară și au împărtășit feedback-ul lor.