Images look different when using toFile

[meyraa]

Possible bug

Is this a possible bug in a feature of sharp, unrelated to installation?

• Running npm install sharp completes without error.
• Running node -e "require('sharp')" completes without error.

If you cannot confirm both of these, please open an installation issue instead.

Are you using the latest version of sharp?

• I am using the latest version of sharp as reported by npm view sharp dist-tags.latest.

If you cannot confirm this, please upgrade to the latest version and try again before opening an issue.

If you are using another package which depends on a version of sharp that is not the latest, please open an issue against that package instead.

What is the output of running npx envinfo --binaries --system --npmPackages=sharp --npmGlobalPackages=sharp?

I run the code sample below on my Notebook. However, it also happens on the server. I also tested this with the sharp v0.34.0-rc.0

  System:
    OS: Linux 6.8 Ubuntu 24.04.2 LTS 24.04.2 LTS (Noble Numbat)
    CPU: (16) x64 AMD Ryzen 9 PRO 7940HS w/ Radeon 780M Graphics
    Memory: 14.80 GB / 60.61 GB
    Container: Yes
    Shell: 5.9 - /usr/bin/zsh
  Binaries:
    Node: 20.19.0 - ~/.nvm/versions/node/v20.19.0/bin/node
    npm: 10.8.2 - ~/.nvm/versions/node/v20.19.0/bin/npm
  npmPackages:
    sharp: ^0.33.5 => 0.33.5 

Does this problem relate to file caching?

The default behaviour of libvips is to cache input files, which can lead to EBUSY or EPERM errors on Windows.
Use sharp.cache(false) to switch this feature off.

• Adding sharp.cache(false) does not fix this problem.

What are the steps to reproduce?

The images look different, if you're using .toFile to save the image and stream it later or if you're directly returning the sharp object back as a response. You can test this by writing the file with fs.promises.writeFile instead of .toFile.

1. Creating a sharp object with composite
2. Saving it with .toFile and with fs.promises.writeFile
3. The images look different

Changing "effort" or input types (buffer or file path) did not prevent this issue. The only difference is using .toFile vs fs.promises.writeFile.

What is the expected behaviour?

There should be no differences between the two images.

Please provide a minimal, standalone code sample, without other dependencies, that demonstrates this problem

const sharpOptions: Create = {
    width: 512,
    height: 512,
    channels: 4,
    background: { r: 255, g: 255, b: 255, alpha: 0 },
};
const overlay = { input: "/your_dir/source_image.png" }; // same issue if you use buffer here instead

// Case: fs.promises.writeFile
const image = sharp({ create: sharpOptions }).png({ effort: 4 }).composite([overlay]);
await fs.promises.writeFile("/your_dir/image_fsWriteFile.png", image);

// Case: sharp.toFile
await sharp({ create: sharpOptions }).png({ effort: 4 }).composite([overlay]).toFile("/your_dir/image_toFile.png");

Please provide sample image(s) that help explain this problem

source_image.png

image_fsWriteFile.png

image_toFile.png

Comparison

[lovell]

Hello, I'm unable to reproduce this using the sample image and code (with the following correction) provided.

- const image = sharp({ create: sharpOptions }).png({ effort: 4 }).composite([overlay]);
+ const image = await sharp({ create: sharpOptions }).png({ effort: 4 }).composite([overlay]).toBuffer();

If you're still having problems, please can you create a complete, standalone repo that allows someone else to reproduce.