I need help with AVIF files on iOS 16 Safari

Read time in minutes: 1

hero image happy-fireworks-pagodas — Image generated by Waifu Diffusion v1.2 -- a beautiful landscape, studio ghibli, hatsune miku, fuji-san, cherry blossoms, pagoda, bubble tea, happy fireworks, ornate composition, matte painting

Hey there. I'm having some problems with AVIF files on iOS 16. If you're reading this from an iPhone running iOS 16 you may see the problem.

I recently started using a new program called uploud to automate converting and uploading things like my hero images and slides to Backblaze B2, my storage provider. However, images that I make with github.com/Kagami/go-avif won't load on iOS 16 Safari. Here are the encoding settings I am using:

&avif.Options{
	Threads: runtime.GOMAXPROCS(0),
	Speed:   0,
	Quality: 48,
}

This creates images that can be viewed in Chrome:

But not on iOS 16:

What am I doing wrong? I get no useful debug information from the browser inspector on Safari. It just says the image is wrong but won't tell me why.

Please contact me if you have any ideas.

This article was posted on M09 13 2022. Facts and circumstances may have changed since publication. Please contact me before jumping to conclusions if something seems wrong or unclear.