Zoom performance issues from iOS 16 onwards

[pavodev]

Hello,

I'm developing an interactive graph and I noticed that it has really bad performance on iPhones since the iOS 16 update. The lag is a lot more noticeable when the graph is zoomed in and I try to pan the group, did anyone notice any performance issues related to zoom/pan on the latest iOS versions?

You can check out my web app on this https://course-glancer.netlify.app/glancer/square
If you try the same web app on an android phone (i tried it on a Google Pixel 4), you will notice that the zoom/pan actions are butter smooth.

[Fil]

Thanks for the report. It would be helpful to isolate the issue a bit more—your app has a lot of code. Do you see the same performance issue on the examples available at https://observablehq.com/collection/@d3/d3-zoom, for instance?

[pavodev]

Hi,

Thanks for the quick reply!
I tried the examples and everything runs smooth, the only difference I see is that my elements are filled with an image by using fill: url(#imageid) (the image is an .svg inside a defs element defined like this: <defs><pattern><image xlink:href="https://domain/image.svg"></image></pattern></defs>).

I tried to replace the image fillings with color fillings and the app runs smoothly again. The strange thing is that this wasn't an issue in iOS 15 as the app was running perfectly fine with image fillings...
Do you have any advice on this?

[Fil]

Sorry, I don't know. What I would try is to put the defs in a separate svg element, but I have not tested and maybe it wouldn't change anything.