hm-tam Posted March 1, 2022 Share Posted March 1, 2022 I have several scrolltrigger image sequences on a page that I'm trying to optimize for faster load times, I've provided a link to one of them in a codepen. It's been a while, but I used one of the codes listed somewhere in these forums, so kudos to the person who made it. However, I am running into an issue with load time, it seems to load all the images at once therefore increasing the amount of requests. I'm just trying to see if anyone here might know how to make this code a little more performant like only show/hide the images when scrubbing through. I would appreciate any of your help. Thanks See the Pen yLPQomV by tampham (@tampham) on CodePen Link to comment Share on other sites More sharing options...
OSUblake Posted March 1, 2022 Share Posted March 1, 2022 Welcome to the forums @hm-tam Loading on demand wouldn't work well because of course it takes time to load, so you'd have a bunch of blank frames, at least initially. The images aren't loaded as part of the initial page load, so I don't see why it would be much of an issue. Apple uses this effect all over their site. Check out the Network tab here. https://www.apple.com/airpods-pro/ If you want a smaller size, you can try scrubbing a video instead. Link to comment Share on other sites More sharing options...
Solution hm-tam Posted March 1, 2022 Author Solution Share Posted March 1, 2022 Thanks for the quick response, that makes sense, I guess I'll stick to what I have then. I ran a test for the Airpods product page and after seeing the results, I feel a lot better. holmesmillet.dev https://gtmetrix.com/reports/holmesmillet.dev/CRZa3oh4/ Apple Airpods results https://gtmetrix.com/reports/www.apple.com/g2xhC9J3/ 1 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