Very choppy parallax/scrolling in Safari

Hi,

The site I’m currently developing uses one page navigation and lower layer parallax effects. When viewing in Safari the effect is very choppy and jumpy. Any idea why this is happening?

Hey Michael,

The page is heavy on animations. You have a slider (Slider Revolution), parallax and the slow One Page Navigation custom code.

The choppiness might be alleviated if you speed up the one page navigation smooth scrolling. Try reducing 1000 in the code to 200.

If that doesn’t help, use the code provided here which is the original smooth scroll script of our theme.

-----------------------------------------------------------------------------------

Please also try removing Slider Revolutin from your page to see if it affects the lag. If it does, try the Lazy Load options of Slider Revolution. Edit your slide and open the Performance and SEO Optimization tab.

Thanks.

Hey @christian_y,

Thank you for your helpful reply.

I have tried each of your suggestions in turn, and unfortunately none of them makes any significant difference to the lag in Safari. Your point that the page is animation-heavy is a reasonable theory, except once you take into account that this does not happen at all in Chrome.

Adding the original smooth scroll script maybe helped a tiny bit, but as Safari does not have the problem with one page navigation in any case, for testing purposes I tried it without any smooth scroll script, and with the slider removed. Again, the difference was negligible, barely noticeable really.

Either way, I would really like to use the original smooth scroll script in order to fix the Chrome one page navigation issue, but unfortunately it causes other issues as discussed in another thread.

So the Safari lag issue remains unresolved, and bearing in mind it doesn’t happen in Chrome, I’m not sure the parallax animations are really the cause. I have found it to be present on other X sites using the parallax effect too, so it seems to be a fairly ubiquitous problem.

Any other suggestions would be gratefully received.

Hey Michael,

Though Chrome and Safari use the same engine, it doesn’t mean that they render everything the same. With that said, I saved your page as a template and loaded it up on a test page and turned off the parallax and removed the slider. The result is, it’s still choppy but I noticed the choppiness only happens at the beginning. When everything is loaded up, everything is smooth.

I suspect this has something to do with Safari itself. Smooth scroll is choppy in my test site too and so does other one page websites even not using our theme.

There’s nothing we can do regretfully.

Hey @christian_y

Thank you for testing and trying to resolve this.

I think you’re right, looks more like a Safari problem than anything else. Btw it looks fine on Safari mobile.

Is there a way I can disable the lower layer parallax effect in Safari only using css?

Hey Michael,

No. The Parallax is powered by Javascript.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.