Welcome to! Click one of these buttons to join in on the fun.

IssueOversized images not being resized in thread listing

seanrseanr1173 Brooklyn, NYPosts: 619Member

The image in this screenshot is being displayed at 240x135 by the
.IndexImage img
style, but the file is actually being served at its original size of 16522x6190. This is complete futzing up the scrolling on that thread list page. Images should always be resized on the server side - CSS resizing just tells the browser to cram all those pixels together into the smaller space, causing performance issues like this one, as well as bandwidth issues.

I'm not familiar with Vanilla Forums, but Drupal uses a concept called Image Styles that allows you to specify how images are resized/cropped (and more) to fit the various places in which they are to be displayed. When you hit a page like the thread index, it'll look for the resized copy of the image in question and if it doesn't exist, will create the variant from the original and cache it on the server.

Fixing this will make life easier on users, but it'll also save on hosting bandwidth costs.


  • GuerrillaGuerrilla797 HelsinkiPosts: 2,868Administrator
    Yeah, the thread thumbnails are not a particularly elegant solution. They just grab the first image they find and serve it on the index. This is good because it doesn't matter whether the image is attached or linked, and is pretty intuitive to users, but obviously, if someone decides to post a massive image for some reason it'll mess with everyone's page loads.

    I can put in limits for image upload sizes (and probably should at some point to be honest), but that won't really make a difference with externally hosted images like the one in the example. Server side resizing is not something that's available in Vanilla (at least in the Open Source one), and implementing one is probably not a trivial task. Also, the image in question is hosted elsewhere, so nothing we do server side will do much, but I'll see if there is some validation I can do for thumbnail generation for the index.

    For what it's worth, I removed image tags from the post, so it shouldn't mess up the user experience, if you stay out of the thread.
    Comco: i entered it manually in the back end
    Join our fancy Discord Server!
  • GuerrillaGuerrilla797 HelsinkiPosts: 2,868Administrator
    Ok I take some of that back. I actually managed to cook up a solution for resizing attached thumbnails through a fancy CDN built for that sort of thing. All thumbnails that are attachments get resized to 240x135 on the index as of about 3 minutes ago. Original images in threads are still served as is, but I'll probably implement a 4K limit at some point in the near future.

    This doesn't really solve your particular issue, since it was a hotlinked image, but the index should be a lot easier on the bandwidth now, since I think most people use attachments.
    Comco: i entered it manually in the back end
    Join our fancy Discord Server!
Sign In or Register to comment.