Interface stutters on main window scroll

[phpony]

Hi everyone!

I'm trying to organize my Linux games collection with GameHub. Before this I've used the filesystem to organize everything - each game has it's folder in directory "Games" at my user's home. It has main binary + icon image + cover image (jpg or png 1000px wide or more). Like this:

/home/user/Games/Game1/game.sh
/home/user/Games/Game1/game_cover.png
/home/user/Games/Game1/game_icon.png
/home/user/Games/Game2/game.sh
/home/user/Games/Game2/game_cover.png
/home/user/Games/Game2/game_icon.png
/home/user/Games/Game3/game.sh
/home/user/Games/Game3/game_cover.png
/home/user/Games/Game3/game_icon.png

First I've tried Lutris but it doesn't have any tag or category management so then I've turned to GameHub. Everything started promising and was looking great, but the more games I've added - the worse it worked. Right now there's exact 100 games in my DB. I'm using "GOG 392x220" layout to display titles, and now every time I scroll the list - GameHub stutters and lags. New cards are appearing with stutter and are blank for first 5-6 seconds after appearing on screen.

The game cache folder is properly populated:

$ tree /home/user/.cache/com.github.tkashkin.gamehub
├── gamehub.db
├── graphics
│   └── games
│       └── user
│           ├── 01f8########6d98########5eda200e
│           │   ├── icons
│           │   │   └── bdbd########98de########e9a9c401.png
│           │   └── images
│           │       ├── 299c########769e########4cdb074d.png
│           │       └── fcea########0d7d########b9cb4e15.png
│           ├── 04d1########8ae3########2d339b2e
│           │   ├── icons
│           │   │   └── 446b########f2de########f8ace2a7.png
│           │   └── images
│           │       └── 4e7d########1bc6########4d5b4723.png
│           ├── 05e9########d4dd########4afaaaa0
│           │   ├── icons
│           │   │   └── 706e########a09e########02223ae8.png
│           │   └── images
│           │       └── 4090########723c########c5963aa6.webp
│           ├── 0935########1998########29f3d8b6
│           │   ├── icons
│           │   │   └── 5a1b########7c26########ecf7f8dc.png
│           │   └── images
│           │       └── 4c54########5c4c########df594f4a.png
│           ├── 0b45########c97d########ee43bdfb
│           │   ├── icons
│           │   │   ├── 1c1c########385a########2b8966dd.png
│           │   │   └── b684########5e1d########4d11623c.png
│           │   └── images
│           │       └── bf09########6ec3########fc50af89.png
│           ├── 1373########d7d1########0e13a017
│           │   ├── icons
│           │   │   └── 0519########279d########45011583.webp
│           │   └── images
│           │       ├── 8b3b########b4e5########c64981da.jpg
│           │       └── e6c2########e79e########4706b1bf.webp
...
│           ├── fb8a########3b75########d7e9ffef
│           │   ├── icons
│           │   │   └── 3754########c599########7ccffa01.png
│           │   └── images
│           │       ├── 2c92########fad8########46ca5036.jpg
│           │       └── a166########561c########82729052.png
│           └── ff5a########da60########d55c9c4b
│               ├── icons
│               │   └── 46d3########618e########442b2c40.png
│               └── images
│                   └── d635########f1d0########d6e57822.png
├── providers
│   └── steam
└── sources
    └── humble

It's size is:

# du -sh /home/user/.cache/com.github.tkashkin.gamehub/graphics
172M	graphics

My system has 32 physical CPU Cores, 64Gb of DDR4 RAM (49Gb free right now) and NVidia GPU with latest drivers. I'm using NVME as system disk with speeds like:

/dev/nvme0n1p1:
 Timing cached reads:   21836 MB in  1.98 seconds = 11005.63 MB/sec
 Timing buffered disk reads: 4006 MB in  3.00 seconds = 1334.79 MB/sec

I play OW2 with Proton/Wine having 120+ fps and have no stutters. But for some reason native GameHub can't smoothly scroll and display this simple 100 title cards with jpeg/png cover images. Something is wrong here.

What should I check in my system that can be the cause of stutter? Or is it a bug in software?

Expected behavior

Scroll should work smoothly.

Actual behavior

Scroll stutters and freezes. Covers are appearing with 5-6 sec delay.

Steps to reproduce

1. Add 100 games.
2. Set 100 covers.
3. Scroll.

Version and environment

[INFO]   - GameHub
[INFO]       Version: 0.16.3-0.16.3-0.16.3
[INFO]       Branch:  0.16.3
[INFO]       Commit:  0.16.3
[INFO]   - Environment
[INFO]       Distro:  Debian GNU/Linux 12 (bookworm)
[INFO]       DE:      XFCE
[INFO]       GTK:     3.24.37
[INFO]   - way overpowered CPU/RAM/Video/NVME disk for this task :)

[phpony]

So I've resized all images to my size with this command:

cd /home/user/.cache/com.github.tkashkin.gamehub/graphics
find . -iname "*.jpg" -print0 | xargs -I{} -0 mogrify  -resize 392x220^ -gravity center -extent 392x220 {}

And now scrolling is not stuttering, but covers are still not "instantly" shown. There's still a delay of 1-2 sec after them appear on screen.

Probably should try to replace this to always true and try to compile my very own build:

GameHub/src/ui/views/GamesView/list/GamesList.vala

Line 106 in 9327885

row.icon_is_visible = !is_before_viewport && !is_after_viewport;

[phpony]

Wrong file but yep. Changing this:

GameHub/src/ui/views/GamesView/grid/GamesGrid.vala

Line 95 in 9327885

card.image_is_visible = !is_before_viewport && !is_after_viewport;

To this:

card.image_is_visible =true;

Fixes everything. No stutters, fast scrolling. Probably a bit of memory eaten and first start is slow, but overall that's what I've wanted.

For my opinion, there's another "cache" folder required with properly resized images for current grid dimensions in it. Changing display settings should wipe this folder and re-create new thumbnails. And so there should be no icon_is_visible control at all and no image processing on each start/load/scroll event. Just simple "load from cache => draw all at once".

[phpony]

Combining code patch with approach:

find ~/.cache/com.github.tkashkin.gamehub/graphics/games/ -iwholename "*/images/*.jpg"  -print0 | xargs -I{} -0 mogrify  -resize 392x220^ -gravity center -extent 392x220 {}

made GameHub blazing fast. Fast start, smooth scroll. So probably caching of resized images and drawing all cards at once is a good idea.