Live data from Hacker News

Drawing Text Isn't Simple: Benchmarking Console vs. Graphical Rendering

cv.co.hu

41–42 of 42 posts

Re: Drawing Text Isn't Simple: Benchmarking Console vs. Graphical Rendering

#41
post #7

Earlier quoted context omitted.

SDF is awesome but even then it's not a silver bullet. It's a raster technique and some people want vector fonts or subpixel rendering.

I don't know how common it is in fonts, but for generic 2D vector graphics, problems arise from the management of self-intersections, i.e., the pixels where they fall. With an SDF rasterizer, how do you handle the pixel where two Bezier curves intersect in a fish-shaped path? For this reason, more conventional rasterizers with multisampling are often used, or rasterizers that calculate pixel coverage analytically, al…

Hmm I'm not sure I quite understand your question. The renderer uses predefined textures of signed distance fields. Essentially you're building a gradient out from your source vector. You can tweak how that texture is built and it doesn't need to be strictly the true distance.

In theory you could handle it however you want. You could make an SDF texture of a figure eight where the inside of the eight is purely zero and only the outside has a gradient. If you built a texture like this then your stroke with would only ever grow out of the shape.

This is an example of how SDF is very powerful.

If instead you're asking about the precision with regards to the infinitely small point of an intersection of two vectors it's actually not an issue at all. The technique uses the usual texture sampling pipeline such that the render will be as sharp as your SDF texture and as alias free as your mitmaping allows.

Re: Drawing Text Isn't Simple: Benchmarking Console vs. Graphical Rendering

#42
post #39
post #15

Earlier quoted context omitted.

Looks like it's caused by `backdrop-filter: blur(6px);` on `.menu-content`. After disabling that it's slow, but not that slow. Edit: This is with Firefox 144 on Ubuntu 22.04

No, actually the biggest difference is removing the `filter` property from the `.wave2` class which is used for rendering the background. With that removed the page is responsive even with the backdrop-filter - and it makes no visual difference AFAICS.

Thanks folks for all the suggestions, I've rewritten the whole page :)
Post reply on HN