Gdy mamy obrazki o różnych proporcjach szerokości do wysokości, ale wciskamy je do grida, który jest np. zawsze kwadratowy, to nie jesteśmy w stanie dać jednej optymalnej szerokości obrazka, który trzeba wysłać do klienta.
Np. jeżeli mamy kontenery na obrazki w rozmiarze 100x100 to możemy pokusić się o danie sizes_attr na 100px i tyle. Ale jeżeli ustawimy object-fit na cover, a obrazek który przyjdzie jako źródło ma 2000x1000 pikseli (proporcje 2:1, jest bardzo poziomy), to do przeglądarki zostanie wysłany plik o rozmiarze 100px na 50px, i żeby pokryć 100% wysokości, plik zostanie powiększony do 200px na 100px i będzie rozmazany.
Logika została już +/- zaimplementowana w https://hub.sealcode.org/rAUS7089c686728babe9b6a12bda3ecd19fd72f4ef1a, trzeba ją tylko przenieść do koa-responsive-image-router
Trzeba podchodzić do tego sprytniej. Musimy dać możliwość powiedzenia imagerouterowi:
- jakie są zakładane wymiary kontenera i
- jaka jest wybrana wartość object-fit ("cover"? "contain"?)
i na ich podstawie obliczać odpowiednie rozmiary obrazka, które będą serwowane.