@janga/norna 0.7.29 → 0.7.30

package/scripts/generate-images.mjs

@@ -1,13 +1,10 @@
 import { getPageImageSourceKey } from './lib/site-conventions.mjs';
-import { execFile } from 'node:child_process';
 import { createHash } from 'node:crypto';
 import { copyFile, mkdir, readdir, readFile, rm, stat, lstat, writeFile } from 'node:fs/promises';
 import path from 'node:path';
-import { promisify } from 'node:util';
 import {
 	getContentFiles,
 	readSiteFile,
-	rasterImageExtensions,
 	staticImageExtensions,
 	supportedImageExtensions,
 	toPosixPath,
@@ -22,61 +19,16 @@ import {
 	siteDir,
 } from './lib/site-paths.mjs';
 
-const execFileAsync = promisify(execFile);
-
-const imageOutputVersion = 3;
+// Bump only when the raster recipe changes, not on ordinary engine releases.
+const rasterOutputVersion = 4;
+const staticOutputVersion = 3;
 const sourceHashSlugLength = 8;
 const widths = [480, 768, 1080, 1440, 1920];
 
-const run = async (command, args) => {
-	const { stdout } = await execFileAsync(command, args, { maxBuffer: 1024 * 1024 * 10 });
-	return stdout.trim();
-};
-
-const canRun = async (command, args = ['-version']) => {
-	try {
-		await run(command, args);
-		return true;
-	} catch {
-		return false;
-	}
-};
-
-const getImageMagick = async () => {
-	if (await canRun('magick')) {
-		return {
-			identify: (sourcePath) => run('magick', ['identify', '-format', '%w %h', sourcePath]),
-			convert: (sourcePath, outputPath, width) => run('magick', [
-				sourcePath,
-				'-auto-orient',
-				'-resize',
-				`${width}x`,
-				'-strip',
-				'-quality',
-				'82',
-				outputPath,
-			]),
-		};
-	}
-
-	if (await canRun('identify') && await canRun('convert')) {
-		return {
-			identify: (sourcePath) => run('identify', ['-format', '%w %h', sourcePath]),
-			convert: (sourcePath, outputPath, width) => run('convert', [
-				sourcePath,
-				'-auto-orient',
-				'-resize',
-				`${width}x`,
-				'-strip',
-				'-quality',
-				'82',
-				outputPath,
-			]),
-		};
-	}
-
-	throw new Error('ImageMagick is missing. Install either the "magick" command or both "identify" and "convert".');
-};
+let sharpPromise;
+const getSharp = () => sharpPromise ??= import('sharp').then(({ default: sharp }) => sharp).catch(() => {
+	throw new Error('Norna could not load Sharp for image processing. Run npm install --include=optional in the project to install the native image dependencies for this computer.');
+});
 
 const toPublicPath = (filePath) => filePath.split(path.sep).join('/');
 const getPublicPath = (filePath) => `/${toPublicPath(path.relative(astroPublicDir, filePath))}`;
@@ -86,7 +38,7 @@ const getSourceHashSlug = (sourceHash) => sourceHash.slice(0, sourceHashSlugLeng
 
 const getGeneratedPath = (sourceKey, sourceHash, width) => {
 	const parsed = path.parse(sourceKey.replace(/^root\//, ''));
-	return path.join(generatedImagesDir, parsed.dir, `${parsed.base}-${getSourceHashSlug(sourceHash)}-${width}.webp`);
+	return path.join(generatedImagesDir, parsed.dir, `${parsed.base}-${getSourceHashSlug(sourceHash)}-v${rasterOutputVersion}-${width}.webp`);
 };
 
 const getOriginalPath = (sourceKey, sourceHash) => {
@@ -212,15 +164,18 @@ const validateCarouselOrientations = async (manifest) => {
 	}
 };
 
-const identify = async (sourcePath, imageMagick) => {
-	const output = await imageMagick.identify(sourcePath);
-	const [width, height] = output.split(' ').map(Number);
-	return { width, height };
+const identify = async (sourcePath, sharp) => {
+	const { autoOrient: dimensions } = await sharp(sourcePath).metadata();
+	if (!dimensions || !Number.isSafeInteger(dimensions.width) || !Number.isSafeInteger(dimensions.height)
+		|| dimensions.width <= 0 || dimensions.height <= 0) throw new Error('The image has no usable dimensions.');
+	return dimensions;
 };
 
-const convert = async (sourcePath, outputPath, width, imageMagick) => {
+const convert = async (sourcePath, outputPath, width, sharp) => {
 	await mkdir(path.dirname(outputPath), { recursive: true });
-	await imageMagick.convert(sourcePath, outputPath, width);
+	// Sharp converts to sRGB and strips metadata by default.
+	await sharp(sourcePath).autoOrient().resize({ width, withoutEnlargement: true })
+		.webp({ quality: 82 }).toFile(outputPath);
 };
 
 const getHash = (value) => createHash('sha256').update(value).digest('hex');
@@ -275,7 +230,7 @@ const hasGeneratedVariants = async (variants) => {
 const getReusableEntry = async (sourceKey, previousEntry, sourceHash) => {
 	if (
 		previousEntry?.sourceHash !== sourceHash
-		|| previousEntry?.outputVersion !== imageOutputVersion
+		|| previousEntry?.outputVersion !== rasterOutputVersion
 		|| !Number.isFinite(previousEntry?.width)
 		|| !Number.isFinite(previousEntry?.height)
 	) {
@@ -289,7 +244,7 @@ const getReusableEntry = async (sourceKey, previousEntry, sourceHash) => {
 	}
 
 	return {
-		outputVersion: imageOutputVersion,
+		outputVersion: rasterOutputVersion,
 		sourceHash,
 		width: previousEntry.width,
 		height: previousEntry.height,
@@ -301,7 +256,7 @@ const getReusableStaticEntry = async (previousEntry, sourceHash, sourceKey) => {
 	if (
 		previousEntry?.kind !== 'static'
 		|| previousEntry?.sourceHash !== sourceHash
-		|| previousEntry?.outputVersion !== imageOutputVersion
+		|| previousEntry?.outputVersion !== staticOutputVersion
 		|| previousEntry?.src !== getPublicPath(getOriginalPath(sourceKey, sourceHash))
 		|| !(await fileExists(getFilePathFromPublicPath(previousEntry.src)))
 	) {
@@ -365,7 +320,6 @@ const main = async () => {
 	const sources = await getReferencedSources();
 	const manifest = {};
 	const isStaticSource = (sourcePath) => staticImageExtensions.has(path.extname(sourcePath).toLowerCase());
-	const isRasterSource = (sourcePath) => rasterImageExtensions.has(path.extname(sourcePath).toLowerCase());
 
 	if (sources.length === 0) {
 		await removeUnreferencedGeneratedFiles(manifest);
@@ -374,10 +328,6 @@ const main = async () => {
 		return;
 	}
 
-	const imageMagick = sources.some(({ sourcePath }) => isRasterSource(sourcePath))
-		? await getImageMagick()
-		: null;
-
 	for (const { sourcePath, sourceKey } of sources) {
 		const sourceHash = await getSourceHash(sourcePath);
 
@@ -396,7 +346,7 @@ const main = async () => {
 			const dimensions = await readImageDimensions(sourcePath).catch(() => null);
 			manifest[sourceKey] = {
 				kind: 'static',
-				outputVersion: imageOutputVersion,
+				outputVersion: staticOutputVersion,
 				sourceHash,
 				src: getPublicPath(outputPath),
 				...(dimensions ? { width: dimensions.width, height: dimensions.height } : {}),
@@ -411,20 +361,22 @@ const main = async () => {
 			continue;
 		}
 
-		if (!imageMagick) {
-			throw new Error(`ImageMagick is missing for raster image: ${sourcePath}`);
-		}
-
-		const dimensions = await identify(sourcePath, imageMagick);
-		const variantWidths = getVariantWidths(dimensions);
-		const variants = getVariants(sourceKey, sourceHash, variantWidths);
-		for (const width of variantWidths) {
-			const outputPath = getGeneratedPath(sourceKey, sourceHash, width);
-			await convert(sourcePath, outputPath, width, imageMagick);
+		const sharp = await getSharp();
+		let dimensions;
+		let variants;
+		try {
+			dimensions = await identify(sourcePath, sharp);
+			const variantWidths = getVariantWidths(dimensions);
+			variants = getVariants(sourceKey, sourceHash, variantWidths);
+			for (const width of variantWidths) {
+				await convert(sourcePath, getGeneratedPath(sourceKey, sourceHash, width), width, sharp);
+			}
+		} catch (error) {
+			throw new Error(`Cannot process image ${sourcePath}: ${error.message}`);
 		}
 
 		manifest[sourceKey] = {
-			outputVersion: imageOutputVersion,
+			outputVersion: rasterOutputVersion,
 			sourceHash,
 			width: dimensions.width,
 			height: dimensions.height,

package/scripts/lib/editor-source-files.mjs

@@ -7,6 +7,12 @@ import { checkedPath } from './editor-site-files.mjs';
 import { escapeMarkdownHeading } from './site-node-create.mjs';
 
 export const siteTreeEditingApiVersion = 1;
+const sourceFormatHeader = [
+	'# Norna increments this version for breaking changes to the site source format.',
+	'# Change it only as part of a documented format conversion.',
+	'sourceFormat: 2',
+	'',
+].join('\n');
 const stat = (filename) => lstat(filename).catch((error) => {
 	if (error.code === 'ENOENT') return null;
 	throw error;
@@ -54,7 +60,7 @@ export const planEditorSourceFileCreation = async ({ siteRoot, directory, filena
 	if (definition.input) {
 		if (typeof value !== 'string' || !value.trim() || /[\r\n]/.test(value)) throw new Error('Enter a non-empty, single line of text.');
 		text = definition.input === 'title' ? `# ${escapeMarkdownHeading(value.trim())}\n`
-			: `${definition.schemaKind === 'config' ? 'sourceFormat: 2\n' : ''}${definition.input}: ${JSON.stringify(value.trim())}\n`;
+			: `${definition.schemaKind === 'config' ? sourceFormatHeader : ''}${definition.input}: ${JSON.stringify(value.trim())}\n`;
 	}
 	if (definition.schema) parseYamlConfig(text, filename, { schema: definition.schema });
 	const identity = async (location) => { const entry = await stat(location); return entry ? [entry.dev, entry.ino] : null; };

package/scripts/lib/image-dimensions.mjs

@@ -1,73 +1,6 @@
 import { readFile } from 'node:fs/promises';
 import path from 'node:path';
 
-const pngSignature = Buffer.from([0x89, 0x50, 0x4e, 0x47, 0x0d, 0x0a, 0x1a, 0x0a]);
-const jpegStartOfFrameMarkers = new Set([
-	0xc0,
-	0xc1,
-	0xc2,
-	0xc3,
-	0xc5,
-	0xc6,
-	0xc7,
-	0xc9,
-	0xca,
-	0xcb,
-	0xcd,
-	0xce,
-	0xcf,
-]);
-
-const isPng = (buffer) => buffer.length >= 24 && buffer.subarray(0, 8).equals(pngSignature);
-
-const readPngDimensions = (buffer) => ({
-	width: buffer.readUInt32BE(16),
-	height: buffer.readUInt32BE(20),
-});
-
-const readJpegDimensions = (buffer) => {
-	if (buffer.length < 4 || buffer[0] !== 0xff || buffer[1] !== 0xd8) {
-		return null;
-	}
-
-	let offset = 2;
-
-	while (offset + 9 < buffer.length) {
-		while (buffer[offset] === 0xff) {
-			offset += 1;
-		}
-
-		const marker = buffer[offset];
-		offset += 1;
-
-		if (marker === 0xd9 || marker === 0xda) {
-			return null;
-		}
-
-		if (offset + 2 > buffer.length) {
-			return null;
-		}
-
-		const segmentLength = buffer.readUInt16BE(offset);
-		if (segmentLength < 2 || offset + segmentLength > buffer.length) {
-			return null;
-		}
-
-		if (jpegStartOfFrameMarkers.has(marker)) {
-			if (segmentLength < 7) return null;
-
-			return {
-				height: buffer.readUInt16BE(offset + 3),
-				width: buffer.readUInt16BE(offset + 5),
-			};
-		}
-
-		offset += segmentLength;
-	}
-
-	return null;
-};
-
 const parseSvgLength = (value) => {
 	const match = String(value ?? '').trim().match(/^(\d+(?:\.\d+)?|\.\d+)(?:px)?$/i);
 	return match ? Number(match[1]) : null;
@@ -96,9 +29,7 @@ export const readImageDimensions = async (filePath) => {
 		return readSvgDimensions(buffer.toString('utf8'));
 	}
 
-	if (isPng(buffer)) {
-		return readPngDimensions(buffer);
-	}
-
-	return readJpegDimensions(buffer);
+	const { default: sharp } = await import('sharp');
+	const { autoOrient } = await sharp(buffer).metadata();
+	return autoOrient ?? null;
 };

package/starters/basic/.github/workflows/deploy.yml

@@ -27,16 +27,13 @@ jobs:
           node-version: 24.18.0
           cache: npm
 
-      - name: Install image tools
-        run: sudo apt-get update && sudo apt-get install -y imagemagick
-
       - name: Restore generated images
         uses: actions/cache@v4
         with:
-          path: site/.norna/public/images/generated
-          key: norna-images-${{ hashFiles('site/.norna/generated-images.json') }}
+          path: site/.norna/public/_norna/images
+          key: norna-images-v4-${{ hashFiles('site/.norna/generated-images.json') }}
           restore-keys: |
-            norna-images-
+            norna-images-v4-
 
       - name: Install dependencies
         run: npm ci

package/starters/basic/README.md

@@ -9,6 +9,8 @@ npm install
 npm run norna:dev
 ```
 
+The npm installation includes image processing for JPEG and PNG files.
+
 Open the address printed by the development server. Stop it later with
 `npm run norna:dev:stop`.
 

package/starters/basic/site/site-config/settings.yaml

@@ -1,2 +1,4 @@
+# Norna increments this version for breaking changes to the site source format.
+# Change it only as part of a documented format conversion.
 sourceFormat: 2
 url: https://example.com/