Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Warning in browser console: Canvas2D: Multiple readback operations using getImageData are faster with the willReadFrequently attribute set to true when calling toDataURL #105

Open
nmalancea opened this issue Apr 29, 2024 · 8 comments
Labels
kind: feature New feature or request kind: optimization Performance, space, size, etc improvement

Comments

@nmalancea
Copy link

Screenshot 2024-04-29 at 1 01 41 PM

I get this warning in the browser console when calling toDataURL:

Canvas2D: Multiple readback operations using getImageData are faster with the willReadFrequently attribute set to true

Any ideas how to correctly configure the canvas to set { willReadFrequently: true }?

@agilgur5
Copy link
Owner

We might need to add a prop for the canvas's contextAttributes

@agilgur5 agilgur5 added kind: feature New feature or request kind: optimization Performance, space, size, etc improvement labels Apr 29, 2024
@Beatriz2529
Copy link

Hello, I have the same problem.
Could you give me an exemple please ?

@agilgur5
Copy link
Owner

agilgur5 commented Jun 5, 2024

I don't believe there's a workaround for this as the CanvasContext manipulation is not user-facing. That's why I wrote that this may require new props to support.
It is an open feature request, there are no existing examples.

In any case, this is a warning from a more recent browser feature and can safely be ignored.

@hossain45
Copy link

Does this error cause any performance issue? since you haven't added the feature yet shall I ignore this error at the moment? @agilgur5

@agilgur5
Copy link
Owner

agilgur5 commented Jul 6, 2024

It's not an error, it's a warning, so by definition you can ignore it.

And the warning is about a newer browser feature that did not exist until years after this library was created. It worked fine without the feature and will continue to work fine without it.

Enabling it for some use-cases will allow for a performance optimization (which is what this issue is labeled as). But again, it works fine without this.

@agilgur5
Copy link
Owner

We might need to add a prop for the canvas's contextAttributes

Looks like upstream enabled the same: szimek/signature_pad#761 (comment)

@mbohovic
Copy link

mbohovic commented Sep 3, 2024

Looks like upstream enabled the same: szimek/signature_pad#761 (comment)

@agilgur5 refer to signature_pad that it's fixed there, but it's useless for this package react-signature-canvas. It is not updated or compatible with the given version of signature_pad.

Would you update the react-signature-canvas package to be compatible with the new version of signature_pad?

thank you very much

@agilgur5
Copy link
Owner

agilgur5 commented Sep 3, 2024

@agilgur5 refer to signature_pad that it's fixed there, but it's useless for this package react-signature-canvas. It is not updated

I'm very aware of that, that's why this issue is still open, and not closed.
Recording a note that upstream introduced a similar feature is worthwhile in and of itself as it will be useful for future implementation.

Would you update the react-signature-canvas package to be compatible with the new version of signature_pad?

There is already a separate issue(s) for that, see #73 (comment).

@agilgur5 agilgur5 added this to the `signature_pad` v4 milestone Sep 3, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
kind: feature New feature or request kind: optimization Performance, space, size, etc improvement
Projects
None yet
Development

No branches or pull requests

5 participants