Yavaş TypeScript Derlemesinin Profilini Çıkarma
Darboğazları bulmak için --extendedDiagnostics ve --generateTrace kullanın
Yavaş TypeScript Derlemesinin Profilini Çıkarma, CoddyKit'te ücretsiz bir TypeScript Academy dersidir. Bu, 4 dersinin 1. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, TypeScript Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. TypeScript Academy kursu toplamda 4 dersten oluşur.
TypeScript Neden Yavaşlayabilir?
Karmaşık koşullu türler, büyük birleşim türlerinin dağılımları ve derin özyinelemeli eşlemeli türler, büyük projelerde TypeScript'in tür denetleyicisinin önemli ölçüde yavaşlamasına neden olabilir.
// Expensive: distributive conditional on large union
type Slow = LargeUnion extends infer T ? T extends string ? T : never : never;--extendedDiagnostics Bayrağı
Ayrıştırma, bağlama, tür denetimi ve çıktı üretme aşamalarının derleme süresindeki dağılımını görmek için tsc --extendedDiagnostics komutunu çalıştırın.
tsc --extendedDiagnostics 2>&1 | head -40
# Output:
# Files: 212
# Lines: 48320
# Check time: 8.23s ← focus here--generateTrace Bayrağı
tsc --generateTrace ./trace, hangi türlerin maliyetli olduğunu görmek üzere Performance sekmesinde yükleyebileceğiniz, Chrome DevTools ile uyumlu bir izleme dosyası üretir.
tsc --generateTrace ./trace-output
# Open trace-output/trace.json in Chrome DevTools > Performanceİzlemeyi Analiz Etme
İzlemede, maliyetli tür örneklemelerini temsil eden uzun yatay çubukları arayın. Tür adı ve kaynak konumu, neyi en iyi duruma getirmeniz gerektiğini gösterir.
# Common culprits in traces:
# - Recursive mapped types with large inputs
# - Distributive conditionals over 50+ member unions
# - Deep infer chains on complex generics--listFiles Bayrağı
tsc --listFiles, derlemeye dahil edilen her dosyayı gösterir. Yanlışlıkla dahil edilen büyük node_modules klasörleri, yaygın bir performans sorunudur.
tsc --listFiles 2>&1 | grep node_modules | wc -l
# If this is large, check your include/exclude settingsDosya Dahil Edilmesini Azaltma
TypeScript'in hangi dosyaları işleyeceğini sınırlamak için tsconfig içinde include ve exclude kullanın.
{
"include": ["src/**/*"],
"exclude": ["node_modules", "dist", "**/*.test.ts"]
}Hızlı Kazanımlar için skipLibCheck
skipLibCheck: true, tüm .d.ts bildirim dosyalarının tür denetimini atlar; bu, çok sayıda bağımlılığı olan projelerde derlemeyi önemli ölçüde hızlandırabilir.
{
"compilerOptions": {
"skipLibCheck": true
}
}Maliyetli Türleri Yalıtma
Maliyetli tür hesaplamalarını adlandırılmış ara türlere çıkarın; böylece TypeScript bunları her kullanım yerinde yeniden hesaplamak yerine önbelleğe alabilir.
// Slow: recomputed at each usage
type Result = ComplexUnion extends string ? ComplexUnion : never;
// Fast: cached
type FilteredUnion = ComplexUnion extends string ? ComplexUnion : never;
type Result = FilteredUnion;transpileOnly ile Denetleme
Geliştirme sırasında daha hızlı bir geliştirme döngüsü için tür denetimini atlamak üzere ts-jest veya esbuild ile transpileOnly: true kullanın. Tam tür denetimlerini sürekli tümleştirmede ayrı olarak çalıştırın.
// jest.config.js with ts-jest
{
transform: {
"^.+\.tsx?$": ["ts-jest", { diagnostics: false }]
}
}Düzenleyici Performansı
VS'deki TypeScript dil sunucusu yavaşlamaları çoğu zaman aynı pahalı türlerden kaynaklanır. TypeScript: Restart TS Server seçeneğini ve dil sunucusundan alınan TS izini kontrol edin.
// VS Code settings.json to enable detailed TS server log:
// "typescript.tsserver.log": "verbose"Özet: Derleme Profilini Çıkarma
Üst düzey zamanlama için --extendedDiagnostics, tür bazında analiz için --generateTrace kullanın; derlemeyi hızlandırmak için dosya kapsamını, derin koşullu türleri ve büyük birleşim dağılımlarını azaltın.
Hızlı Kontrol
Chrome DevTools ile uyumlu bir iz dosyası hangi bayrakla oluşturulur?
Öğrendikleriniz
TypeScript derlemesinin profilini --extendedDiagnostics ve --generateTrace ile çıkarın. Dosya kapsamını sınırlayarak, skipLibCheck kullanarak, ara türleri önbelleğe alarak ve derin özyinelemeli ya da dağıtıcı tür işlemlerinden kaçınarak derleme süresini azaltın.
Sıkça Sorulan Sorular
“Yavaş TypeScript Derlemesinin Profilini Çıkarma” dersi ücretsiz mi?
Evet — “Yavaş TypeScript Derlemesinin Profilini Çıkarma” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve TypeScript Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. TypeScript Academy kursu toplamda 4 dersten oluşur.
“Yavaş TypeScript Derlemesinin Profilini Çıkarma” dersinde ne öğreneceğim?
Darboğazları bulmak için --extendedDiagnostics ve --generateTrace kullanın TypeScript Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.
TypeScript Academy öğrenmeye başlamak için deneyim gerekli mi?
Önceden deneyim gerekmez. CoddyKit'te TypeScript Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 1. dersidir.
“Yavaş TypeScript Derlemesinin Profilini Çıkarma” dersi ne kadar sürer?
Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.
Bu TypeScript Academy dersinde kod yazıp çalıştırabilir miyim?
Evet. Her TypeScript Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.
Bu kursun tüm dersleri
- Yavaş TypeScript Derlemesinin Profilini Çıkarma
- Maliyetli Tür İşlemlerinden Kaçınma
- skipLibCheck ve Yalıtılmış Bildirimler
- CI'da Tür Denetimi: Stratejiler ve Araçlar