fix(images): Simpler logic for collecting images in Markdown (#6744)

3 files changed, 23 insertions, 31 deletions

diff --git a/packages/markdown/remark/src/rehype-images.ts b/packages/markdown/remark/src/rehype-images.ts
index 72f475700..fd1e8f70f 100644
--- a/packages/markdown/remark/src/rehype-images.ts
+++ b/packages/markdown/remark/src/rehype-images.ts
@@ -9,9 +9,7 @@ export function rehypeImages() {
 				if (node.tagName !== 'img') return;
 
 				if (node.properties?.src) {
-					if (file.dirname) {
-						if (!isRelativePath(node.properties.src) && !isAliasedPath(node.properties.src)) return;
-
+					if (file.data.imagePaths?.has(node.properties.src)) {
 						node.properties['__ASTRO_IMAGE_'] = node.properties.src;
 						delete node.properties.src;
 					}
@@ -19,24 +17,3 @@ export function rehypeImages() {
 			});
 		};
 }
-
-function isAliasedPath(path: string) {
-	return path.startsWith('~/assets');
-}
-
-function isRelativePath(path: string) {
-	return startsWithDotDotSlash(path) || startsWithDotSlash(path);
-}
-
-function startsWithDotDotSlash(path: string) {
-	const c1 = path[0];
-	const c2 = path[1];
-	const c3 = path[2];
-	return c1 === '.' && c2 === '.' && c3 === '/';
-}
-
-function startsWithDotSlash(path: string) {
-	const c1 = path[0];
-	const c2 = path[1];
-	return c1 === '.' && c2 === '/';
-}
diff --git a/packages/markdown/remark/src/remark-collect-images.ts b/packages/markdown/remark/src/remark-collect-images.ts
index afc61c468..470b770ed 100644
--- a/packages/markdown/remark/src/remark-collect-images.ts
+++ b/packages/markdown/remark/src/remark-collect-images.ts
@@ -1,17 +1,31 @@
 import type { Image } from 'mdast';
 import { visit } from 'unist-util-visit';
-import type { VFile } from 'vfile';
+import type { MarkdownVFile } from './types';
 
 export default function toRemarkCollectImages() {
 	return () =>
-		async function (tree: any, vfile: VFile) {
+		async function (tree: any, vfile: MarkdownVFile) {
 			if (typeof vfile?.path !== 'string') return;
 
 			const imagePaths = new Set<string>();
-			visit(tree, 'image', function raiseError(node: Image) {
-				imagePaths.add(node.url);
+			visit(tree, 'image', (node: Image) => {
+				if (shouldOptimizeImage(node.url)) imagePaths.add(node.url);
 			});
 
-			vfile.data.imagePaths = Array.from(imagePaths);
+			vfile.data.imagePaths = imagePaths;
 		};
 }
+
+function shouldOptimizeImage(src: string) {
+	// Optimize anything that is NOT external or an absolute path to `public/`
+	return !isValidUrl(src) && !src.startsWith('/');
+}
+
+function isValidUrl(str: string): boolean {
+	try {
+		new URL(str);
+		return true;
+	} catch {
+		return false;
+	}
+}
diff --git a/packages/markdown/remark/src/types.ts b/packages/markdown/remark/src/types.ts
index dc3bbce32..2f2d36de7 100644
--- a/packages/markdown/remark/src/types.ts
+++ b/packages/markdown/remark/src/types.ts
@@ -1,8 +1,8 @@
 import type * as hast from 'hast';
 import type * as mdast from 'mdast';
 import type {
-	all as Handlers,
 	one as Handler,
+	all as Handlers,
 	Options as RemarkRehypeOptions,
 } from 'remark-rehype';
 import type { ILanguageRegistration, IThemeRegistration, Theme } from 'shiki';
@@ -85,11 +85,12 @@ export interface MarkdownMetadata {
 export interface MarkdownVFile extends VFile {
 	data: {
 		__astroHeadings?: MarkdownHeading[];
+		imagePaths?: Set<string>;
 	};
 }
 
 export interface MarkdownRenderingResult {
 	metadata: MarkdownMetadata;
-	vfile: VFile;
+	vfile: MarkdownVFile;
 	code: string;
 }