I'm trying to use images from my public folder when generating dynamic OG image and I can't see any recommended way of doing this.

The only working way I found feels really clunky and I'm getting warnings that the resource can't be cached

    const logo = await fetch(
        new URL('../../public/icon.png', import.meta.url)
    ).then(res => res.arrayBuffer());
    const logoSrc = `data:image/png;base64,${Buffer.from(logo).toString(
        'base64'
    )}`;

    const bg = await fetch(
        new URL('../../public/page_background.png', import.meta.url)
    ).then(res => res.arrayBuffer());
    const bgSrc = `data:image/png;base64,${Buffer.from(bg).toString('base64')}`;