skip to Main Content

I’m trying to save an HTML div containing both text and images as an image. I’ve used canvas-based methods like html2canvas, but it takes a lot of time to generate the image, especially for larger or more complex content. Is there a more efficient way to do this or any alternative approach that speeds up the process?

2

Answers


  1. dom-to-image – faster than html2canvas. It directly converts DOM elements to images, rather than rendering them onto a canvas first. One source claims that dom-to-image is 71 times faster than html2canvas on average.

    html-to-image – apparently faster than html2canvas. It also directly converts DOM elements to images.

    https://www.npmjs.com/package/dom-to-image

    https://www.npmjs.com/package/html-to-image

    https://www.npmjs.com/package/dom-pdf

    Login or Signup to reply.
  2. You can try optimising html2canvas settings to Lower image scale (e.g., window.devicePixelRatio / 2).
    The second option would be to try an alternative like dom-to-image

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search