mikeboers / Flask-Images

On-demand resizing of images for Flask applications.
https://mikeboers.github.io/Flask-Images/
BSD 3-Clause "New" or "Revised" License
81 stars 43 forks source link

Predict dimensions for img tag #16

Open mikeboers opened 10 years ago

mikeboers commented 10 years ago

It would be swell if we could predict the final width/height of an image so that they can be used in the template as well (to avoid a jump in layout when the images load).

Perhaps something like:

{{ resized_img('path/to/image.jpg', class_="myclass", mode='fit', width=200, height=200) }}

would render into:

<img class="myclass" src="/imgsizer/path/to/image.jpg?m=fit&w=200&h=200&s=xxx" width="200" height="150" />

Some testing needs to be done with regards to the speed at which dimension data can be extracted from images on disk without loading all of the data, so that we know if we can get away with the naive implementation or if we have to intelligently cache dimensions.

iurisilvio commented 10 years ago

Code to do it with .png: http://stackoverflow.com/questions/8032642/how-to-obtain-image-size-using-standard-python-class-without-using-external-lib

You have to read only some file headers.

iurisilvio commented 10 years ago

Also, PIL does not load the image to memory on .open.

http://stackoverflow.com/a/19034942/617395

mikeboers commented 10 years ago

PIL doesn't require loading the image on .open, but the docs don't lead me to believe that they never will. Looking at the SO question you linked to it seems that malformed JPEGs would result in loading everything, but I don't think that is something to be really concerned about.

So I guess we need to see how PIL[low] behaves with the other formats, and if it doesn't actually load the data (from valid files) then I'm cool with just using PIL to do it. Otherwise, it sounds like a good idea for another small library. ;)

mikeboers commented 10 years ago

This is underway now as it is required for the implementation of "retina" support for my personal site.

mikeboers commented 10 years ago

This is done in the "retina" branch.