Image optimisation not working with Next 9.1

I import an image like so:

import screenshot1 from '../../public/static/screenshots/screenshot-1.png?resize&sizes[]=375&sizes[]=750&sizes[]=1080&sizes[]=2160'

My config is:

[
      withOptimizedImages,
      {
        handleImages: ['jpeg', 'png', 'webp', 'gif'],
        optimizeImages: true,
        optimizeImagesInDev: true,
        responsiveLoader: {
          adapter: require('responsive-loader/sharp')
        },
        mozjpeg: {
          quality: 90
        },
        optipng: {
          optimizationLevel: 5
        }
      }
    ],

The ?resize does it’s job, it outputs images for each required size. But imagemin-optipng (which is installed) is definitely not applying any optimisations since the build finishes quickly. If I run optipng manually it takes several minutes and reduces sizes of the images.

If I log JSON.stringify(_arguments) in imagemin-optipng/index.js I see this logged twice, althought I have dozens of images:

["-strip","all","-clobber","-o",5,"-out",null,"-fix",null]

I don’t know if those nulls are just how exec-buffer is meant to work, or if that’s another issue.

[cyrilwanner]

Additional question, will this new version allow to optimise images stored in a CMS/API? (on-the-fly optimisations)?

Yes, remote image optimization is one of the new features planned. It isn’t already in the current canary version but will be in an upcoming one.

I was having the same issue with next@9.4.4. Just tested with v3.0.0-canary.0 (release) and it seems to be solved.

yarn add next-optimized-images@^3.0.0-canary.0

Yes, the canary version should already work and I just published a new one with support for styled-components. So far, it seems to be stable so as soon as I have implemented all missing features from the current version, I’ll release it on the non-canary tag.

[cyrilwanner]

Is this library still maintained?

Yes, there have been even some patches to make it work with the newest next versions and I use it without any problems in my own projects. Additionally, over the last few weeks, I’ve put my focus into the next major version of this plugin which will not only solve all open issues but also provide many new features and makes it a lot easier to install and use images within nextjs. It is almost finished and a first canary version will be released within the next few days. The upcoming version is split across multiple modular packages, so it is also possible to use it outside of a nextjs project (while still providing a next.js plugin of course). This is also why you don’t see much going on in this repository currently.

@cyrilwanner Are you aware of this issue? Is there any way we could help?

No, I didn’t encounter this in my own projects. And as I also have some university exams coming up over the next two weeks, I didn’t have much time recently to dig much deeper into this or other issues. And the little time I had, I’ve put into the next major version which will also resolve this issue as it is a complete rewrite.

But I would of course still happily accept pull requests (as I’ve also done over the last few weeks) if someone else wants to look into it.