Tengo una imagen con un tamaño de alrededor de 12 MB y se tarda en cargar. ¿Hay alguna forma de reducir el tamaño de la imagen para que se cargue más rápido? Gracias
Nueva actualización: quiero reducir el tamaño de la imagen a medida que se carga desde un archivo de tipo de entrada.
Le sugiero que cargue imágenes usando el método Image() js para que el contenido restante de la página se cargue correctamente y use la propiedad loading = 'lazy' en las imágenes para que el navegador las cargue solo cuando estén visibles en la ventana gráfica o cuando te desplazas cerca de ellos.
function loadImg(){ var img = new Image(400, 400); img.src = 'https://pbs.twimg.com/profile_images/1220067947798024192/30eZhfxx_400x400.png'; img.setAttribute("loading", "lazy") document.body.appendChild(img); } #btn{ position: fixed; top: 5px } <input type="button" onclick="loadImg()" value="Load image" id="btn">