Lower the resolution of every component i'm using

[fathom barn]

Hello,
Is it possible to lower the resolution of every components I'm using?
I already optimized my player with low resolution video but I wonder if it's possible to lower the resolution of my animated div/svg i'm using?

[eager prairie]

divs and svgs are vector graphics!
therefore you cannot "lower the resolution"

[fathom barn]

@eager prairie Thanks for your response but i'm wondering how do some web base editor manage to lower the resolution for the text & svg ? (This one doesn't use Remotion)

[eager prairie]

text and svg are vectors!
they don't have a "resolution".

I don't understand the question

[fathom barn]

I’m asking because in some web-based video editors, when you zoom in/out of the canvas, all components (text, SVG, UI layers) become pixelated, as shown in the screenshot. I’m trying to understand how that effect is achieved and whether it’s done via canvas/WebGL rasterization, DPR control, or another rendering strategy.

[eager prairie]

when you scale vectors, they don't get pixelated
when you scale bitmaps (like videos) they do get pixelated

usually that gets you the best optics at any scale
if you want to rasterize a vector, for example to preview how the pixel grid will be laid out, like when you zoom in in figma, then that is more complicated

you need to draw it a canvas and set image-rendering: pixelated I think https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/image-rendering