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

Image optization and website paint times #1207

Closed
Wh1t3Rose opened this issue Mar 17, 2021 · 10 comments
Closed

Image optization and website paint times #1207

Wh1t3Rose opened this issue Mar 17, 2021 · 10 comments

Comments

@Wh1t3Rose
Copy link

Wh1t3Rose commented Mar 17, 2021

Description

Please consider optimizing all your images within /app/public/. It can take a very long time to fully load the login page as well as load all the images on the Discover tab.

It would also be nice if you can find a way to speed up the inital loadtime for images on the discover tab, It can take a very long time (sometimes 10+ seconds for all images to load). Maybe there is a way to compress these images as they load in before they are displayed?

Additional Context

You can use something like http://jpeg-optimizer.com/ to compress your images and reduce size over 75%. I have tested this with most of the images.

Before Image Optimization

image

After Image Optimization (Notice Contentful Paint time adn Speed Index dropped significantly)

image

@TheCatLady
Copy link
Collaborator

We use @ImgBotApp to optimize images in our repo already. To achieve the high compression rates you describe, is there visible loss in quality?

And the images on the Discover page are fetched directly from TMDb.

@Wh1t3Rose
Copy link
Author

I have not noticed a visable loss in quality at all with a compression level of 65 from http://jpeg-optimizer.com/.

I am working on setting up Nginx with redis cache in hopes of speeding up images on Discover Page. Any other ideas of speeding this up? I am already using Cloudflare CDN with caching

@sct
Copy link
Owner

sct commented Mar 17, 2021

We had the images optimized at some point but I think when I changed which images we were serving I forgot to reoptimize them. It seems that ImgBot also let the ball drop there. I will serve the images using next/image to solve the image size problem.

As for caching the rest of the assets, they are all being served by TMDb's CDN which should be fast. I was thinking about offering an option to locally cache the TMDb images as well with next/image as well, but it will come in the future.

@sct
Copy link
Owner

sct commented Mar 17, 2021

If your Discover page is taking over 10 seconds to load, you should probably check your connection to TMDb though? It loads near instantly for most people, I believe.

@sct
Copy link
Owner

sct commented Mar 17, 2021

I just pushed a fix for images on the login page. They will be served in an optimized format now.

@Wh1t3Rose
Copy link
Author

Thank you!

My Discover page takes 22s to load. Not sure why it is so high.

Now my friend has a similar setup to mine and his takes 12s (A lot faster than mine but still sluggish)

We both have 1GB down connections

@sct
Copy link
Owner

sct commented Mar 18, 2021

Thank you!

My Discover page takes 22s to load. Not sure why it is so high.

Now my friend has a similar setup to mine and his takes 12s (A lot faster than mine but still sluggish)

We both have 1GB down connections

That's in no way normal. Maybe hop into the Discord and ask in support. Something is going on here but it shouldn't be Overseerr.

@Wh1t3Rose
Copy link
Author

Wh1t3Rose commented Mar 18, 2021

Well I disabled Proxy Buffering and Request Buffering in my Nginx config and it significantly improved load times. 2.5 seconds with browser cache enabled and 3.1 seconds with browser cache turned off in Developer console.

Overseerr is the only thing this setting has affected. And I have around a dozen subdomains. Not sure what that means.

It may be worth noting I am hosting everything in a local Unraid server. Not a Shared hosting provider or VPS like a lot of people probably are.

Also I am using Nginx Proxy with Cloudflare CDN caching.

@TheCatLady
Copy link
Collaborator

Well I disabled Proxy Buffering and Request Buffering in my Nginx config and it significantly improved load times. 2.5 seconds with browser cache enabled and 3.1 seconds with browser cache turned off in Developer console.

Overseerr is the only thing this setting has affected. And I have around a dozen subdomains. Not sure what that means.

It may be worth noting I am hosting everything in a local Unraid server. Not a Shared hosting provider or VPS like a lot of people probably are.

Also I am using Nginx Proxy with Cloudflare CDN caching.

I run Overseerr behind an Nginx reverse proxy with proxy & request buffering both on (the default settings), with no issues with image load times. My server is also on my LAN. It seems like there is something else in your setup that is causing these issues.

Either way, we are now optimizing images. If you continue to have issues, feel free to stop by our Discord server for support!

@github-actions
Copy link

👋 @Wh1t3Rose, we use the issue tracker exclusively for bug reports and feature requests. However, this issue appears to be a support request. Please use our support channels to get help with Overseerr.

@github-actions github-actions bot locked as off-topic and limited conversation to collaborators Mar 18, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

3 participants