Streaming af data med promises i load
Returnér uafklarede promises fra load for at streame data efter den indledende HTML.
Streaming af data med promises i load er en gratis Sveltejs Academy-lektion på CoddyKit. Dette er lektion 1 af 4. Du kan læse hele lektionen gratis nedenfor — og derefter øve dig praktisk i browseren med en indbygget kodeeditor og en AI-vejleder, der er tilgængelig døgnet rundt. Den er en del af læringsforløbet i Sveltejs Academy, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. Sveltejs Academy-kurset indeholder 4 lektioner i alt.
Hvorfor streaming
Streaming fra load gør det muligt at gengive siden, før langsomme data er klar, hvilket forbedrer den oplevede ydeevne.
Returnér promises
Returnér data, hvor nogle egenskaber stadig er uafklarede promises.
export async function load() {
return {
fast: getFastData(),
slow: getSlowData() // promise, not awaited
};
}Await i markup
Brug {#await} på siden til at håndtere den streamede promise.
{#await data.slow}
<p>Loading...</p>
{:then result}
<p>{result}</p>
{/await}Indledende HTML
De hurtige data gengives med det samme, mens de langsomme data udfyldes, når de er klar.
Suspense-lignende brugeroplevelse
Vis skeletter eller indlæsningsindikatorer, mens data bliver streamet ind.
Flere streamede egenskaber
Stream flere egenskaber uafhængigt af hinanden, så hver enkelt bliver klar efter sin egen tidsplan.
Fejl i streams
Brug {:catch} i await-blokken til at håndtere en afvisning.
Server påkrævet
Streaming fra load fungerer kun, når SSR er aktiveret.
Ingen begrænsninger fra adaptere
De fleste adaptere (node, vercel, cloudflare) understøtter streaming.
Typesikkerhed
Ved at returnere værdier af typen Promise
Hvornår skal det bruges
Langsomme API'er, AI-genereret indhold og store forespørgsler. Alt, der ikke bør blokere den første gengivelse.
Hurtigt tjek
Hvad sker der, når du returnerer en promise fra load uden at vente på den?
Opsamling
Stream ved at returnere uafklarede promises fra load, og håndtér dem i markup med {#await}.
Lær HTML med en AI-underviser — gratis
Skriv og kør rigtig kode i din browser, få øjeblikkelig hjælp fra en AI-underviser døgnet rundt, og fortsæt, hvor du slap, på web eller i appen.
- Kurser
- 41
- Lektioner
- 163
Ofte stillede spørgsmål
Er lektionen “Streaming af data med promises i load” gratis?
Ja — hele teksten til “Streaming af data med promises i load” kan læses gratis her på nettet. Hvis du vil øve dig interaktivt med en indbygget kodeeditor og en AI-vejleder døgnet rundt og få adgang til resten af Sveltejs Academy-kurset, skal du opgradere til CoddyKit PRO. Sveltejs Academy-kurset indeholder 4 lektioner i alt.
Hvad lærer jeg i “Streaming af data med promises i load”?
Returnér uafklarede promises fra load for at streame data efter den indledende HTML. Du øver dig i Sveltejs Academy med praktisk kode, som du kører direkte i browseren, og en AI-vejleder døgnet rundt besvarer dine spørgsmål, mens du arbejder dig gennem lektionen.
Skal jeg have erfaring for at begynde på Sveltejs Academy?
Der kræves ingen tidligere erfaring. Sveltejs Academy på CoddyKit er tilrettelagt for både begyndere og øvede, så du kan starte her eller fra begyndelsen og lære i dit eget tempo. Dette er lektion 1 af 4.
Hvor lang tid tager lektionen “Streaming af data med promises i load”?
De fleste CoddyKit-lektioner tager cirka 5–10 minutter. Hver lektion er kort og interaktiv, så du gør løbende fremskridt og kan fortsætte, hvor du slap – på både web og app.
Kan jeg skrive og køre kode i denne Sveltejs Academy-lektion?
Ja. Alle Sveltejs Academy-lektioner har en indbygget kodeeditor, så du kan skrive og køre rigtig kode direkte i din browser og få øjeblikkelig feedback fra AI – uden lokal opsætning.
Alle lektioner i dette kursus
- Streaming af data med promises i load
- Udskudt indlæsning og Suspense-lignende UX
- Streaming fra serveren med +server.js
- Progressiv hydrering