LeanImg

Escalador de imágenes: ¿quieres un upscaler o un resizer?

Un resizer interpola píxeles y un upscaler los reconstruye. Cuál necesitas, con resultados medidos de 2x y 4x y los límites reales del navegador.

"Escalador de imágenes" cubre dos herramientas que hacen cosas opuestas a un archivo. Un resizer vuelve a muestrear los píxeles que ya tienes, por lo que 4000 px de ancho se convierten en 1080 px de ancho y el detalle se promedia en menos muestras. Un upscaler ejecuta la imagen a través de un modelo entrenado que reconstruye bordes y texturas que el original nunca almacenó. Ambos cambian el número en el cuadro de dimensiones. Solo uno de ellos puede agregar detalle, y solo ofrece 2x o 4x.

Ambos funcionan dentro de la pestaña del navegador. El upscaler descarga su modelo en tu máquina una vez, luego cada mosaico después de eso se calcula en tu propia GPU. Nada se publica en ningún lugar, porque no hay una ruta de API a la que publicar y ninguna acción del servidor en la base de código (esa es toda la arquitectura, descrita en nuestra página de privacidad). Cada otro escalador en esta categoría sube tu archivo y luego promete eliminarlo una o dos horas después.

¿Cuál es la diferencia entre redimensionar y escalar?

Redimensionar es interpolación. Nuestro resizer delega el trabajo al navegador, ya sea a través de createImageBitmap con `resizeQuality: "high"` o a través de un canvas `drawImage` con imageSmoothingQuality configurado en alto. De cualquier manera, el píxel de salida es un promedio ponderado de los píxeles de entrada a su alrededor. La promediación no puede producir un borde que no estaba en los datos de origen, por lo que aumentar por interpolación te da una copia más grande y suave de la misma información.

Escalar es reconstrucción. El nuestro ejecuta Real-ESRGAN realesr-general-x4v3, un modelo generativo entrenado para alucinar detalles plausibles a 4x, descrito en el artículo de 2021. Procesa la imagen en mosaicos de 256 px con un solapamiento de 16 px en cada lado, por lo que un mosaico siempre ve el contexto de sus vecinos antes de que la región central se escriba. El modelo adivina. Esas adivinanzas suelen ser correctas en rostros, telas y texto, y pueden estar muy equivocadas en patrones finos repetitivos.

¿Cuál realmente quiero?

Si el tamaño objetivo es más pequeño que el origen, quieres el resizer y no hay nada que discutir. Si el objetivo es más grande, la pregunta es si puedes permitirte las restricciones a continuación. Aquí está lo que las dos herramientas realmente hacen en nuestra construcción, tomado del código en lugar de la copia de marketing.

ResizerUpscaler
DirecciónCualquier tamaño objetivo, hacia arriba o hacia abajoSolo 2x o 4x
MétodoInterpolación de canvas del navegadorReal-ESRGAN realesr-general-x4v3
Formato de salidaFormato de origen mantenido (GIF y AVIF salen como PNG)Siempre PNG
Control de calidadPNG sin pérdida, todo lo demás recodificado a calidad 90Ninguno, PNG no tiene dial de calidad
Límite por lotes10 archivos, 50 MB en total1 archivo
Techo de entradaSolo el límite del loteAlrededor de 32 MP con WebGPU, alrededor de 1.1 MP sin
Preajustes15 tamaños sociales más 25/50/75 por cientoNinguno, solo los botones de 2x y 4x

Una fila merece una advertencia. El resizer tiene por defecto "no agrandar" marcado, lo que limita cualquier objetivo escrito a las dimensiones originales. Un preajuste social nombrado anula intencionalmente ese límite, porque un marco de historia limitado a 1080x1920 no coincide con ninguna especificación de plataforma.

¿Cuánto crece el archivo cuando escalo?

