-
Notifications
You must be signed in to change notification settings - Fork 950
Open
Description
Problem
Rendered email HTML includes auto-injected image preload links in the <head>:
<link rel="preload" as="image" href="https://..." />These are not authored in the email template, but still appear in final output.
For email HTML, these preload tags do not seem useful and add unnecessary head noise.
Why this matters
In a normal web page, image preloads can make sense.
In email HTML, they do not.
When generating emails, I want the output to stay as email-specific and minimal as possible.
Reproduction
Simple template with Img:
import { Html, Head, Img } from "@react-email/components";
export const MyEmail = () => (
<Html>
<Head />
<Img src="https://example.com/logo.png" width={130} height={26} alt="Logo" />
</Html>
);Rendered HTML includes something like:
<head>
<link rel="preload" as="image" href="https://example.com/logo.png" />
...
</head>Expected behavior
One of these:
- React Email strips these unnecessary preload links from final email HTML
- React Email exposes an option to disable resource-hint injection during render
- React Email documents the recommended way to suppress them
Current workaround
Adding loading="lazy" to Img suppresses the preload link in my current stack:
<Img
src="https://example.com/logo.png"
width={130}
height={26}
alt="Logo"
loading="lazy"
/>That seems to work in practice, but it feels like an indirect React-server-rendering side effect rather than an explicit email-rendering contract.
Request
Would you consider either:
- removing these preload links from rendered email HTML by default, or
- adding a render option / documented pattern to suppress them intentionally?
Environment
@react-email/components:1.0.8@react-email/render:2.0.4- React:
19.x
Reactions are currently unavailable