Cum să construim site-uri mai rapide

Jan 31, 2026
să

Înainte de discuția lui la Generați Londra La 21 septembrie am prins Patrick Hamann. , un inginer de performanță web la Rapid , care este într-o misiune de a construi o rețea mai rapidă pentru toți.

Ce implică rolul dvs. rapid?
Patrick Hamann: Faptly este o platformă de nori de margine care stă la baza unor marci cele mai mari din lume. Rolul meu se concentrează în mod predominant pe R & D; Lucrul cu echipele în cadrul realizării rapoartelor pentru a utiliza tehnologiile client și standardele web pentru a îmbunătăți performanța și livrarea produselor noastre și - cel mai important - serviciile clienților noștri. Unele proiecte curente includ inițiative în legătură cu monitorizarea performanțelor browserului, a măsurătorilor și a lucrătorilor de servicii.

Înainte de a vă alătura rapid, ați petrecut timp la The Guardian, cât și la cele financiare. Cum au abordat performanța web?
PH: Performanța nu mai este un post-implementare sau lista de verificare. Trebuie să fie un efort constant pe ca fiecare persoană din organizație să ia în considerare, de la proiectare până la livrare. Acesta este un lucru pe care aceste organizații de știri le-a realizat foarte devreme, introducând practici cum ar fi infrastructura de monitorizare a clădirilor pentru a măsura și compara performanța împotriva concurenților, prioritizarea livrării conținutului față de alte caracteristici și utilizarea tehnologiilor precum lucrătorii de servicii.

Care este cel mai mare obstacol pentru o experiență rapidă online chiar acum?
PH: Un cuvânt: JavaScript. Cred că ar trebui să elaborez cu ușurință: Web-ul se află la vârful unei crize de obezitate JavaScript. Pagina web medie oferă acum aproximativ 500kb de script. Script-ul care durează mai mult de o secundă doar pentru a parsa numai pentru a executa - pe un dispozitiv cu acționare scăzut și mai mare de cinci secunde pentru a ajunge la o stare pe care utilizatorul le poate interacționa cu pagina. Prin urmare, singura modalitate de a îmbunătăți experiența utilizatorilor site-urile noastre este de a măsura, optimiza și de a reduce JavaScript-ul nostru - mai presus de toate.

WebPageTest runs a free website speed test from multiple locations around the globe using real browsers and at real consumer connection speeds

WebPageTest rulează un test de viteză gratuită a site-ului web din mai multe locații din întreaga lume utilizând browsere reale și la viteze reale de conectare a consumatorilor

Care sunt instrumentele dvs. preferate pentru a optimiza performanța web?
PH: Sunt un credincios puternic că nu puteți optimiza ceea ce nu ați măsurat încă. Deci, caseta mea de instrumente este puternic ponderată la instrumentele de măsurare și profilare. Pentru măsurarea sintetică, voi ajunge întotdeauna WebPageTest și instrumente de dezvoltare a browserului (panouri de rețea și performanță). Cu toate acestea, nimic nu bate și experiența utilizatorilor reali (R.U.M), deci o bună cunoaștere a API-urilor de sincronizare a performanței browserului ajută, de asemenea.

Ați lucrat la unele code-uri foarte mari. Care sunt provocările de a lucra la scară?
PH: Pe lângă mare, aș susține că o bază de coduri mari acționează cea mai mare parte a problemelor pe care le-ați găsi într-una mai mică: Eliminarea CSS nefolosită (o problemă pe care cred că este nerezolvată), cache, active construi conducte și versiune și așa mai departe. De asemenea, veți obține mai multe "puștiți biți" - cele mai bune practici devin anti-modele în timp. Dar personal am constatat că majoritatea provocărilor la scară sunt problemele oamenilor, nu cele tehnice. Încă nu lucrez într-o mare organizație care nu este afectată de Legea lui Conway.

Vă numiți un avocat de îmbunătățire progresivă. Ce este despre această abordare care rezonează cu dvs.?
PH: Contrar credinței populare, utilizatorii noștri folosesc de fapt produsele pe care le construim în lumea reală: unul plin de condiții de navigare non-ideal și eșec în jurul fiecărui colț. Îmbunătățirea progresivă ne permite să construim experiențe care sunt incluzive tuturor utilizatorilor noștri și sunt rezistenți la eșecurile lumii reale. Este destul de simplu: începeți cu elementele de bază, nu o bibliotecă JavaScript de 300kb pe care a spus-o barista locală. Nu ar trebui să uităm de elementele de bază.

