Sergio1981

I have now removed a backdrop filter and added will-change: transform to the css for the relevant elements. Now the page also runs smoothly on my notebook. Many THANKS

Hello Jack, THANK YOU for your help. I will try this and give you feedback. Maybe this will help others too. Regarding GSAP performance: I am sure that GSAP is the best platform for web animations. And you do an incredibly good job.

Hello, I have a question about scroll smoother. I am currently using it for a new project on my local host. On my computer the site works very well and there is nothing to complain about. Now I have put the project on my notebook to present it next week. I noticed that my notebook obviously has problems displaying scroll smoother smoothly. The RTX2060 graphics card is running at about 50% when I scroll the page. I partly use data-lag, pinned elements and a smooth effect with 1 second of lag. Making a codepen demo is almost pointless, as it won't reflect the project. But is there a trick so that it also works on slower computers? I think that if it doesn't run smoothly on a notebook, it won't run at all on a smartphone. I also can't imagine that scroll smoother was designed to only run on fast computers. So are there things to consider? I would also like to add that I do not use any CSS transforms. I am very grateful for any kind of support.

Hello and thank you for your comments. I am aware of the problems with analyses without a demo. Creating a minimal demo that reflects the project is not really easy and would take some time. I just thought that there might be known mistakes that can cause such problems. I'll try it step by step on my system and if I don't get it right, I'll get back to you. Kind regards and THANK YOU ? Sergio

I am using the text plug in on a page and have poor site speed performance as a result. It also jerks on some devices. When I deactivate the text effect, I have 99% in the Lighthouse Speed Test, and 29% when it is activated. Is there a better way to avoid such an effect? Here is the code for the effect: gsap.registerPlugin(ScrollTrigger, SplitText); console.clear(); select = e => document.querySelector(e); selectAll = e => document.querySelectorAll(e); const captions = selectAll(".text-container"); captions.forEach((caption, i) => { var splitTextTitle = new SplitText(caption.querySelector(".text-fx"), {type:"chars, words"}), lettersTitle = splitTextTitle.chars; let tl = gsap.timeline({ scrollTrigger: { trigger: caption, toggleActions: "play reset play reset", } }); tl.from(lettersTitle, { opacity:0, yPercent:-100, ease:"power2", duration: 0.2, stagger: { each: 0.005, } }); }); If someone has a suggestion, I would be very happy. Thanks a lot