Hogyan építsünk gyorsabb weboldalakat

Sep 11, 2025

kézikönyv

A beszélgetés előtt London létrehozása Szeptember 21-én felzárkóztunk Patrick hamann , egy webes teljesítménymérnök Gyorsan , Ki van egy küldetésen, hogy mindenki számára gyorsabb web legyen.

Mit jelent a szerepe gyorsan?
Patrick Hamann: A szélesen egy élfelhő platform, amely a világ egyik legnagyobb márkáit alátámasztja. Az én szerepem túlnyomórészt az R & amp; D; D; A csapatokkal gyorsan dolgozik az ügyféloldali technológiák és a webes szabványok felhasználása érdekében, hogy javítsa termékeink teljesítményét és szállítását, és - a legfontosabb - ügyfeleink szolgáltatásainkat. Egyes jelenlegi projektek közé kezdeményezések körül böngésző teljesítmény nyomon követése, mérőszámok és szolgáltatási dolgozók.

Mielőtt gyorsan csatlakoztál volna, töltött időt mind a Guardian, mind a pénzügyi időkben. Hogyan közeledtek hozzá a webes teljesítményhez?
PH: A teljesítmény már nem egy post-telepített kiegészítő vagy ellenőrző listaelem. Állandó erőfeszítésnek kell lennie arra, hogy a szervezetben lévő minden személy úgy véli, hogy a tervezésig a szállításig a szállításig. Ez olyasmi, ezek a hírek szervezetek felismerték már nagyon korán, gyakorlatba például az építési felügyeleti infrastruktúra mérése és összehasonlítása a teljesítmény, a versenytársak ellen, elsőbbséget a tartalomszolgáltatás mint más funkciók és hasznosító technológiák, mint a szolgáltatási dolgozók.

Mi a legnagyobb akadály a gyors élmény online most?
PH: Egy szó: JavaScript. Azt hiszem, ebben a kissé meg kell dolgoznom: a web a JavaScript elhízási válság csúcsán van. Az átlagos weboldal most 500 kb szkriptet biztosít. Script ami tovább tart, mint egy másodperc alatt csak parse - nemhogy végrehajtani - egy kis teljesítményű eszköz, és több mint öt másodpercig, hogy olyan állapotba, amely a felhasználó kölcsönhatásba léphet az oldalt. Ezért az egyetlen módja annak, hogy javítsuk webhelyeink felhasználói élményét, hogy mérje, optimalizálja és csökkentse JavaScript - mindenekelőtt.

WebPageTest runs a free website speed test from multiple locations around the globe using real browsers and at real consumer connection speeds — A WebPagetest ingyenes weboldal sebességvizsgálatot végez a világ több helyszínéről a világ minden tájáról, valós böngészők és valódi fogyasztói kapcsolat sebességgel

Melyek a kedvenc eszközei a webes teljesítmény optimalizálásához?
PH: Erősen hiszek, hogy nem optimalizálhatod, amit még nem mértél. Tehát az eszköztárom erősen súlyozott a mérési és profilozó eszközökhöz. A szintetikus méréshez mindig elérem Webpagetest és a böngészőfejlesztő eszközök (hálózati és teljesítménypanelek) először. Azonban semmi sem veri a valódi felhasználói tapasztalatok mérését is (R.U.M.m), így a böngésző teljesítményének időzítő API-k jó ismerete is segít.

Néhány nagy kódbázison dolgozott. Melyek a skála munkájának kihívásai?
PH: By and nagy, azzal érvelném, hogy egy nagy kódbázis megosztja a legtöbb problémát, amelyet egy kisebb, hogy egy kisebb egyben megtalálható: megszüntetve a fel nem használt CSS-t (a probléma megoldatlan), gyorsítótár, eszköz építeni csővezetékek és verziók, és így tovább. Ön is kap több "bit rot" - a legjobb gyakorlatok az idő múlásával anti-minták. De személyesen azt találtam, hogy a skála legnagyobb kihívásai az emberek problémái, nem technikai jellegűek. Még egy olyan nagy szervezetben dolgozom, amelyet a Conway törvénye nem érinti.

