This package has been flagged as retired by the package owner. Continue to use at your own risk
This is a package, that creates base64 uri's for tiny versions of your images.
The base64 uri's, are especially useful if you want to lazyload or progressively enhance your images, as they are a somewhat lightweight representantion of what your image looks like.
Check out blogposts for more info about the blur-up technique:
The package adds new extensions for IPublishedContent and the UrlHelper. You can then use it in your template, wherever you need to add a base64 uri of your image like this:
<img src="@media.GetPlaceholderUri()"> or <img src="@Url.GetPlaceholderUri("~/path-to/image.jpg")">
Both extensions allow you to input a maxWidth and maxHeight parameters for controlling the size of your placeholder image. The default is max 4x4 pixels.
<img src="@media.GetPlaceholderUri(1,1)"> or <img src="@Url.GetPlaceholderUri("~/path-to/image.jpg",0,0)">
On the IPublishedContent extension, you can also specify a propertyAlias, if the image you need a placeholder for, is not contained in the umbracoFile property.
<img src="@media.GetPlaceholderUri(propertyAlias: "someProperty")">
How it works
The GetPlaceholderUri methods, loads the image referenced with ImageProcessor, then resizes it to your desired max width and height, and returns a base 64 uri of the image. The base64 uri, is then cached so you don't need to generate the image on every request.