Poylar Posted October 30, 2022 Share Posted October 30, 2022 hi. i used smooth scroll plugin from gsap. For some reason, my wordpress site plays smooth scrolling at 10-25 fps. As I understand it happens on less powerful computers. I have the most common setup for scrolling and there are also several swiper sliders on the page. When I remove all the sliders, the lags disappear. Are there any known conflicts between sliders and smooth scrolling? I can't share the codepen or anything with you as this is my personal site. But on other sites (more complex in structure. But there are fewer sliders) everything works fine. Link to the site: http://poylar.ru/ (Caution Cyrillic) you can also enter in admin panel to watch src files http://poylar.ru/wp-admin/ gsap : gsap (if you want check http://poylar.ru/wp-admin/theme-editor.php all js files in src/js ) Link to comment Share on other sites More sharing options...
Cassie Posted October 30, 2022 Share Posted October 30, 2022 Hi there! Performance is an incredibly deep and complex topic and I'm afraid we can't offer free performance consultations here. You're welcome to contact us directly for custom consulting. If that's not an option, some tips. Remove code bit by bit until you find the source of the problem (Sounds like you've nailed it down to the sliders) Are the sliders animating anything other than transforms and opacity? If so, refactor them to only animate using transforms and opacity (these are the most performant properties to animate) Are the images in the slider too large? If so reduce the size of them Are there any error messages to look into? At the end of the day, the more animation and more code and more images you have, the more a browser will struggle. So sometimes the answer is simply just 'do less' Hope this helps! 1 Link to comment Share on other sites More sharing options...
Poylar Posted October 30, 2022 Author Share Posted October 30, 2022 5 minutes ago, Cassie said: Hi there! Performance is an incredibly deep and complex topic and I'm afraid we can't offer free performance consultations here. You're welcome to contact us directly for custom consulting - Our rate is $250/hour with a 4-hour minimum. If that's not an option, some tips. Remove code bit by bit until you find the source of the problem (Sounds like you've nailed it down to the sliders) Are the sliders animating anything other than transforms and opacity? If so, refactor them to only animate using transforms and opacity (these are the most performant properties to animate) Are the images in the slider too large? If so reduce the size of them Are there any error messages to look into? At the end of the day, the more animation and more code and more images you have, the more a browser will struggle. So sometimes the answer is simply just 'do less' Hope this helps! thank you for you answer. yes I understand that this problem is probably beyond the free help on the forums, just came for advice to perhaps understand what I'm missing. I have already followed all your recommendations and the scroll stops lagging the more I remove the sliders. I thought maybe there is a solution something like: "set the overflow to hidden because without it some extra calculations occur" and so on Link to comment Share on other sites More sharing options...
Seré Breve Posted November 24, 2022 Share Posted November 24, 2022 Try removing or changing the name of the style.min.css file located in wp-includes/css/dist/block-library/ It was adding a huge amount of styles that in some way were slowing gsap scroll, I guess it's because scrollsmoother is built in native css scroll. It solved my problem, I hope yours too! 1 2 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now