diff --git a/apps/www/app/(home)/blog/[slug]/page.tsx b/apps/www/app/(home)/blog/[slug]/page.tsx index a9734b5a9..662939ebb 100644 --- a/apps/www/app/(home)/blog/[slug]/page.tsx +++ b/apps/www/app/(home)/blog/[slug]/page.tsx @@ -74,8 +74,9 @@ export default async function BlogPostPage(props: { alt={page.data.author} width={32} height={32} + sizes="32px" className="blog-page__avatar" - unoptimized + preload /> ) : ( @@ -84,8 +85,9 @@ export default async function BlogPostPage(props: { alt={page.data.author} width={32} height={32} + sizes="32px" className="blog-page__avatar" - unoptimized + preload /> ) ) : null} diff --git a/apps/www/app/(home)/blog/page.tsx b/apps/www/app/(home)/blog/page.tsx index e66d41424..8848109c9 100644 --- a/apps/www/app/(home)/blog/page.tsx +++ b/apps/www/app/(home)/blog/page.tsx @@ -70,8 +70,8 @@ export default function BlogIndexPage() { alt="" width={20} height={20} + sizes="20px" className="blog-page__avatar blog-page__avatar--sm" - unoptimized /> ) : null} {page.data.author} diff --git a/apps/www/lib/blog-author.test.ts b/apps/www/lib/blog-author.test.ts index 97201bfb5..2108225e9 100644 --- a/apps/www/lib/blog-author.test.ts +++ b/apps/www/lib/blog-author.test.ts @@ -22,7 +22,7 @@ describe("blog-author", () => { it("generates avatar url", () => { expect(getAuthorAvatarUrl("yamcodes", 32)).toBe( - "https://github.com/yamcodes.png?size=32", + "https://avatars.githubusercontent.com/yamcodes?s=32", ); }); }); diff --git a/apps/www/lib/blog-author.ts b/apps/www/lib/blog-author.ts index bd71d72d2..d0a3c388b 100644 --- a/apps/www/lib/blog-author.ts +++ b/apps/www/lib/blog-author.ts @@ -22,8 +22,12 @@ export function getAuthorGithub( } /** - * Returns a direct GitHub avatar image URL. + * Returns a direct GitHub avatar image URL (no redirect). + * + * Prefer `avatars.githubusercontent.com` over `github.com/{user}.png`, which + * 302s with `Cache-Control: no-cache` and forces a cold fetch on every render + * when `next/image` is marked `unoptimized`. */ export function getAuthorAvatarUrl(githubHandle: string, size = 64): string { - return `https://github.com/${githubHandle}.png?size=${size}`; + return `https://avatars.githubusercontent.com/${githubHandle}?s=${size}`; } diff --git a/apps/www/next.config.ts b/apps/www/next.config.ts index 6b628e36a..8da6a9dd9 100644 --- a/apps/www/next.config.ts +++ b/apps/www/next.config.ts @@ -13,10 +13,6 @@ const config = { outputFileTracingRoot: path.join(__dirname, "../../"), images: { remotePatterns: [ - { - protocol: "https", - hostname: "github.com", - }, { protocol: "https", hostname: "avatars.githubusercontent.com",