Hívja magát progresszív javító ügyvédnek. Mi az a megközelítés, amely rezonál veled?
PH: A népszerű meggyőződéssel ellentétben a felhasználók ténylegesen használják azokat a termékeket, amelyeket a valós világban építünk: egy tele nem ideális böngészési feltételekkel és minden sarkon. A progresszív javítás lehetővé teszi számunkra, hogy olyan élményeket hozzanak létre, amelyek magunkat tartalmaznak minden felhasználónk számára, és rugalmasak a valós világ kudarcaihoz. Ez elég egyszerű: csak kezdje el az alapokat, nem egy 300kb JavaScript könyvtár, amelyet a helyi Barista elmondta. Nem szabad elfelejtenünk az alapokat.

Mit izgatott a frontend fejlesztésében jelenleg?
PH: A web fenyegetés alatt áll. A felhasználók több időt töltenek a natív - és így a siled - app tapasztalatok távol az internet nyitottságától. Mégis úgy tűnik, hogy olyan építési területek, amelyek 20 másodpercet vesznek igénybe, és terhelésenként 1,20 fontot költenek a barangolási kapcsolatomon, végül a felhasználók tovább vezetése.

Szerencsére olyan technológiák, mint a szervizmunkás és a kapcsolódó API-k segítenek. Nem tudok várni egy új korszak gyors, rugalmas weboldalakat, amelyek még mindig offline állapotban vannak, szinkronizálhatom az adataimat a háttérben, és értesíti a frissítéseket. Vannak, akik ezt a progresszió "progresszív webes alkalmazásokat" hívják. Én inkább a "Web" kifejezés.

In his talk at Generate London Patrick Hamann will explore the current, past, and future best-practices for loading assets in the browser — Beszélgetésében Londonban Patrick Hamann felfedezi a jelenlegi, múltbeli és jövőbeli legjobb gyakorlatokat a böngészőben lévő eszközök betöltésére

Mit várhat az emberek, hogy megtanulják a beszélgetést London létrehozása ?
PH: A kívülálló, a weboldal kiszolgálásához elég egyszerű: küldjön néhány HTML és CSS le a vezetéket, akkor a böngésző úgy dönt, hogy mit kell tennie. Azonban sokat jelentenek a motorháztető alatt, mindannyian költsége a felhasználók számára.

Hogyan határozza meg a böngésző, hogy milyen eszközt kér a következőre? Hogyan mérhetjük a weboldalaink észlelt sebességét? Hogyan használhatjuk a modern webes platform funkciókat, hogy befolyásolhassuk az eszközök prioritását és sebességét? Remélhetőleg a beszélgetésem válaszol ezekre a kérdésekre és így tovább. A közönségnek a szerszámok gyorsabb, rugalmasabb tapasztalatokat teremtenek a felhasználók számára.

London létrehozása Szeptember 21-én 15 további előadást tartalmaznak a webes animációkra, az UX-stratégiára, a prototípusra, a hozzáférhetőségre, az érzékeny CSS-komponensekre és még sok másra. Négy műhely is választhat a konferencia előtti napon, de a jegyek nagyon korlátozottak. Foglalja le most a helyét !

Hogyan építsünk gyorsabb weboldalakat

kézikönyv - Most Popular Articles

Építsen egy SEO-barát fejkomponenst a Nextjs / Real

Design egy lejátszható avatar videojátékhoz

Hogyan hozzunk létre egy PAN labirintus stílusú szörnyet

Hogyan hangsúlyozzuk a kép fókuszpontját

A késtartó eszköz

Hozzon létre egy festői érzést a digitális művészetben

Hozzon létre egy olyan alkalmazást, amely érzékelőadatokat gyűjt

Plakátot készítsen a Photoshop-i sablonból

Kategóriák