Reunalaskenta Cloudflare Workersilla ja Denolla · Oppitunti

Bundlen koko ja koodin optimointi

Pienennätte Workerin bundlen kokoa ja suorittimen käyttöä, jotta edge-koodinne latautuu nopeammin ja toimii rajoitusten puitteissa.

Oppitunti 4/413 vaihetta

Bundlen koko ja koodin optimointi on ilmainen Reunalaskenta Cloudflare Workersilla ja Denolla-oppitunti CoddyKitissä. Tämä on oppitunti 4/4. Voit lukea koko oppitunnin alta ilmaiseksi ja harjoitella sen jälkeen käytännössä selaimessa sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla. Oppitunti kuuluu Reunalaskenta Cloudflare Workersilla ja Denolla-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Reunalaskenta Cloudflare Workersilla ja Denolla-kurssilla on yhteensä 4 oppituntia.

Miksi paketin koko on tärkeä

Workereilla on skriptin kokorajoitus (ilmaisella paketilla pakattu koko on 1 Mt, maksullisilla paketeilla enemmän).

Pienemmät paketit tarkoittavat seuraavaa:

Nopeampi jäsentäminen ja käynnistyminen
Pienempi muistijalanjälki
Kylmäkäynnistyksen pienempi vaikutus

Koodin optimointi parantaa suorituskykyä suoraan edge-verkossa.

Mitatkaa ennen optimointia

Wrangler ilmoittaa paketin koon jokaisen koontiversion yhteydessä. Mitatkaa aina ensin.

wrangler deploy --dry-run
# Total Upload: 142.18 KiB / gzip: 38.94 KiB

Tree shaking

Käyttäkää ES-moduulien import- ja export-rakenteita, jotta bundleri voi tehdä käyttämättömän koodin tree shaking -poiston.

Tuokaa vain tarvitsemanne osat, älkää koskaan koko kirjastoa, jos yksi funktio riittää.

// Good: only pulls debounce
import debounce from 'lodash-es/debounce';

// Bad: pulls all of lodash
import _ from 'lodash';

Suosikaa kevyitä riippuvuuksia

Raskaat npm-paketit kasvattavat paketteja nopeasti. Suosikaa pieniä, edge-verkkoon sopivia kirjastoja.

Käyttäkää alustan URL-, crypto.subtle- ja fetch-rajapintoja polyfillien sijaan
Vaihtakaa moment.js pieneen päivämääräapukirjastoon
Analysoikaa paketti bundle analyzerilla

Käyttäkää Web Standard -rajapintoja

Workerit ja Deno tarjoavat monia Web Platform -rajapintoja natiivisti, joten polyfillejä ei tarvitse sisällyttää pakettiin.

// Native crypto, no dependency needed
const hash = await crypto.subtle.digest(
  'SHA-256',
  new TextEncoder().encode('hello')
);

Pienentäminen

Wrangler pienentää tuotantokoontiversiot oletusarvoisesti, mutta varmistakaa, että toiminto on käytössä.

[build]
minify = true

Suorittimen ajan vähentäminen

Workerit laskutetaan ja niitä rajoitetaan suorittimen ajan, ei seinäkelloajan, perusteella. Optimoikaa usein suoritettavat koodipolut:

Välttäkää synkronisia silmukoita valtavien taulukoiden läpi
Välimuistittakaa lasketut tulokset KV:hen tai muistiin
Suoratoistakaa suuret vastaukset puskuroinnin sijaan

Suoratoistakaa puskuroinnin sijaan

Suoratoisto lähettää tietoja niiden tuottamisen aikana, jolloin muistin käyttö pysyy pienenä ja suorittimen kuormitus tasaisena.

const { readable, writable } = new TransformStream();
response.body.pipeTo(writable);
return new Response(readable, response);

Ladatkaa harvoin käytetty koodi tarpeen mukaan

