Saltar al contenido principal

TSServer Consume Mucha CPU o Se Bloquea en VS Code: Cómo Solucionarlo

¿El servidor de TypeScript (tsserver) consume 100% CPU en VS Code? Causas, soluciones paso a paso y configuraciones para proyectos grandes que hacen que VS Code vaya lento.

Fran Cobos 5 min de lectura 960 palabras

Tabla de contenidos

Abres VS Code con tu proyecto de TypeScript. El ventilador del portátil arranca. Miras el administrador de tareas: tsserver.js consume 98% de CPU y 3GB de RAM. El autocompletado tarda 5 segundos. Escribir una línea congela el editor.

Es el problema número uno de TypeScript en VS Code y afecta especialmente a monorepos y proyectos con +500 archivos.

Qué es TSServer y por qué consume tanto

TSServer es el proceso que VS Code lanza para:

  • Autocompletado (IntelliSense)
  • Verificación de tipos en tiempo real
  • Navegación (Go to Definition, Find References)
  • Refactoring automático

Para hacer esto, tsserver carga el proyecto entero en memoria: todos los .ts, .tsx, los .d.ts de node_modules/@types, y todo lo referenciado por tu tsconfig.json.

En un proyecto con React + Material UI + Prisma + tRPC:

ConceptoArchivosMemoria aprox.
Tu código~200 archivos~50 MB
@types/react~150 archivos~80 MB
Material UI types~500 archivos~200 MB
Prisma Client generado~50 archivos~100 MB
Otros @types/*~300 archivos~150 MB
Total~1.200 archivos~580 MB

Y eso es un proyecto mediano. Un monorepo con 5+ packages puede llegar a 3-4 GB fácilmente.

Solución rápida: Reiniciar TSServer

Antes de tocar configuraciones, prueba reiniciarlo:

Ctrl+Shift+P → "TypeScript: Restart TS Server"

Si tras reiniciar vuelve a consumir CPU en 30 segundos, el problema es estructural — sigue leyendo.

Solución 1: Excluir archivos del análisis

tsconfig.json — exclude

{
  "compilerOptions": { ... },
  "exclude": [
    "node_modules",
    "dist",
    "build",
    ".next",
    "coverage",
    "**/*.test.ts",
    "**/*.spec.ts",
    "**/*.stories.tsx"
  ]
}

Los archivos en exclude no se analizan para tipos. Si tus tests o Storybook stories importan cosas raras que enlentecen tsserver, exclúyelos.

tsconfig.json — include (más agresivo)

En vez de excluir, di explícitamente qué incluir:

{
  "compilerOptions": { ... },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx"
  ]
}

Esto hace que tsserver ignore todo lo que no esté en src/. Drástico pero efectivo.

Solución 2: Configurar VS Code

Limitar memoria de TSServer

// settings.json
{
  // Memoria máxima para tsserver (en MB)
  "typescript.tsserver.maxTsServerMemory": 4096,

  // Desactivar análisis automático de proyectos adyacentes
  "typescript.disableAutomaticTypeAcquisition": true,

  // Retrasar el análisis al escribir (menos CPU)
  "typescript.suggest.autoImports": true
}

Desactivar features que no uses

{
  // Si no usas las sugerencias de imports automáticos
  "typescript.suggest.autoImports": false,

  // Si no usas el resaltado de referencias
  "editor.occurrencesHighlight": "off",

  // Si no necesitas el breadcrumb (barra de navegación arriba)
  "breadcrumbs.enabled": false,

  // Desactivar validación de JS si solo trabajas con TS
  "javascript.validate.enable": false
}

Solución 3: Monorepos — Un TSServer por package

En monorepos, tsserver intenta cargar todo. El truco es abrir solo el package en el que trabajas:

# ❌ Abrir la raíz del monorepo (carga todo)
code /mi-monorepo

# ✅ Abrir solo el package específico
code /mi-monorepo/packages/frontend

O usa workspaces de VS Code:

// mi-monorepo.code-workspace
{
  "folders": [
    { "path": "packages/frontend" },
    { "path": "packages/api" }
  ],
  "settings": {
    "typescript.tsserver.maxTsServerMemory": 3072
  }
}

Cada folder tendrá su propio tsserver, limitando la carga.

Solución 4: skipLibCheck

Si los tipos de node_modules son el problema:

// tsconfig.json
{
  "compilerOptions": {
    "skipLibCheck": true  // No verifica .d.ts de node_modules
  }
}

Esto reduce drásticamente el tiempo de análisis. La desventaja es que no detectarás errores en los tipos de las dependencias, pero en la práctica rara vez necesitas eso.

Solución 5: El proyecto generado de Prisma

Prisma genera un cliente con miles de tipos. Si tienes Prisma y tsserver consume mucha CPU:

// tsconfig.json
{
  "compilerOptions": {
    "skipLibCheck": true
  },
  "exclude": [
    "node_modules/.prisma"  // Excluir tipos generados de Prisma
  ]
}

Y en VS Code:

// settings.json
{
  "files.watcherExclude": {
    "**/node_modules/.prisma/**": true
  }
}

Solución 6: File watcher — Reducir lo que VS Code monitoriza

VS Code vigila cambios en archivos para reanalizar. En proyectos grandes, el watcher consume CPU:

// settings.json
{
  "files.watcherExclude": {
    "**/node_modules/**": true,
    "**/dist/**": true,
    "**/.next/**": true,
    "**/build/**": true,
    "**/coverage/**": true,
    "**/.git/objects/**": true
  }
}

Diagnóstico: Cómo saber qué consume CPU

1. Perfilado de TSServer

Ctrl+Shift+P → "TypeScript: Open TS Server Log"

Esto abre el log de tsserver. Busca líneas con tiempos altos:

[Info] Perf: 2845ms — getSemanticDiagnostics — src/components/Dashboard.tsx
[Info] Perf: 1203ms — getCompletionsAtPosition — src/utils/api.ts

Si un archivo tarda +1s, es el culpable. Probablemente tiene tipos complejos (generics anidados, conditional types, template literals).

2. Ver procesos de VS Code

# Windows — PowerShell
Get-Process -Name "node" | Sort-Object CPU -Descending | Select-Object -First 5

# Mac/Linux
ps aux | grep tsserver

3. VS Code Process Explorer

Ctrl+Shift+P → "Developer: Open Process Explorer"

Muestra todos los procesos de VS Code con CPU y memoria. El proceso tsserver.js aparecerá con su consumo real.

Tabla resumen de soluciones

ProblemaSoluciónImpacto en CPU
Muchos archivosexclude / include en tsconfig-40%
Tipos de node_modulesskipLibCheck: true-30%
Monorepo completoAbrir solo el package-60%
File watcherfiles.watcherExclude-15%
Autocompletado lentoDesactivar autoImports-20%
Prisma genera muchos tiposExcluir .prisma-25%
Todo juntoAplicar todas-70-80%

Artículos relacionados

Fran Cobos

Fran Cobos

Desarrollador Full Stack especializado en IA aplicada, automatización y desarrollo web. Escribo sobre herramientas, tutoriales y casos reales para programadores.

¿Necesitas desarrollo a medida?

Apps web, IA, módulos ERP — cuéntame tu proyecto.