Skip to content

#707 introduced non-deterministic rendering #708

@fshowalter

Description

@fshowalter

Bug report

Description / Observed Behavior

It seems #707 inadvertently introduced non-deterministic rendering based on platform. It's tricky, as not every font will trigger it, and not even every text combination within that font, but for some font/text combinations the renders will differ based on platform.

Expected Behavior

The same component with the same fonts produces the same SVG regardless of platform.

Reproduction

The playground (https://og-playground.vercel.app) isn't applicable here as you need different hosts to see the difference, but see fshowalter/franksbooklog.com#4526 the actions CI fails because the image bytes are different. The originals were generated on my local MacBook. I narrowed this down to the font by stripping everything out of one image then re-adding each piece, one by one until the bytestreams differed. I used https://github.com/fshowalter/franksbooklog.com/blob/main/src/components/Home/OpenGraphImage.tsx and everything worked up to re-adding the final tagline ('Literature is a relative term'). Adding 'Literature is a' wouldn't trigger the bug, but once I added 'relative' the renders differed.

Interestingly, another image uses a different font and has far more text combinations and all of those render identical, so it's clearly a problem with this specific font/text combination, but the regression seems to have been introduced with #707. Perhaps its a float issue between platforms? Perhaps a kerning issue the glyph caching doesn't account for?

Additional Context

Apologies for not having an easy reproduction, but hopefully you appreciate the homework put in to strip the component down to nothing then build back up to find the exact culprit and trace it to the glyph caching.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions