Dure typebewerkingen vermijden
Identificeer en herstel diep recursieve of distributieve typen.
Dure typebewerkingen vermijden is een gratis TypeScript Academy-les op CoddyKit. Dit is les 2 van 4. Je kunt de volledige les hieronder gratis lezen en daarna in de browser praktisch oefenen met een ingebouwde code-editor en een AI-begeleider die 24/7 beschikbaar is. Deze les maakt deel uit van het leertraject TypeScript Academy. Je voortgang wordt gesynchroniseerd op het web en in de CoddyKit-app. De cursus TypeScript Academy bevat in totaal 4 lessen.
Wat maakt een typebewerking duur?
Diep recursieve typen, grote distributies over unietypen en complexe inferentieketens dwingen TypeScript om veel typevarianten te instantiëren, waardoor vertragingen exponentieel kunnen toenemen.
// Expensive: distributes over every member of a large union
type FilterStrings<T> = T extends string ? T : never;
type Result = FilterStrings<string | number | boolean | null | undefined | ...>;Vermijd te grote unietypen
Unietypen met honderden leden, bijvoorbeeld door veel letterlijke tekenreeksen, kunnen typecontrole erg traag maken. Overweeg het domein te beperken of string met validatie te gebruiken.
// Expensive
type HugeUnion = "a" | "b" | "c" | /* 200 more ... */ "z";
// Better: string with a runtime check
function isValid(s: string): s is ValidString { return VALID_SET.has(s); }Gebruik interfaces in plaats van complexe typealiassen
TypeScript slaat interfaces agressiever in de cache op dan complexe doorsnijdingen van typealiassen. Gebruik bij voorkeur interface voor objectstructuren waarnaar vaak wordt verwezen.
// Slow: recomputed union intersection each time
type BigObject = TypeA & TypeB & TypeC & TypeD;
// Fast: interface (cached)
interface BigObject extends TypeA, TypeB, TypeC, TypeD {}Beperk de recursiediepte
Recursieve conditionele typen zijn krachtig, maar kunnen de dieptelimiet van TypeScript bereiken, meestal na 100 niveaus. Voeg een diepteteller toe om vroegtijdig af te breken.
type Flatten<T, Depth extends number[] = []> =
Depth["length"] extends 10 ? T
: T extends (infer U)[] ? Flatten<U, [...Depth, 0]>
: T;Cache tussenliggende typen
Geef complexe tussenliggende typen een naam, zodat TypeScript ze kan cachen en hergebruiken in plaats van ze bij elke verwijzing opnieuw te berekenen.
// Before: recomputed at each use
type MyResult<T> = T extends SomeComplex<infer U> ? Transform<U> : never;
// After: split into named intermediates
type ExtractU<T> = T extends SomeComplex<infer U> ? U : never;
type MyResult<T> = Transform<ExtractU<T>>;Vermijd diepe gemapte typen op grote objecten
Als je DeepReadonly toepast op een zeer groot objecttype, moet TypeScript elke eigenschap recursief doorlopen. Dat is duur.
// Expensive on 50-property nested objects
type Safe = DeepReadonly<HugeConfig>;
// Better: annotate at creation time with const assertionsGebruik luie evaluatie van generieke typen
Door een dure typebewerking in een uitgestelde berekening te verpakken, bijvoorbeeld een functietype dat het type retourneert, stel je de evaluatie uit totdat het type daadwerkelijk nodig is.
// Lazy evaluation via wrapper
type Lazy<T> = () => T;
type ExpensiveLazy = Lazy<DeepReadonly<HugeConfig>>;Gebruik expliciete retourtypen
Door retourtypen van functies expliciet te annoteren, voorkom je dat TypeScript ze bij elke aanroep opnieuw moet afleiden. Dat versnelt de typecontrole.
// Let TypeScript infer (may be slow for complex functions)
function process(data: Input) { return transform(data); }
// Faster: explicit annotation
function process(data: Input): Output { return transform(data); }isolatedDeclarations voor parallelle typecontrole
TypeScript 5.5+ isolatedDeclarations vereist expliciete retourtypen, waardoor parallelle typecontrole van onafhankelijke bestanden mogelijk wordt zonder volledige inferentie.
// tsconfig.json
{
"compilerOptions": {
"isolatedDeclarations": true
}
}Projectverwijzingen voor isolatie
Projectverwijzingen voorkomen dat TypeScript ongewijzigde pakketten opnieuw controleert. Dat levert de grootste winst op in grote monorepo's.
# With project references:
# tsc --build only recompiles packages whose sources changed
# Unchanged packages: declaration files used directlySamenvatting: dure typen vermijden
Houd TypeScript snel: vermijd enorme unietypen, cache tussenliggende typen, gebruik interfaces in plaats van complexe aliassen, beperk de recursiediepte, gebruik expliciete retourtypen en isoleer pakketten met projectverwijzingen.
Korte controle
Welke aanpak helpt TypeScript een objectstructuur agressiever te cachen?
Wat je hebt geleerd
Dure TypeScript-typebewerkingen omvatten grote unietypen, diepe recursie en herhaalde complexe inferentie. Optimaliseer door tussenliggende typen te cachen, interfaces te verkiezen, de grootte van unietypen te beperken en projectverwijzingen voor monorepo's te gebruiken.
Leer TypeScript met een AI-tutor — gratis
Schrijf echte code en voer die uit in je browser, krijg direct hulp van een AI-tutor die 24/7 beschikbaar is en ga verder waar je gebleven bent op het web of in de app.
- Cursussen
- 101
- Lessen
- 352
Veelgestelde vragen
Is de les “Dure typebewerkingen vermijden” gratis?
Ja — de volledige tekst van “Dure typebewerkingen vermijden” kun je hier gratis op het web lezen. Als je interactief wilt oefenen met een ingebouwde code-editor en een AI-begeleider die 24/7 beschikbaar is, en de rest van de cursus TypeScript Academy wilt ontgrendelen, kun je upgraden naar CoddyKit PRO. De cursus TypeScript Academy bevat in totaal 4 lessen.
Wat leer ik in “Dure typebewerkingen vermijden”?
Identificeer en herstel diep recursieve of distributieve typen. Je oefent met TypeScript Academy door code rechtstreeks in de browser uit te voeren. Een AI-begeleider die 24/7 beschikbaar is beantwoordt je vragen terwijl je de les doorwerkt.
Heb ik ervaring nodig om met TypeScript Academy te beginnen?
Ervaring vooraf is niet nodig. TypeScript Academy op CoddyKit is opgebouwd voor beginners tot gevorderden, zodat je hier of bij het begin kunt starten en in je eigen tempo kunt leren. Dit is les 2 van 4.
Hoe lang duurt de les “Dure typebewerkingen vermijden”?
De meeste lessen van CoddyKit duren ongeveer 5–10 minuten. Elke les is kort en interactief, zodat je gestaag vooruitgaat en op het web en in de app precies verdergaat waar je was gebleven.
Kan ik code schrijven en uitvoeren in deze les over TypeScript Academy?
Ja. Elke les over TypeScript Academy bevat een ingebouwde code-editor, zodat je rechtstreeks in je browser echte code kunt schrijven en uitvoeren en direct feedback van AI krijgt — lokale installatie is niet nodig.
Alle lessen in deze cursus
- Trage TypeScript-compilatie profileren
- Dure typebewerkingen vermijden
- skipLibCheck en geïsoleerde declaraties
- Typechecking in CI: strategieën en tools