anthkris / id-simulator

A reigns-like yes/no game about being an instructional designer
MIT License
4 stars 5 forks source link

Create image sizes for better responsiveness (Should this be done with Gulp, instead?) #11

Open garajo opened 6 years ago

garajo commented 6 years ago

Remnant from #2

Some possible candidates?

https://github.com/herrstucki/responsive-loader https://www.npmjs.com/package/resize-image-loader https://www.npmjs.com/package/advanced-image-loader

anthkris commented 6 years ago

Connected to #8

To clarify, we want to refactor images to use a srcset, so as part of the build step, we want to serve up images at various sizes such that the browser downloads the smallest image necessary, depending either on device size and/or pixel density.

The first step will be to calculate what sizes we need, then we need to make the images sizes. Another option (or part of the solution) might be to use webp where possible. I think there are some optmizers that will convert a png to a webp image.

It looks like any of the links you listed might do the trick, but I'm a little concerned about their maintenance status.