Add SVG renderer backend #1168

lights0123 · 2020-09-13T23:58:00Z

For documents that are originally in SWF format, exporting as a non-vector format can cause quality reduction. This PR adds a backend that creates SVG files, as well as adds it to the exporter CLI. I didn't need these features for my use case, so the following aren't implemented:

color_transform
masks

I believe this is the only product that hasn't disappeared from the internet that can do this (and have it actually work).

lights0123 · 2020-09-14T00:14:31Z

Things to consider, which I may try to figure out in the future:

Size optimization: creating one instance of each sprite (glyph?) in the <defs> section and re<use>ing it, instead of copying the SVG path commands for every single letter. I don't know how much work this requires. Ideally, this could also be used to allow copy-pasting
Multi-threading the exporter

render/svg/src/lib.rs

Herschel · 2020-09-18T00:55:26Z

Thanks for your work, and welcome!

Looks good to me -- it does add some maintenance burden whenever we tweak the RenderBackend, so we'd have to be okay with that; but I think this would be useful to have. We should probably label it as "experimental" until it's more fleshed out (color transforms, at least).

It'd be interesting to try using this on web to display an SWF using a SVG DOM element instead of canvas. This also makes me want to add an SVG screenshot hotkey to the desktop app.

@Dinnerbone, does this look okay as far as the exporter goes?

render/svg/src/lib.rs

Dinnerbone

Sorry for the big wait there, busy month!
Exporter part looks good. It'll need to be fixed up with recent changes but that should be trivial. Thanks for this!

(and yes, svg screenshot key is the best idea!)

midgleyc · 2020-12-05T17:54:57Z

Hi @Dinnerbone , @lights0123 ,

I've rebased this onto master at https://github.com/midgleyc/ruffle/tree/svg-exporter : I can't edit this branch, but I hope this might help.

I've found this the most accurate SWF -> SVG converter, so thanks for writing it.

lights0123 · 2020-12-07T00:38:29Z

@midgleyc thanks for your work! I've pulled your branch into mine.

lights0123 · 2020-12-07T02:58:09Z

The three failing nightly builds are because of a new clippy lint, and the web one is probably not my fault.

Herschel · 2020-12-27T12:20:19Z

Thanks for your effort @lights0123 and @midgleyc -- this has been somewhat low priority because it's not a core feature of the player, and I've been anticipating some other renderer changes, but since it's been useful to multiple people I'll try to merge this in the next few days. Thank you!

jhwgh1968 · 2021-01-08T00:45:19Z

It looks like CI on this failed, due to lints fixed in master. Perhaps time for a rebase?

midgleyc · 2021-01-09T09:59:30Z

A lot of code was copied from the canvas renderer when first created, and changes have been made to that since then. It might be nice to extract some of the swf -> svg code to keep it in sync -- most of swf_shape_to_svg is the largest one I can see. I think srgb_to_linear was also taken from the canvas renderer, so the request to use ruffle_core::backend::render::srgb_to_linear instead can also apply to that.

micwoj92 · 2022-07-09T02:49:17Z

This branch has conflicts that must be resolved

mero09-99 · 2022-07-20T19:47:44Z

Any progress on this?
this would be very useful to me,
especially the previously mentioned SVG screenshot key (no rasterization!)
#1168
#7036
mentions this, but I'm unsure