Mucho, y PNG es la razón. Ejecutamos small.png, 400x269 y 177.1 KB, a través de ambas configuraciones. A 2x salió 800x538 y 782.8 KB. A 4x salió 1600x1076 y 2.7 MB. Eso es aproximadamente 15 veces los bytes de entrada por 16 veces los píxeles, que es lo que parece la salida sin pérdida cuando el modelo ha llenado cada área plana con nueva microtextura. El upscaler escribe PNG en todos los casos, por lo que no hay un control deslizante de calidad para negociar.

Vista dividida de una imagen de origen de 400x269 y su resultado escalado de 800x538
small.png a 2x: 400x269 y 177.1 KB de entrada, 800x538 y 782.8 KB de salida. La ejecución a 4x del mismo archivo llega a 1600x1076 y 2.7 MB.

Envía el resultado al compresor antes de usarlo en cualquier lugar. Nuestro modo "sin compresión" de PNG es oxipng nivel 3, genuinamente sin pérdida, y redujo un alpha.png de 942.4 KB a 383.9 KB. El modo de paleta (imagequant) llevó el mismo archivo a 98.3 KB, lo cual está bien para gráficos planos y mal para un escalado fotográfico.

¿Por qué la opción 2x se ve más suave que 4x?

Porque 2x no es un modelo separado. realesr-general-x4v3 tiene exactamente una escala de salida, y es 4x. Cuando eliges 2x, ejecutamos la inferencia idéntica y luego reducimos cada mosaico de nuevo a la mitad de tamaño con el interpolador de canvas a alta calidad de suavizado. Así que el trabajo de la GPU es el mismo para ambos botones, y 2x es reconstrucción seguida de muestreo en ese orden. La reducción ocurre por mosaico, lo que significa que la imagen completa de 4x nunca existe en memoria durante un trabajo de 2x. Si deseas la salida cruda del modelo, elige 4x y redúcela tú mismo en el resizer después. El ancho de origen que cada multiplicador necesita para alcanzar 3840 px se calcula por separado.

¿Por qué el upscaler no acepta mi foto de 24 MP?

Depende enteramente de si tu navegador inicia WebGPU. Con WebGPU en funcionamiento, un trabajo de 4x acepta alrededor de 32 megapíxeles de entrada. Sin él, onnxruntime-web vuelve a un WASM de un solo hilo y el techo de entrada cae a alrededor de 1.1 megapíxeles, más pequeño que casi cualquier foto de teléfono. Ese no es un límite arbitrario. La inferencia de CPU en este modelo tarda minutos por megapíxel, y un trabajo de 24 MP colgaría la pestaña durante el resto de la tarde. Un archivo a la vez, siempre.

¿Qué más cambia el resizer además del recuento de píxeles?

Más de lo que la gente espera. Un origen PNG se mantiene como PNG y sigue siendo sin pérdida. Todo lo demás se recodifica, a calidad 90 por defecto, por lo que redimensionar un JPEG también es una recompresión, quieras o no. Un origen GIF sale como PNG, y si ese GIF era animado, pierdes cada fotograma excepto el primero. Los orígenes AVIF también salen como PNG. Los tres modos de ajuste son importantes cuando las relaciones de aspecto de origen y objetivo no coinciden: cubrir recortes centrales, estirar distorsiona y contener reduce el canvas al área ajustada en lugar de rellenarlo con barras. Si necesitas una región específica en lugar de un tamaño específico, el recortador es la herramienta adecuada, aunque toma un archivo a la vez y recodifica formatos con pérdida a una calidad codificada de 92.

Entonces, ¿qué debo hacer con mi archivo ahora?

Verifica primero el lado más largo. Por debajo de aproximadamente 1600 px y necesitas que sea más grande, abre el upscaler, ejecuta 2x, luego pasa el PNG por el compresor en modo sin pérdida. Por encima de eso, o ya en la resolución que necesitas, usa el resizer y elige un preajuste social para no tener que buscar las dimensiones. Si el objetivo es un feed, las cuatro formas que Instagram acepta y el techo de 1080 px detrás de ellas es la lista de la que trabajar.