Dynaaminen import() voi siirtää harvoin tarvittavien koodipolkujen lataamisen myöhemmäksi ja pitää aloitusmoduulin kevyenä.

if (needsHeavyFeature) {
  const { process } = await import('./heavy.js');
  process();
}

Analysoikaa pakettinne

Käyttäkää analysointityökalua selvittääksenne, mitkä riippuvuudet vievät eniten tilaa. Wranglerin käyttämä esbuild voi tuottaa metafilen.

esbuild src/index.ts --bundle --metafile=meta.json
# upload meta.json to esbuild.github.io/analyze

Parhaiden käytäntöjen yhteenveto

Pidätte edge-koodin nopeana ja pienenä seuraavasti:

Mitatkaa paketin koko jokaisen julkaisun yhteydessä
Tehkää tree shaking ja tuokaa riippuvuudet rajatusti
Suosikaa natiiveja Web API -rajapintoja polyfillien sijaan
Pienentäkää, suoratoistakaa ja ladatkaa koodi tarpeen mukaan
Vähentäkää usein suoritettavien koodipolkujen suorittimen aikaa

Pikatesti

Mikä tekniikka mahdollistaa suoraan sen, että bundleri poistaa käyttämättömän kirjastokoodin?

Vastaa interaktiivisessa oppitunnissa

Kertaus

Optimoitte sekä koon että nopeuden:

Mitatkaa ensin, tehkää sitten tree shaking ja pienentäkää koodi
Käyttäkää natiiveja Web API -rajapintoja ja kevyitä riippuvuuksia
Suoratoistakaa ja ladatkaa koodi tarpeen mukaan muistin ja suorittimen käytön vähentämiseksi
Analysoikaa paketti ongelmakohtien löytämiseksi

Kevyet Workerit käynnistyvät nopeammin ja maksavat vähemmän: edge-verkossa jokaisella kilotavulla on merkitystä.

Aloita maksutta

Opi Reunalaskenta Cloudflare Workersilla ja Denolla tekoälytuutorin avulla — ilmaiseksi

Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.

Kurssit: 12
Oppitunnit: 47

Aloita opiskelu maksutta Näytä koko kurssi

Usein kysytyt kysymykset

Onko oppitunti ”Bundlen koko ja koodin optimointi” ilmainen?

Kyllä – oppitunnin ”Bundlen koko ja koodin optimointi” koko tekstin voi lukea täällä verkossa ilmaiseksi. Jos haluat harjoitella interaktiivisesti sisäänrakennetulla koodieditorilla ja ympäri vuorokauden käytettävissä olevan tekoälytuutorin avulla sekä avata koko Reunalaskenta Cloudflare Workersilla ja Denolla-kurssin, päivitä CoddyKit PROhon. Reunalaskenta Cloudflare Workersilla ja Denolla-kurssilla on yhteensä 4 oppituntia.

Mitä opin oppitunnilla ”Bundlen koko ja koodin optimointi”?

Pienennätte Workerin bundlen kokoa ja suorittimen käyttöä, jotta edge-koodinne latautuu nopeammin ja toimii rajoitusten puitteissa. Harjoittelet Reunalaskenta Cloudflare Workersilla ja Denolla-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.

Tarvitsenko kokemusta aloittaakseni Reunalaskenta Cloudflare Workersilla ja Denolla-opiskelun?

Aiempi kokemus ei ole tarpeen. CoddyKitin Reunalaskenta Cloudflare Workersilla ja Denolla-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 4/4.

Kuinka kauan ”Bundlen koko ja koodin optimointi”-oppitunnin suorittaminen kestää?

Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.

Voinko kirjoittaa ja suorittaa koodia tällä Reunalaskenta Cloudflare Workersilla ja Denolla-oppitunnilla?

Kyllä. Jokainen Reunalaskenta Cloudflare Workersilla ja Denolla-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.

Kaikki tämän kurssin oppitunnit

← Takaisin: Reunalaskenta Cloudflare Workersilla ja Denolla