Showcase page very big ~13mb

[Sebobo]

We should introduce lazy loading here.

I can take care of it.

[kdambekalns]

This is a dupe of #112, no? Also, see #113

[Sebobo]

@kdambekalns Don't think so. It's a bit related but one is about the videos which should maybe not shown on mobile.
These images we want, but only on demand.
I think @bwaidelich can share parts of a codebase for that.

[bwaidelich]

Can you provide some more details?
https://www.neos.io/features/case-studies.html has ~500kb. Not great but far from 13mb.
The largest seems to be the swisscom case study with ~3.1mb
But this is not due to animated gifs (#112) as far as I can see but mostly due to screenshots that are almost 2mb large(!) (see https://storage.googleapis.com/target.wwwneosio.neos.eu.beach.flownative.net/5796e58c9c104a806af65799d2cc897fd1636d59/Capture%202016-04-06%20at%2015.16.46-1500x742.png for example).

Maybe we should create a general issue for image optimization (size & quality)

[Sebobo]

Sorry I meant the showcase page of course. And it's actually much more.

[bjen]

The show cases are not yet optimized, as I didn't have the time to try to understand how exactly that kind of image rendering works. However starting to optimize images should not only be done for show cases, but in general for this kind of teaser boxes.

[Sebobo]

But the image optimization should also be another issue. Here I would like to load what's necessary.
That can be done with a small js plugin and some small adjustments I think.

[bwaidelich]

Sorry I meant the showcase page of course

Ah, that makes more sense ;)
I think it's two issues:

1. The image rendering could be optimized: i.e. the thumbnail images are larger (dimension-wise) than they need to be, the compression level can probably also be increased

2. We currently load 150 showcases at once including images (more relevant in this case)

So +1 for lazy-loading and/or the already planned filter with some decent defaults