0Pricing
TypeScript Academy · Lezione

Profilazione della compilazione lenta di TypeScript

Utilizzi --extendedDiagnostics e --generateTrace per individuare i colli di bottiglia.

Profilazione della compilazione lenta di TypeScript è una lezione TypeScript Academy gratuita su CoddyKit. Questa è la lezione 1 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento TypeScript Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso TypeScript Academy include 4 lezioni in totale.

Perché TypeScript può essere lento

I tipi condizionali complessi, le distribuzioni su grandi unioni e i tipi mapped profondamente ricorsivi possono rallentare notevolmente il type checker di TypeScript nei progetti di grandi dimensioni.

// Expensive: distributive conditional on large union
type Slow = LargeUnion extends infer T ? T extends string ? T : never : never;

Flag --extendedDiagnostics

Esegua tsc --extendedDiagnostics per visualizzare una suddivisione del tempo di compilazione: analisi sintattica, binding, controllo dei tipi e generazione dell'output.

tsc --extendedDiagnostics 2>&1 | head -40
# Output:
# Files:             212
# Lines:            48320
# Check time:       8.23s  ← focus here

Flag --generateTrace

tsc --generateTrace ./trace produce un file di trace compatibile con Chrome DevTools, che può caricare nella scheda Performance per individuare i tipi più costosi.

tsc --generateTrace ./trace-output
# Open trace-output/trace.json in Chrome DevTools > Performance

Analisi del trace

Nel trace, cerchi le barre orizzontali lunghe che rappresentano istanziazioni di tipi costose. Il nome del tipo e la posizione nel codice sorgente indicano che cosa ottimizzare.

# Common culprits in traces:
# - Recursive mapped types with large inputs
# - Distributive conditionals over 50+ member unions
# - Deep infer chains on complex generics

Flag --listFiles

tsc --listFiles mostra ogni file incluso nella compilazione. Le cartelle node_modules di grandi dimensioni incluse accidentalmente sono una causa comune di problemi di prestazioni.

tsc --listFiles 2>&1 | grep node_modules | wc -l
# If this is large, check your include/exclude settings

Riduzione dei file inclusi

Utilizzi include e exclude nel tsconfig per limitare i file elaborati da TypeScript.

{
  "include": ["src/**/*"],
  "exclude": ["node_modules", "dist", "**/*.test.ts"]
}

skipLibCheck per miglioramenti rapidi

skipLibCheck: true salta il controllo dei tipi di tutti i file di dichiarazione .d.ts, velocizzando significativamente la compilazione nei progetti con molte dipendenze.

{
  "compilerOptions": {
    "skipLibCheck": true
  }
}

Isolamento dei tipi costosi

Estragga i calcoli costosi sui tipi in tipi intermedi con nome, così TypeScript può memorizzarli nella cache invece di ricalcolarli a ogni punto di utilizzo.

// Slow: recomputed at each usage
type Result = ComplexUnion extends string ? ComplexUnion : never;

// Fast: cached
type FilteredUnion = ComplexUnion extends string ? ComplexUnion : never;
type Result = FilteredUnion;

Controllo con transpileOnly

Durante lo sviluppo, utilizzi ts-jest o esbuild con transpileOnly: true per saltare il controllo dei tipi e velocizzare le iterazioni. Esegua separatamente i controlli completi dei tipi nella CI.

// jest.config.js with ts-jest
{
  transform: {
    "^.+\.tsx?$": ["ts-jest", { diagnostics: false }]
  }
}

Prestazioni dell'editor

I rallentamenti del language server di TypeScript in VS Code sono spesso riconducibili agli stessi tipi costosi da elaborare. Verifichi TypeScript: Restart TS Server e la traccia TS del language server.

// VS Code settings.json to enable detailed TS server log:
// "typescript.tsserver.log": "verbose"

Riepilogo: profilazione della compilazione

Utilizzi --extendedDiagnostics per le tempistiche di alto livello e --generateTrace per l'analisi per tipo; riduca inoltre l'inclusione dei file, i conditional type profondi e le distribuzioni di union di grandi dimensioni per velocizzare la compilazione.

Verifica rapida

Quale flag genera un file di traccia compatibile con Chrome DevTools?

Che cosa ha imparato

Profilare la compilazione di TypeScript con --extendedDiagnostics e --generateTrace. Ridurre il tempo di compilazione limitando l'inclusione dei file, utilizzando skipLibCheck, memorizzando nella cache i tipi intermedi ed evitando operazioni sui tipi profondamente ricorsive o distributive.

Domande Frequenti

La lezione «Profilazione della compilazione lenta di TypeScript» è gratuita?

Sì — il testo completo di «Profilazione della compilazione lenta di TypeScript» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso TypeScript Academy, passa a CoddyKit PRO. Il corso TypeScript Academy include 4 lezioni in totale.

Cosa imparerò in «Profilazione della compilazione lenta di TypeScript»?

Utilizzi --extendedDiagnostics e --generateTrace per individuare i colli di bottiglia. Eserciti TypeScript Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.

Ho bisogno di esperienza per iniziare TypeScript Academy?

Non è richiesta alcuna esperienza precedente. TypeScript Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 1 di 4.

Quanto tempo richiede la lezione «Profilazione della compilazione lenta di TypeScript»?

La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.

Posso scrivere ed eseguire codice in questa lezione TypeScript Academy?

Sì. Ogni lezione TypeScript Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.

Tutte le lezioni di questo corso

  1. Profilazione della compilazione lenta di TypeScript
  2. Come evitare operazioni costose sui tipi
  3. skipLibCheck e dichiarazioni isolate
  4. Controllo dei tipi in CI: strategie e strumenti
← Torna a TypeScript Academy