[Webkit-unassigned] [Bug 230766] New: Canvas drawImage is very slow when used with video as source

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=230766

            Bug ID: 230766
           Summary: Canvas drawImage is very slow when used with video as
                    source
           Product: WebKit
           Version: Safari Technology Preview
          Hardware: Mac (Intel)
                OS: macOS 11
            Status: NEW
          Severity: Blocker
          Priority: P2
         Component: Canvas
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: digitalix4 at gmail.com
                CC: dino at apple.com

Created attachment 439181

  --> https://bugs.webkit.org/attachment.cgi?id=439181&action=review

comparison between Chrome and Safari

I'm running the latest Safari and Safari Technology Preview and I've run into a performance issue in Safari.

I have a video that is encoded in H264 2176x1088. The video itself plays smoothly however I have to cut the content of it into 8 different canvas elements.

I have a working demo of it working however the performance I'm getting is abysmal. I've ran the same code in Google Chrome 94 and it's perfect.

Here is the comparison:
Chrome takes about 0.5-2ms to draw
Safari takes 150-330ms to draw
Firefox takes 100-150ms

And it has to run at 30 fps... which is completely impossible right now.

Here is a demo to showcase the issue: https://cdn.zu.casa/dev/apple/index.html

If open developer console it'll print out to the console the time it took to render.

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20210924/7c46a2fb/attachment.htm>