TypeScript Isolated Declarations: Tingkatkan Kelajuan Monorepo

Pembinaan monorepo sering menjadi perlahan disebabkan cara TypeScript mengendalikan fail deklarasi. Secara lalai, TypeScript menganalisis setiap rantaian import sebelum ia mencipta satu fail .d.ts. Ini mewujudkan barisan menunggu yang panjang di mana pakej-pakej mesti menunggu antara satu sama lain.

Anda boleh mengatasi masalah ini dengan bendera --isolatedDeclarations.

Bendera ini membolehkan pembinaan selari. Daripada menunggu kebergantungan (dependencies), setiap pakej menjana deklarasinya sendiri secara bebas. Pasukan dapat melihat peningkatan kelajuan pembinaan sebanyak 3x hingga 15x ganda.

Masalahnya: TypeScript biasanya membuat inferens jenis merentasi sempadan modul. Jika Pakej A bergantung pada Pakej B, pengkompil mesti menyelesaikan B sepenuhnya sebelum ia boleh bermula pada A. Dalam monorepo yang besar, kebanyakan pakej akan terbiar sementara pengkompil bekerja satu demi satu.

Penyelesaiannya: Bendera --isolatedDeclarations mengubah peraturan tersebut. Ia memerlukan anda menulis anotasi jenis yang eksplisit untuk semua perkara yang anda eksport.

Kompromi: Kod anda akan mempunyai lebih banyak teks. Anda mesti menambah jenis pulangan secara manual pada fungsi dan jenis pada pemalar. Anda tidak boleh bergantung kepada pengkompil untuk meneka jenis-jenis ini daripada kod anda.

Hasilnya: Oleh kerana setiap eksport mempunyai jenis yang jelas, pengkompil tidak perlu melihat pakej lain untuk memahaminya. Ia boleh memproses setiap pakej pada masa yang sama.

Hasil Dunia Sebenar:

  • Sebuah monorepo dengan 18 pakej mengurangkan masa pembinaan daripada 47 saat kepada 3.2 saat.
  • Sebuah monorepo dengan 32 pakej melihat peningkatan 8x ganda pada saluran paip CI.
  • Prestasi berskala mengikut teras CPU anda. Lebih banyak teras bermakna lebih banyak pakej dibina serentak.

Cara Migrasi:

  1. Aktifkan bendera tersebut dalam tsconfig.json akar dan setiap konfigurasi pakej.
  2. Gunakan bendera "composite" untuk membenarkan rujukan projek.
  3. Tambah jenis pulangan eksplisit pada fungsi yang dieksport:

// Before export function add(a: number, b: number) { return a + b; }

// After export function add(a: number, b: number): number { return a + b; }

  1. Tambah jenis eksplisit pada pemalar yang dieksport:

// Before export const SETTINGS = { port: 3000 };

// After export const SETTINGS: { port: number } = { port: 3000 };

Jika anda tidak menambah jenis-jenis ini, pengkompil akan mengeluarkan ralat. Ini memastikan jenis anda adalah deterministik dan pantas.

Sumber: https://dev.to/jsmanifest/typescript-isolated-declarations-real-world-performance-gains-in-monorepo-build-times-25g3