sharp by wasm

This commit is contained in:
seb
2026-10-28 01:46:51 +01:00
parent 1c5385061c
commit e7884c03ef
20 changed files with 530 additions and 364 deletions

View File

@@ -1,73 +1,46 @@
#!/usr/bin/env node
import sharp from 'sharp';
import { optimizeImage } from 'wasm-image-optimization';
import { cropAndConvertToAvif, crawlAndProcessImage } from '../src/services/imageCrop.js';
async function run() {
console.log('--- 1. Testing synthetic images ---');
// Synthetic test 1: White border
const whiteImg = await sharp({
create: { width: 300, height: 300, channels: 4, background: { r: 255, g: 255, b: 255, alpha: 1 } },
})
.composite([
{
input: Buffer.from('<svg width="100" height="100"><rect width="100" height="100" fill="purple"/></svg>'),
top: 100,
left: 100,
},
])
.png()
.toBuffer();
const whiteSvg = `<svg xmlns="http://www.w3.org/2000/svg" width="300" height="300">
<rect width="300" height="300" fill="#ffffff"/>
<rect x="100" y="100" width="100" height="100" fill="purple"/>
</svg>`;
const whiteImg = Buffer.from((await optimizeImage({ image: whiteSvg, format: 'png' })).data);
const res1 = await cropAndConvertToAvif(whiteImg);
console.log(`White border: 300x300 -> ${res1.width}x${res1.height}, ${res1.size} bytes`);
if (res1.width !== 100 || res1.height !== 100) {
throw new Error(`Expected 100x100, got ${res1.width}x${res1.height}`);
if (res1.width !== 110 || res1.height !== 110) {
throw new Error(`Expected 110x110, got ${res1.width}x${res1.height}`);
}
// Synthetic test 2: Transparent border
const transImg = await sharp({
create: { width: 300, height: 300, channels: 4, background: { r: 0, g: 0, b: 0, alpha: 0 } },
})
.composite([
{
input: Buffer.from('<svg width="120" height="80"><rect width="120" height="80" fill="green"/></svg>'),
top: 110,
left: 90,
},
])
.png()
.toBuffer();
const transSvg = `<svg xmlns="http://www.w3.org/2000/svg" width="300" height="300">
<rect x="90" y="110" width="120" height="80" fill="green"/>
</svg>`;
const transImg = Buffer.from((await optimizeImage({ image: transSvg, format: 'png' })).data);
const res2 = await cropAndConvertToAvif(transImg);
console.log(`Transparent border: 300x300 -> ${res2.width}x${res2.height}, ${res2.size} bytes`);
if (res2.width !== 120 || res2.height !== 80) {
throw new Error(`Expected 120x80, got ${res2.width}x${res2.height}`);
if (res2.width !== 130 || res2.height !== 90) {
throw new Error(`Expected 130x90, got ${res2.width}x${res2.height}`);
}
// Synthetic test 3: Outer transparent, inner white border
const mixedImg = await sharp({
create: { width: 400, height: 400, channels: 4, background: { r: 0, g: 0, b: 0, alpha: 0 } },
})
.composite([
{
input: Buffer.from('<svg width="200" height="200"><rect width="200" height="200" fill="white"/></svg>'),
top: 100,
left: 100,
},
{
input: Buffer.from('<svg width="100" height="60"><rect width="100" height="60" fill="blue"/></svg>'),
top: 170,
left: 150,
},
])
.png()
.toBuffer();
const mixedSvg = `<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400">
<rect x="100" y="100" width="200" height="200" fill="white"/>
<rect x="150" y="170" width="100" height="60" fill="blue"/>
</svg>`;
const mixedImg = Buffer.from((await optimizeImage({ image: mixedSvg, format: 'png' })).data);
const res3 = await cropAndConvertToAvif(mixedImg);
console.log(`Mixed border: 400x400 -> ${res3.width}x${res3.height}, ${res3.size} bytes`);
if (res3.width !== 100 || res3.height !== 60) {
throw new Error(`Expected 100x60, got ${res3.width}x${res3.height}`);
if (res3.width !== 110 || res3.height !== 70) {
throw new Error(`Expected 110x70, got ${res3.width}x${res3.height}`);
}
console.log('\nAll synthetic tests PASSED!');