Lagging "Gallery" about musabhassan.com

[Musab-Hassan]

Is the musabhassan.com scroller laggy or is your implementation of the work scroller laggy?

If its your implementation, you can try a few of the things that I used within the work component class that increase performance.

The gallery scroller is broken into two parts both of which work independently from one another, the interactive scroller and the three.js effects. The three.js effects will lag on lower end hardware since they are 3d WebGL effects, I just ignored lag entirely by just disabling the three.js effects on lower end hardware using a library called detect-gpu.

Here's the code snippet I used, its in the sections/work.svelte file.

...
// Only enable ThreeJS warping effect if device can handle it
if (gpuTier.tier >= 2 && !gpuTier.isMobile && gpuTier.fps >= 30) new ImageRenderer(container, images);
...

you can also reduce your mesh geometry, lower geometry will make your effect less "warpy" but will increase performance. You can find the geometry definition in effects/defaults/image-mesh.ts.

...
this.geometry = new THREE.PlaneBufferGeometry(1, 1, 4, 6);
...

I can help you out more if you share the specific part that's lagging, your hardware details, and what your doing to fix it.

[Strg-Felix]

Thx for your quick response. Really appreciate your help, very kind of you Musab. It´s my implementation of the gallery section that makes the whole thing laggy. My guess is that the reason for that is that the layout of the gallery is calculated "on the fly". I tried out different thinks like preloading but either my implemention for that was wrong or it seems to be useless. Also I reduced the resolution of my images (now 1-3MB). I`m not a programmer myself so I got some issues with that kind of troubleshooting. Attached you can find my code for the work section. Feel free to correct me for my coding haha
work.txt

[Musab-Hassan]

You don't seem to have modified much here, it looks fine. Try compressing your images and modifying the geometry. Other than that, I cant really help much if you cant troubleshoot it further.