TypeScript Compiler is taking way too long to run

A few weeks back, running yarn tsc --noEmit started to take way too long that isn't even possible to run it without it crashing due to an out-of-memory error:


<--- Last few GCs --->

[3039:0x158078000]   140607 ms: Scavenge 2031.2 (2084.8) -> 2023.5 (2084.8) MB, 2.0 / 0.0 ms  (average mu = 0.633, current mu = 0.461) allocation failure;
[3039:0x158078000]   140615 ms: Scavenge 2031.2 (2084.8) -> 2024.8 (2084.8) MB, 2.2 / 0.0 ms  (average mu = 0.633, current mu = 0.461) allocation failure;
[3039:0x158078000]   140620 ms: Scavenge 2031.3 (2084.8) -> 2024.6 (2101.8) MB, 3.8 / 0.0 ms  (average mu = 0.633, current mu = 0.461) allocation failure;


<--- JS stacktrace --->

FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory


MOER TRACE, etc.

When specifying how much ram the compiler can use, like this: export NODE_OPTIONS="--max-old-space-size=8192"

then running: yarn tsc --noEmit --extendedDiagnostics

It runs without crashing and eventually, I get this:

Files:                         2017
Lines of Library:              9552
Lines of Definitions:        192247
Lines of TypeScript:          78753
Lines of JavaScript:              0
Lines of JSON:                 1895
Lines of Other:                   0
Identifiers:                 332062
Symbols:                    1907181
Types:                      3051718
Instantiations:            41284341
Memory used:               4369905K
Assignability cache size:    304593
Identity cache size:          10450
Subtype cache size:           35521
Strict subtype cache size:     6134
I/O Read time:                0.29s
Parse time:                   0.59s
ResolveModule time:           0.28s
ResolveTypeReference time:    0.00s
ResolveLibrary time:          0.00s
Program time:                 1.31s
Bind time:                    0.30s
Check time:                 457.23s
printTime time:               0.00s
Emit time:                    0.00s
Total time:                 458.84s

458 seconds? What's going on? How can I solve/debug this? I'm pretty sure we don't have 2,000 files.

Here's my tsconfig.json:


{
  "compilerOptions": {
    "allowJs": false,
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "jsx": "react-native",
    "lib": ["ES2016"],
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "noEmit": true,
    "strict": true,
    "skipLibCheck": true,
    "target": "ES2016",
    "baseUrl": ".",
    "paths": {
      "@app/*": ["./src/*"],
      "@assets/*": ["./assets/*"]
    }
  },
  "include": ["./src", "./assets"]
}

Here are all my folders, I have added src where all my code lives and assets where all my images live (SVGs, PNGs) in the include part of the tsconfig

This also started happening at the same time when VS Code snippets and ESLint became incredibly slow to the point where I had to code without them. I also don't know what is causing that.

Solution

Here's how I semi-solved it:

Guide

Install @typescript/analyze-trace source
Run: tsc --generateTrace anyFolderName while in the root of the project. If this command times out due to out of memory, do this first: export NODE_OPTIONS="--max-old-space-size=8192 (This is for MacOS. 8192=8gb, adjust the number till it is high enough)
Wait for the command to finish, then you will see two new JSON files inside anyFolderName.
Now, run: npx analyze-trace anyFolderName while in the root of the project. It will print a long log of hot spots, with file names and line numbers.
Go through it, file by file, they are sorted in terms of which file took the longest time (ms) to run. Either fix what's causing it to take too long (in the Guide I linked above, they have suggestions on how to do this) or @ts-nocheck at the top of that file.

In my case, I solved a few, refactored some, and the rest which I couldn't fix I just added @ts-nocheck to them. Running tsc now takes around 8 seconds as it was before. And VSCode/Eslint works just fine.

In my case, it was mostly the package use-form that would have types issues.