search

sct / overseerr

Request management and media discovery tool for the Plex ecosystem
https://overseerr.dev
MIT License
3.82k stars 444 forks source link

Image optization and website paint times #1207

Closed Wh1t3Rose closed 3 years ago

Wh1t3Rose commented 3 years ago

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 commented 3 years ago

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 commented 3 years ago

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 commented 3 years ago

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 commented 3 years ago

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 commented 3 years ago

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

Wh1t3Rose commented 3 years ago

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 commented 3 years ago

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 commented 3 years ago

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 commented 3 years ago

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[bot] commented 3 years ago

:wave: @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.