Back
Next.js 15: Deep Dive into Server Actions & Turbopack

Next.js 15: Deep Dive into Server Actions & Turbopack

20/05/2024 - 09:15

Next.js 15 redefine la arquitectura de aplicaciones React con un enfoque agresivo hacia Server Components por defecto y un modelo de caché más predecible. Este artículo explora los cambios arquitectónicos críticos para ingenieros senior.

1. Caching Semantics: Un cambio de paradigma

Uno de los cambios más polémicos y necesarios ha sido el ajuste en la heurística de caché. A diferencia de la versión 14, donde el caché era agresivo por defecto, Next.js 15 introduce staleTimes para mejorar la frescura de los datos en el cliente.

// next.config.ts
const nextConfig = {
  experimental: {
    staleTimes: {
      dynamic: 30, // segundos
      static: 180, // segundos
    },
  },
};

Esto permite un control mucho más fino sobre cuándo se invalida el Router Cache del cliente, evitando el problema clásico de "datos fantasmas" tras una mutación.

2. Server Actions: Más allá de los formularios

Las Server Actions no son solo para <form>. Son el reemplazo de facto para la capa API en aplicaciones monolíticas. Permiten composición de funciones asíncronas con seguridad de tipos de punta a punta.

// actions/user.ts
'use server'

import { z } from 'zod';
import { db } from '@/lib/db';

const schema = z.object({ email: z.string().email() });

export async function createUser(data: z.infer<typeof schema>) {
  const parsed = schema.safeParse(data);
  if (!parsed.success) return { error: 'Invalid fields' };
  
  try {
    await db.user.create({ data: parsed.data });
    return { success: true };
  } catch (e) {
    return { error: 'Database constraint violation' };
  }
}

3. Turbopack: Production Ready?

Turbopack ha alcanzado una estabilidad del 99% en pass-rate de los tests de integración de Next.js. La mejora en cold starts es drástica, reduciendo el tiempo de arranque de 2s a ~300ms en proyectos grandes.

Métricas de rendimiento observadas (Benchmark interno)

  • HMR (Hot Module Replacement): 15ms constante, independiente del tamaño del árbol de componentes.
  • Initial Route Load: 40% más rápido gracias a la compilación bajo demanda perezosa (lazy on-demand).

Conclusión

Next.js 15 no es una actualización incremental; es una maduración de la visión RSC (React Server Components). La adopción temprana se recomienda para equipos que sufren cuellos de botella en tiempos de compilación o complejidad en la gestión de estado del servidor.