with loading=lazy, specifying dimensions improves performance

[cappert]

after #34

Got a warning in the Google Chrome console:

[Intervention] An <img> element was lazyloaded with loading=lazy, but had no dimensions specified. Specifying dimensions improves performance. See https://crbug.com/954323

I think it's because if you don't specify the dimension of the images upfront, the browser has to do a layout pass again while scrolling, which kills the performance.
A lot of browser optimizations are about skipping layout and repaints, see https://developers.google.com/web/fundamentals/performance/rendering.

⚠️ if we specify the dimensions we might break the responsiveness, as bootstrap adds

display: block;
max-width: 100%;
height: auto;

to make the images responsive, so if we specify dimensions we will overwrite that.

In closing I'm not even sure we need to lazy load the photos, it's 20kb jpgs.

[guillaumebriday]

Fixed in #48. Reopen if needed 👍