Images in 10.0.5 are not showing in safari(on every other device!)

[royjosefsson]

What version of Next.js are you using?

10.0.5

What version of Node.js are you using?

14.15.4

What browser are you using?

Safari

What operating system are you using?

Linux Ubuntu 20.04

How are you deploying your application?

npm run build && pm2 start server.js --node-args="--max-old-space-size=4096""

Describe the Bug

Optimized images are not showing. It's different from device to device.

(I'm not sure the issue is because the images are inside a 'next/link', no?)

Some devices are showing all images
Some devices are only showing pngs, jpeg, jpg and not svgs.
Some devices are not showing any images what so ever.

Expected Behavior

Images to be displayed

To Reproduce

Create an image using 'next/image

Here are some logs from an iMac:

Images on an iPhone:(some are showing?)

A mac, working just fine:

The site works flawlessly on pc and android.

[royjosefsson]

Site: https://jiroy.com

I've found the issue.
The issue is that:
Safari 3.1 - 13.1 and iOS Safari 3.2 - 13.7 isn't compatible with webp.
https://caniuse.com/webp

"next/image" optimizes images to webp on runtime(if the browser supports it*).
The reason why an uncompatible iOS device even is trying to show a webp-image remains unclear.

I'm going to try and disable webp for now, or optimize the images in a different way

Edit: This is a duplicate of this link

[jaddoescad]

Have you been able to find a quick fix?

[styfle]

This has been fixed in #35190

Please give it a try with npm i next@canary or yarn add next@canary, thanks!