Share Posted January 25 Hi, I'm currently trying to build a little portfolio page with React + GSAP + ScrollTrigger. One of the ideas I've had is quite simple (It might sound nonsensical but I am planning to imitate a Buffer Overflow where the inserted text is quite commonly just a lot of A's): When the user scrolls down, A's are added to my name until I reach the edge of the screen. I then plan to proceed from there but I've not gotten any further. I've implemented the functionality as best as I knew how, however, when I launch and load the webpage, it takes quite a while until it finishes loading, with Firefox even warning me that the page is slowing down my browser. I can't help but think that this is related to the amount of ScrollTriggers I'm using (about 125~ on my monitor) and I'm wondering if I'm just doing it in a very inefficient way. I'm quite new to both react and gsap so any pointers would be appreciated. Thank you for your help. Here is the stackblitz (You might have to edit the code by inserting a variable on a random line [let a = 'a'] to get stackblitz to refresh if it only shows you one trigger. You can also force it by changing overflowCounter on line 106 to, say, 200.): https://stackblitz.com/edit/react-5jrzb7?file=src/App.js Link to comment Share on other sites More sharing options...
Solution Solution Share Posted January 25 Fun idea! But yeah, definitely not the right approach here. Good attempt but that's a lot of markers! So I would maybe do something like this? We even have textPlugin to make this kind of thing nice and easy See the Pen ExpLVzB?editors=1010 by GreenSock (@GreenSock) on CodePen 2 Link to comment Share on other sites More sharing options...
Author Share Posted January 25 About an hour after posting this, it dawned on me that I was more than likely going about this in a very convoluted way. Your solution is brilliant, simple, and elegant. I'm sure I can make this work with some fiddling. Thank you so much, this is exactly what I'm looking for! 2 Link to comment Share on other sites More sharing options...
Share Posted January 25 Ah, bless you. That's very sweet of you! Glad I could help. 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