Skip to content

chore: get rid of compiled dependencies#113

Merged
KuznetsovRoman merged 3 commits intomasterfrom
TESTPLANE-653.bin
Aug 18, 2025
Merged

chore: get rid of compiled dependencies#113
KuznetsovRoman merged 3 commits intomasterfrom
TESTPLANE-653.bin

Conversation

@KuznetsovRoman
Copy link
Member

No description provided.

README.md Outdated
[![Build Status](https://travis-ci.org/gemini-testing/looks-same.svg?branch=master)](https://travis-ci.org/gemini-testing/looks-same)

Node.js library for comparing images, taking into account human color
Pure node.js library for comparing images, taking into account human color
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We had this word 11 years ago:
image

3. Install dependencies:
```bash
npm ci
npm install
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Removed package-lock because otherwise we would need to update it every time when looks-same package.json is updated

Comment on lines +27 to +30
let rgbColor1 = {};
let rgbColor2 = {};
let labColor1 = {};
let labColor2 = {};
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Implemented rgb -> lab conversion cache
It only stores last previous conversion
Considering we usually web screenshots, next pixel in line is usually the same as previous one, so it gives significant performance boost

Comment on lines +40 to +44
if (areColorsSame({color1: data.color1, color2: rgbColor1})) {
lab1 = labColor1;
} else if (areColorsSame({color1: data.color1, color2: rgbColor2})) {
lab1 = labColor2;
}
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Checking for "expected" cache colours for "actual" image and vice versa helps with moved objects (like borders)

index.js Outdated

const highlightColor = options.highlightColor;
const resultBuffer = Buffer.alloc(width * height * 3);
const resultBuffer = Buffer.allocUnsafe(width * height * RGB_IMAGE_CHANNELS);
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"allocUnsafe", compared to "alloc", does not fill buffer with zeroes
Which is totally fine for us, because we fill the buffer ourselves

/**
* @type import('js-graph-algorithms')
*/
const jsgraphs = require('../vendor/jsgraphs.min.js');
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"jsgraphs" package ships large "third-party-libs" directory:

image

Comment on lines 74 to 76
async createBuffer(extension) {
return this._img.toFormat(extension).toBuffer();
if (extension === 'raw') {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

createBuffer: (extension: "png" | "raw") => Promise<Buffer>;

@KuznetsovRoman KuznetsovRoman force-pushed the TESTPLANE-653.bin branch 2 times, most recently from b7218bd to 17354cb Compare August 7, 2025 23:00
@KuznetsovRoman KuznetsovRoman force-pushed the TESTPLANE-653.bin branch 6 times, most recently from 301a0ee to 0890092 Compare August 14, 2025 09:10
this._width = width;
this._height = height;
this._channels = channels;
async init() {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"jsquash/png" decode result is a promise. Until it resolves, we can't get access to rbg bytes
"getPixel" is sync

Comment on lines -17 to -22
## Supported image formats

JPEG, PNG, WebP, GIF, AVIF, TIFF and SVG images are supported.

*Note: If you want to compare jpeg files, you may encounter random differences due to the jpeg structure if they are not lossless jpeg files.*

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Breaking change


const convertRgbaToScanlines = (rgba, width, height) => {
const stride = width * PNG.RGBA_CHANNELS;
const scanlines = Buffer.allocUnsafe(height * (1 + stride)); // extra byte for filter
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"allocUnsafe" is faster, because it does not fill the buffer with zeroes, leaving trash data
thats fine, because we fill it all the way
And thats safe, because we throw, if for some reason buffer wasn't rewritten fully (which would not happen)

return scanlines;
}

exports.convertRgbaToPng = (rgba, width, height, compressionLevel = COMPRESSION_LEVEL) => {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just formatting data to https://www.w3.org/TR/PNG-Chunks.html standards
8 bit rgba deflate png without filter or interlace

@KuznetsovRoman KuznetsovRoman force-pushed the TESTPLANE-653.bin branch 2 times, most recently from 3742126 to 68bc878 Compare August 14, 2025 09:51
"parse-color": "^1.0.0"
},
"devDependencies": {
"@eslint/js": "^8.57.1",
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

старый eslint ругался на динамический импорт

Copy link
Member

@DudaGod DudaGod left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🔥

if (pointer !== resultBuffer.byteLength) {
throw new Error("Got malformed input while trying to convert rgba to png");
}
return resultBuffer;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I didn't look at this piece of code carefully. I hope you did everything correctly according to the specification.

diffBuffer[diffBufferPos++] = diffColor.R;
diffBuffer[diffBufferPos++] = diffColor.G;
diffBuffer[diffBufferPos++] = diffColor.B;
diffBuffer[diffBufferPos++] = 0xff;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why we need to add alpha channel?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"eight-bit-rgba-to-png" only converts rgba to png, not rgb to png
I checked difference between rgba and rgb weight, and there is no result image size difference because of how deflate works: for a large image its like "9.5M RGBA" vs "9.4M RGB"

@KuznetsovRoman KuznetsovRoman merged commit fbd86df into master Aug 18, 2025
2 checks passed
@KuznetsovRoman KuznetsovRoman deleted the TESTPLANE-653.bin branch August 18, 2025 18:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants