Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Resize images #876

Draft
wants to merge 2 commits into
base: develop
Choose a base branch
from
Draft

Resize images #876

wants to merge 2 commits into from

Conversation

Taeir
Copy link
Contributor

@Taeir Taeir commented Sep 3, 2022

Images were not being resized, even when displayed as tiny 40x40 squares. For codidact, the image size limit is 2 MB which somewhat alleviates this problem, but for our self hosted instance we upped max image size to 10 MB for posts (which also affects avatars). As a result, if someone uploads a 6 MB avatar, any page which displays it loads the 6 MB giant avatar and then the browser has to scale it down to display it as a tiny image. This causes huge load times and server traffic for pages like the users overview.

In this PR, images are resized by ActiveStorage to the size matching the requested size (without altering aspect ratio). These resized images are created once when requested and are then cached on the storage provider (in your case, Amazon AWS) and not resized again.

As a bonus, images are also upscaled to the requested size if they are smaller, which should resolve #462 and ensure equal image size for all users.

Finally, the profile page would not maintain aspect ratio of the image (in contrast to all other locations which display the avatar). This is fixed in 879040d.

Fixes #462
Fixes #1133

@Taeir
Copy link
Contributor Author

Taeir commented Sep 3, 2022

I just noticed that this does no longer go through the upload_remote_url endpoint, which does some transformation on the s3 bucket. The main question is if this method is necessary at all.

@Taeir Taeir marked this pull request as draft September 3, 2022 08:46
# Specify cookies SameSite protection level: either :none, :lax, or :strict.
#
# This change is not backwards compatible with earlier Rails versions.
Rails.application.config.action_dispatch.cookies_same_site_protection = nil

Check notice

Code scanning

Weak cookie configuration

Unsetting 'SameSite' can disable same-site cookie restrictions in some browsers.
@ArtOfCode-
Copy link
Member

Looks good to merge once #854 is in.

Rather than serving potentially really big avatars, resize them to fit
in the indicated avatar size.
@MoshiKoi
Copy link
Member

MoshiKoi commented Dec 26, 2022

Looks good to merge once #854 is in.

#854 has been merged; are we waiting on anything else or is this ready? (I see this is still a draft)

@Taeir
Copy link
Contributor Author

Taeir commented Jan 3, 2023

Looks good to merge once #854 is in.

#854 has been merged; are we waiting on anything else or is this ready? (I see this is still a draft)

@MoshiKoi This alters the permanent redirect behavior to s3 that is currently present (4c05959). If we want to keep that the variant would need to be created up front and sent to s3.

@Taeir
Copy link
Contributor Author

Taeir commented Jul 21, 2023

The permanent redirects were put into place because the image requests were disproportionately slow. Investigate the timings to see if this is still the case.
Another avenue is to ensure that users still get a 301 on the image request by changing the logic a bit.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Codidact loads images in full size Size of user images varies on users list
3 participants