Presupuestos de memoria de Canvas para capturas de pantalla largas: por qué los límites cambian según el dispositivo
Una captura de pantalla de 1.000 × 20.000 contiene 20 millones de píxeles. En un lienzo RGBA sin comprimir, el búfer de píxeles sin procesar por sí solo es de aproximadamente 80 millones de bytes antes de que se cuenten los lienzos temporales, las imágenes de origen decodificadas, las instantáneas de deshacer, los datos PDF y la sobrecarga del navegador. Por lo tanto, el tamaño del archivo en el disco es una mala estimación de la memoria de edición.
La versión PDF de captura de pantalla 0.0.13 utiliza presupuestos de historial y píxeles que reconocen el dispositivo para reducir fallas en sistemas con poca memoria y, al mismo tiempo, conservar más detalles y capacidad de deshacer en dispositivos más potentes. Este artículo explica esos valores actuales y el razonamiento que los usuarios pueden aplicar a cualquier flujo de trabajo de imágenes basado en navegador.
Los píxeles, no los megabytes comprimidos, impulsan el coste de Canvas
PNG y JPEG comprimen información visual repetida o predecible. Un PNG de 4 MB puede expandirse a un búfer de píxeles mucho más grande después de la decodificación. El primer cálculo para una captura de pantalla es:
pixel area = width × height
Una estimación aproximada del límite inferior del buffer es:
RGBA bytes = width × height × 4
Con 32 millones de píxeles, un búfer sin formato ocupa aproximadamente 128 MB. Una operación del navegador puede mantener temporalmente la imagen decodificada, el lienzo de destino, el lienzo recortado, la vista previa y el estado de deshacer al mismo tiempo. El uso real de la memoria depende de la implementación y del navegador, por lo que la fórmula es una guía de planificación más que una promesa.
Presupuestos de píxeles de PDF de captura de pantalla actuales
El editor lee la sugerencia navigator.deviceMemory del navegador cuando está disponible y, en caso contrario, asume un valor medio conservador. Sus límites de píxeles de Canvas son:
| Memoria del dispositivo reportada | Presupuesto de píxeles de lienzo | | --- | ---: | | 2 GB o menos | 20.000.000 | | Hasta 4 GB | 32.000.000 | | Hasta 8 GB | 48.000.000 | | Más de 8 GB | 64.000.000 |
El valor del navegador es aproximado y no está disponible universalmente. No debe interpretarse como una medida precisa de RAM libre. El presupuesto es una barrera de seguridad, no un puntaje de referencia.
Cómo se escalan las imágenes de gran tamaño
Cuando una imagen cargada excede el presupuesto de píxeles seleccionado, el editor calcula una escala usando la raíz cuadrada de la proporción del área permitida:
scale = √(pixel budget ÷ source pixel area)
Tanto el ancho como el alto se multiplican por esa escala. Esto preserva la relación de aspecto al tiempo que reduce el área total al presupuesto. Por ejemplo, dividir ambas dimensiones a la mitad reduce el área de píxeles a un cuarto.
El escalado evita que a una sola imagen se le asigne un lienzo ilimitado, pero también reduce los detalles de origen. El texto pequeño de la interfaz y las líneas finas deben inspeccionarse al 100 por ciento en la vista previa del PDF. Si resultan difíciles de leer, divida la fuente en secciones más estrechas o más cortas en lugar de aumentar repetidamente la calidad de la compresión.
El historial de anotaciones tiene su propio costo.
Deshacer instantáneas puede duplicar un lienzo grande. Por lo tanto, la captura de pantalla PDF adapta la profundidad del historial:
- los lienzos muy grandes o los dispositivos que informan 2 GB conservan dos instantáneas;
- los lienzos con más de 12 millones de píxeles o los dispositivos con hasta 4 GB se quedan con tres;
- los casos típicos de gama media se quedan con cuatro;
- los dispositivos que informen al menos 8 GB pueden almacenar hasta seis.
Las URL de objetos más antiguos se revocan cuando se desalojan las instantáneas. Esto limita los recursos retenidos del navegador sin alterar el documento actual. Los usuarios aún deben exportar o guardar trabajos importantes en lugar de tratar el historial de deshacer como almacenamiento persistente.
Las dimensiones pueden fallar antes que el área total
Los navegadores y los servidores de gráficos pueden imponer un ancho o alto máximo del lienzo además del área total de píxeles. La ruta de unión del PDF de captura de pantalla aplica una dimensión máxima separada antes del presupuesto del área. Las imágenes extremadamente estrechas y altas pueden alcanzar un límite de dimensión incluso cuando su área total parece razonable.
Las versiones del navegador, la configuración de la GPU, el sistema operativo y la memoria disponible afectan el comportamiento práctico. El tutorial de Canvas de MDN describe la API, pero no proporciona un máximo seguro universal para todos los entornos.
Síntomas de presión de la memoria.
- la imagen se decodifica pero la vista previa permanece en blanco;
- La creación del lienzo devuelve un contexto inutilizable;
- la pestaña del navegador se recarga o deja de responder;
- las anotaciones se vuelven lentas porque las instantáneas son grandes;
- La generación de PDF falla mientras aún se muestra la imagen original;
- el navegador informa de un error de asignación o de falta de memoria.
Estos síntomas no indican automáticamente un archivo dañado. Reproduzca con una copia más pequeña, cierre pestañas pesadas no relacionadas y registre las dimensiones de origen y el contexto del dispositivo.
Formas más seguras de manipular material muy largo
- Capture secciones con nombre con superposición visible.
- Estreche la ventana gráfica para excluir las barras laterales irrelevantes, pero asegúrese de que el texto siga siendo legible.
- Utilice la exportación oficial del servicio fuente cuando conserve la estructura o los metadatos.
- Evite ediciones repetidas innecesarias en un lienzo de tamaño máximo.
- Conserve la imagen original hasta que el PDF pase la inspección.
- Abra el PDF exportado en un segundo visor antes de eliminar cualquier archivo intermedio.
Para recibos, investigaciones o pruebas de respaldo, los archivos seccionales pueden ser más claros que una imagen enorme. Utilice nombres deterministas como part-01, part-02 y registre la superposición o los límites de la sección.
Un informe de capacidad reproducible
Al informar un problema, incluya el ancho y alto del origen, el tamaño del archivo comprimido, las versiones del navegador y de la extensión, el nivel de memoria del dispositivo informado, si está disponible, la operación intentada y las dimensiones más pequeñas que reproducen el error. No adjunte capturas de pantalla privadas cuando una imagen sintética pueda demostrar el mismo comportamiento de asignación.
Los límites adaptativos no implican que todos los dispositivos de un nivel se comporten de manera idéntica. Son un compromiso explícito entre detalle, estabilidad y capacidad de deshacer. Comprender las matemáticas de píxeles ayuda a los usuarios a elegir una captura más pequeña y clara antes de que el navegador alcance un límite irrecuperable.