Ce ești încântat de dezvoltarea Frontend în acest moment?
PH: Web-ul este amenințat. Utilizatorii petrec mai mult timp în experiențele native - și astfel de app, departe de deschiderea webului. Cu toate acestea, pare să fim locuri de șantiere care iau 20 de secunde și costă £ 1,20 pe încărcătură pe conexiunea mea de roaming, în cele din urmă conducerea utilizatorilor noștri departe.

Din fericire, tehnologiile precum lucrătorul de servicii și API-urile asociate sunt aici pentru a ajuta. Nu pot să aștept o nouă eră a site-urilor rapide și reziliente care funcționează în continuare offline, pot sincroniza datele mele în fundal și mă pot anunța cu actualizările. Unii oameni numesc această evoluție "Apps Web progresivă". Prefer termenul "web".

In his talk at Generate London Patrick Hamann will explore the current, past, and future best-practices for loading assets in the browser

În discuția sa la Generate Londra Patrick Hamann va explora cele mai bune practici actuale, trecute și viitoare pentru încărcarea activelor în browser

Ceea ce oamenii se așteaptă să învețe de la discuția dvs. la Generați Londra ?
PH: La outsider, servind un site web pare destul de simplu: trimiteți unele HTML și CSS în jos, apoi browserul decide ce să facă în continuare. Cu toate acestea, o mulțime se întâmplă de fapt sub capotă, toate venind la un cost pentru utilizatorii noștri.

Cum determină browserul ce activă să solicite în continuare? Cum putem măsura viteza percepută a site-urilor noastre web? Cum putem folosi caracteristicile moderne de platformă web pentru a influența prioritatea și viteza bunurilor noastre? Sperăm că vorbirea mea va răspunde la aceste întrebări și mai mult. Oferind publicului instrumentele pentru a crea experiențe mai rapide, mai rezistente pentru utilizatorii lor.

Generați Londra La 21/22 septembrie caracteristici 15 alte prezentări care acoperă animațiile web, strategia UX, prototiparea, accesibilitatea, componentele CSS responsabile și multe altele. Există, de asemenea, patru ateliere de a alege de la o zi înainte de conferință, dar biletele sunt foarte limitate. Rezervați-vă spotul acum Fotografiile!

să - Cele mai populare articole

Cum să vă opriți ochelarii în ceață când purtați o mască de față

să Jan 31, 2026

(Credit Imagine: Getty Images) Dacă ochelarii tăi păstrează încețoșați când purtați o mască de față, nu ..

Creați texturi cu instrumentul de ștampilă de model

să Jan 31, 2026

(Credit de imagine: Lino Drieghe) Dacă sunteți blocat, priviți la o panza goală sau cu care se confruntă o scurt..

Utilizați diagrama.js pentru a transforma datele în diagrame interactive

să Jan 31, 2026

Pagina 1 din 2: Folosind Chart.JS: Pași 01-10 Folosind Chart.JS: Pași 0..

Cum să faci propria ta caracteristică

să Jan 31, 2026

Pentru cineva care lucrează profesional în Design de caractere , O Biblie de caractere este unul dintre elemente..

Cum să prototipe o aplicație mobilă cu studio de origami

să Jan 31, 2026

Într-o lume în care utilizatorii au așteptări mari despre experiența lor pe web și pe mobil, prototiparea și evaluarea utilizatorilor este esențială. Este acum comun să se repete pr..

4 pași simpli pentru a vă îmbunătăți randamentul

să Jan 31, 2026

Utilizarea luminilor Dome a fost una dintre cele mai mari progrese în crearea CGI în ultimele decenii. Îmbătrânirea unei sce..

Cum să pictați un portret atmosferic în Photoshop

să Jan 31, 2026

Pictura unui portret poate fi o sarcină dificilă. Chiar dacă ați stăpânit Cum de a desena o față , puteți..

Creați copii digitale de calitate ale artei dvs.

să Jan 31, 2026

Arta nu este doar despre crearea, este și despre partajare. Odată ce ați făcut o lucrare frumoasă, sunteți mândru, este doar natural că veți dori ca alții să o vadă și ei. Exist�..

Categorii