We currently have 3 render backends: 'canvas', 'webgl', and 'wgpu'. Assuming that we eventually merge the SVG backend proposed in ruffle-rs#1168, we'll have to maintain 4 independent render backends. I believe that we should be able to drop 'canvas' support, and only rely on 'webgl' (and 'wgpu' in the future) for browser support. This PR doesn't actually remove anything yet - we just display a click-through warning: "Using deprecated canvas backend! Please file a bug report" when the canvas backend is enabled. If it turns out that no one ever hits this warning in practice, we could move to disable the 'canvas' feature in the `web` crate by default. If there are still no bug reports, we could remove the backend entirely. caniuse.com shows the following global availability percentages: 'HTML element: canvas': 97.25% (https://caniuse.com/mdn-html_elements_canvas) 'WebGL (version 1)': 98.02% (https://caniuse.com/webgl) 'Canvas (basic support)': 99.51% (https://caniuse.com/canvas) Based on the data, dropping 'canvas' support would essentially only impact users with WebGL support disabled. It's possible that some browsers might do this for certain websites for privacy/security reasons - however, we already require WebAssembly, so I doubt that WebGL would ever be the only blocker for running Ruffle. The biggest potential downside to this is implementing 'BitmapData.draw'. In order to support SWFs that perform rapid 'BitmapData.draw; BitmapData.getPixel' sequences, we're going to need to perform CPU rendering to avoid blocking on copying data back and forth from the GPU. Using the 'canvas' backend for 'BitmapData.draw' would be one way to accomplish this - however, we would still need a separate backend for the desktop. I believe we could use the SVG backend on all platforms for implementing 'BitmapData.draw'. We'd need to add a dependency on an SVG renderer for desktop, and abstract over `web-sys` vs the `svg` crate. However, I think the result will be a large net reduction in code and maintenance burden.

Herschel reviewed Sep 18, 2020

View reviewed changes

render/svg/src/lib.rs Outdated Show resolved Hide resolved

Herschel reviewed Sep 18, 2020

View reviewed changes

render/svg/src/lib.rs Outdated Show resolved Hide resolved

lights0123 force-pushed the master branch from 39a5bd2 to 7a1f1f4 Compare September 18, 2020 01:16

Dinnerbone approved these changes Oct 11, 2020

View reviewed changes

lights0123 added 2 commits December 5, 2020 13:51

Add SVG renderer backend

0e56fe8

Use built-in functions

f02bbf2

lights0123 force-pushed the master branch from 7a1f1f4 to f02bbf2 Compare December 7, 2020 00:37

Fix clippy lint

927f315

firoball mentioned this pull request May 23, 2022

Vector exporter #7036

Open

Aaron1011 mentioned this pull request Jul 23, 2022

web: Deprecate 'canvas' backend #7459

Closed

mero09-99 mentioned this pull request Sep 11, 2022

Ruffle does not have Options bar #7951

Closed

danielhjacobs added A-rendering Area: Rendering & Graphics T-feature Type: New Feature (that Flash doesn't have) labels Sep 17, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add SVG renderer backend #1168

Add SVG renderer backend #1168

lights0123 commented Sep 13, 2020 •

edited

Loading

lights0123 commented Sep 14, 2020 •

edited

Loading

Herschel commented Sep 18, 2020 •

edited

Loading

Dinnerbone left a comment •

edited

Loading

midgleyc commented Dec 5, 2020

lights0123 commented Dec 7, 2020

lights0123 commented Dec 7, 2020

Herschel commented Dec 27, 2020

jhwgh1968 commented Jan 8, 2021

midgleyc commented Jan 9, 2021

micwoj92 commented Jul 9, 2022

mero09-99 commented Jul 20, 2022

Add SVG renderer backend #1168

Are you sure you want to change the base?

Add SVG renderer backend #1168

Conversation

lights0123 commented Sep 13, 2020 • edited Loading

lights0123 commented Sep 14, 2020 • edited Loading

Herschel commented Sep 18, 2020 • edited Loading

Dinnerbone left a comment • edited Loading

Choose a reason for hiding this comment

midgleyc commented Dec 5, 2020

lights0123 commented Dec 7, 2020

lights0123 commented Dec 7, 2020

Herschel commented Dec 27, 2020

jhwgh1968 commented Jan 8, 2021

midgleyc commented Jan 9, 2021

micwoj92 commented Jul 9, 2022

mero09-99 commented Jul 20, 2022

lights0123 commented Sep 13, 2020 •

edited

Loading

lights0123 commented Sep 14, 2020 •

edited

Loading

Herschel commented Sep 18, 2020 •

edited

Loading

Dinnerbone left a comment •

edited

Loading