| 316 | const entities = getEntitiesList({ doFilter: false }); | 316 | const entities = getEntitiesList({ doFilter: false }); |
| 317 | const container = $('#right-nav-panel .hotswap'); | 317 | const container = $('#right-nav-panel .hotswap'); |
| 318 | | 318 | |
| 319 | const favs = entities.filter(x => x.item.fav || x.item.fav == 'true').slice(0, 25); | 319 | // Hard limit is required because even if all hotswaps don't fit the screen, their images would still be loaded |
| | 320 | // 25 is roughly calculated as the maximum number of favs that can fit an ultrawide monitor with the default theme |
| | 321 | const FAVS_LIMIT = 25; |
| | 322 | const favs = entities.filter(x => x.item.fav || x.item.fav == 'true').slice(0, FAVS_LIMIT); |
| 320 | | 323 | |
| 321 | //helpful instruction message if no characters are favorited | 324 | //helpful instruction message if no characters are favorited |
| 322 | if (favs.length == 0) { | 325 | if (favs.length == 0) { |