Scale/Optimise Avatars to output size

Currently all avatars that are displayed are using the original uploaded file in its original size, so for displaying a 24x24 User Avatar we load a 500 KB File sometimes. Also we should look at optimising PNG and eventual WebP There is a huge potential on saving bandwidth and loading time :

For all solutions we should align avatar sizes (i found 24, 26, 32, 36 , etc.). Also resized avatars will help a lot with rendering performance as the browser doesn't need to do it anymore.

Potential solutions :

CDN

We use a CDN to route our traffic through for .com, might be a quick win for now.

Resize + Caching on the fly

Our Backend is capable on a routing basis to deliver different predefined sizes. As soon an avatar is created the file will be saved + cached.

Could be done also through NGINX http://nginx.org/en/docs/http/ngx_http_image_filter_module.html

We should be aware about cleaning up avatars, if new versions are uploaded etc. Also use only predefined sizes otherwise DDOS is easy.

Create them during upload

Do the creation of the different sizes during upload. Problematic with existing avatars.