Analyze images module

[gmetais]

Hello Maciej,

This is a submission from an optional phantomas module called analyze-image, inspired by analyze-css and already discussed in #819. It retrieves images loaded on the page and tries to:

• optimize them,
• resize them,
• switch them to WebP/AVIF,
• check if the sizes parameter is correct for responsive images

It also fixes the imageScaledDown metric, not working properly with picture elements.

This is a starting point, I wish this module evolves and gains new functionalities in the future (a CLI, detect HTML syntax errors, detect images loaded on the network but not attached on the page...).

The module is not yet submitted on npm, but will be soon. Would you like to share its governance with me?

(I have the same issue in this pull request as the other day, where some changes are marked as new in the diff but are already on your devel branch. Can't understand what I do wrong.)

[macbre]

(I have the same issue in this pull request as the other day, where some changes are marked as new in the diff but are already on your devel branch. Can't understand what I do wrong.)

Your fork's devel branch seems to be behind the one from this repository.

[macbre]

As you've mentioned in the PR description - let's either publish this package to npm (ideally) or at least pin the github dependency to a specific commit / tag.

[macbre]

To make CI pass please update the lock file:

npm ERR! `npm ci` can only install packages when your package.json and package-lock.json or npm-shrinkwrap.json are in sync. Please update your lock file with `npm install` before continuing.

[socket-security]

New dependencies detected. Learn more about Socket for GitHub ↗︎

Packages	Version	New capabilities	Transitives	Size	Publisher
analyze-image	1.0.0	network, filesystem, shell	+219	10.8 MB	gmetais

[macbre]

Thanks!

[macbre]

CI is failing with:

Error: Cannot find module 'analyze-image' from 'modules/analyzeImages/analyzeImages.js'

[macbre]

@gmetais - thanks for the PR.

Before merging his one, can you try updating the dependencies of the analyze-image and publish a new version of it? Snyk reports quite a few vulnerabilities there.

npm i prints out a few of them as well:

~/git/analyze-image$ npm i
npm WARN deprecated [email protected]: Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility
npm WARN deprecated [email protected]: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.

added 584 packages, and audited 585 packages in 27s

71 packages are looking for funding
  run `npm fund` for details

14 vulnerabilities (4 moderate, 10 high)

[gmetais]

I update all dependencies (I even switched analyze-image to an ESM) on that branch: https://github.com/gmetais/analyze-image/tree/esm

But I still got the 2 "deprecated" warnings, because of imagemin-svgo that was updated recently but not published on npm.
And I still got 12 of the 14 vulnerabilities, mostly because of imagemin-gifsicle that was not updated for 2 years.

Also (and unfortunately), it looks like phantomas would not be able to run Jest tests if analyze-image is loaded as an ESM module (see #1169 and nodejs/node#35889).

All in all, I'm not sure updating dependencies is such a good idea 😅

[macbre]

The fun with npm packages ...

I update all dependencies (I even switched analyze-image to an ESM) on that branch: https://github.com/gmetais/analyze-image/tree/esm

But I still got the 2 "deprecated" warnings, because of imagemin-svgo that was updated recently but not published on npm.
And I still got 12 of the 14 vulnerabilities, mostly because of imagemin-gifsicle that was not updated for 2 years.

Can we at least have some dependencies updated (and hence some warnings fixed)? If not, then I'm fine with merging this PR 🙂

[gmetais]

I'm kind of stuck. The reason I didn't use the latest versions for some packages was because they became ES modules at some point. I tried to import() them dynamically, but it was adding to much complexity to the code. So I rewrote entirely my analyze-image module to an ES module.

It is working fine as long as I don't use Jest. Unfortunately, it triggers the segmentation fault when launching the tests.

So either we keep some packages not updated, either we don't test the analyze-image module. What do you prefer?

(For your information, it looks like the segmentation fault will be fixed soon in NodeJS v20: nodejs/node#35889 (comment))

[macbre]

So either we keep some packages not updated, either we don't test the analyze-image module. What do you prefer?

Thanks for providing more context here! Well, it seems we are kind of forced to use the outdated versions then...