FLUX 3 Image se sirve mediante una API hospedada en lugar de ejecutarse en un portátil, lo que significa que el trabajo interesante ocurre después de que vuelve la petición. El modelo entrega una imagen fija de alta resolución sin saber nada de tu presupuesto de página, así que la diferencia entre un sitio rápido y uno lento es la tubería que envuelve la llamada.

Esta guía cubre la forma de petición y respuesta que usan la mayoría de las API de imagen y, después, el paso de redimensionar y codificar que convierte el resultado en algo publicable.

01Qué cambia una API de imagen hospedada

Un modelo local devuelve un tensor o un archivo en disco. Uno hospedado devuelve una URL o un bloque base64 dentro de JSON, y cada opción traslada el coste a otro sitio. Una URL mantiene pequeña la respuesta pero suele caducar en horas y te obliga a descargar y rehospedar los bytes igualmente. Base64 lo mantiene todo en una respuesta pero infla la transferencia cerca de un 33% y hace que tus registros de peticiones sean enormes.

Verifica los nombres de campo con la documentación actual

La petición siguiente sigue la forma que usan la mayoría de las API de imagen —un cuerpo JSON con prompt y tamaño, autenticado con un bearer token—. Black Forest Labs publica el endpoint y los parámetros exactos de FLUX 3, y cambian; trátalo como plantilla, no como contrato congelado.

02Pide una imagen a la API

Envía un POST con cuerpo JSON y cabecera de autorización. Los nombres de modelo y endpoint varían entre proveedores, así que guárdalos en configuración en lugar de repetirlos en diez sitios.

curl -X POST "$IMAGE_API_URL" \
  -H "Authorization: Bearer $IMAGE_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "prompt": "isometric illustration of a filing cabinet, soft indigo palette",
    "width": 1024,
    "height": 1024,
    "format": "png"
  }'

Respeta la proporción que realmente necesitas. Generar un cuadrado y recortarlo a banner tira los píxeles que pagaste, y pedir un lienzo muy ancho desperdicia recursos en zonas que recortarás.

03Maneja la respuesta: URL o base64

Las dos formas necesitan rutas de código distintas. La URL es un JSON corto que vuelves a pedir; base64 es una cadena enorme que decodificas y escribes en disco.

{
  "id": "req_9f3c1a",
  "status": "ready",
  "image": {
    "url": "https://cdn.example.invalid/generations/req_9f3c1a.png",
    "expires_at": "2026-10-04T12:00:00Z"
  },
  "seed": 812347
}

const res = await fetch(process.env.IMAGE_API_URL, {
  method: 'POST',
  headers: {
    Authorization: `Bearer ${process.env.IMAGE_API_KEY}`,
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({ prompt, width: 1024, height: 1024, format: 'png' }),
})

const data = await res.json()
const bytes = data.image.url
  ? Buffer.from(await (await fetch(data.image.url)).arrayBuffer())
  : Buffer.from(data.image.b64, 'base64')

await fs.writeFile(`out/${data.id}.png`, bytes)

Guarda la seed junto al archivo. Es la única forma de reproducir o variar el resultado después, y regenerarlo desde cero casi nunca es idéntico.

04Redimensiona antes de comprimir

El orden importa. Si comprimes primero y redimensionas después, el redimensionado debe inventar o descartar píxeles ya dañados por la codificación con pérdida. Redimensiona al tamaño de visualización y aplica después una sola codificación con pérdida.

Para un blog o una tarjeta de producto típicos, un resultado de 1024 píxeles ya es mayor de lo necesario. Reduce a unas dos veces el ancho de render y detente.

05Elige el formato y codifica una sola vez

Las imágenes generadas suelen ser PNG, sin pérdida y por tanto pesadas. Para salidas fotográficas, convierte a WebP; admite transparencia, así que no pierdes alfa al cambiar. Elige AVIF solo si puedes servir un fallback, porque el soporte del codificador y el coste de decodificación varían en dispositivos antiguos.

# Una sola pasada con pérdida sobre el original, tras redimensionar.
cwebp -q 82 -m 6 -resize 1200 0 source.png -o output.webp

Ajusta la calidad a ojo, no por número. Un valor de calidad no es un porcentaje de tamaño: el mismo ajuste puede reducir a la mitad una imagen y apenas mover otra, según el detalle de alta frecuencia que generó el modelo.

Nunca recodifiques un archivo con pérdida para reducir su tamaño

Pasar un JPEG por el codificador una segunda vez descarta más detalle con el mismo ajuste de calidad. Conserva siempre el PNG original, cambia los parámetros y recodifica desde ese máster.

06Conéctalo a un build o a un CMS

Ejecuta la tubería una vez al ingerir, no en cada petición. Genera la imagen, escribe el original en almacenamiento de objetos y produce dos o tres derivados de ancho fijo, sirviendo el que encaje con el viewport.

El conjunto estable para la mayoría de sitios es 400, 800 y 1600 píxeles de ancho, expuestos con srcset. Guarda la seed, el prompt y el nombre del modelo junto al activo para poder auditar su origen. Si una página muestra una imagen generada a todo el ancho sin atributos width y height, además del peso tendrás un salto de diseño.

07Errores comunes y soluciones

La regla práctica: trata la salida de la API como activo máster, nunca como el archivo que sirves. Reduce una vez, codifica una vez y conserva el original intacto para poder cambiar de idea sin pedirle al modelo la misma imagen dos veces.