search

fabricjs / fabric.js

Javascript Canvas Library, SVG-to-Canvas (& canvas-to-SVG) Parser
http://fabricjs.com
Other
29k stars 3.51k forks source link

Experiment with Path2D for improved performance #1263

Open kangax opened 10 years ago

kangax commented 10 years ago

http://blogs.adobe.com/webplatform/2014/04/01/new-canvas-features/

Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

melchiar commented 4 years ago

@jhondge @asturur I just did some basic testing and Path2D is indeed significantly faster than the current method when drawing a complex path. path-rendering-current path-rendering-path2d

asturur commented 4 years ago

yes it is without doubt quicker and saves memory and time from our parsing and caching of arcs.

If someone wants to make a pr to have both of them i m happy to review it.

melchiar commented 4 years ago

one difficulty is how to accurately detect full browser support for Path2D. Apparently Edge only has partial support, and doesn't allow parsing of svg path strings.

https://stackoverflow.com/questions/53787259/detect-when-path2d-with-svg-path-string-is-supported

asturur commented 4 years ago

Well there are 2 things at stake here, speed and code semplification. Now in my mind there was always the idea to simply SVG paths, since we can't draw the A segments and we need to parse them in multiple C segments.

Also SVG can have the lowercase and uppercase commands.

If you want to fiddle with path commands, having everything uppercase and not having As is easier.

So we could anyway support path2d after semplifying the paths and manually adding them to the Path2D object. That would give us speed anyway but more code more than less of it.