Deploy style: Images

An article, posted about one month ago filed in deployment, linux, hosting, discussion, unix, yaml, virtualisation, image & vm.

This is an article in a series on Deployment.

This technically what I have been using as the basis of my ‘infrastructure’. On top of these images I would manage the OS semi manual (assisted with Capistrano) and deploy images using Capistrano, in separated user domains different, the application servers.

You can of course completely prepare the desired OS state as an image and deploy that.

Images avant la lettre? WAR

I made this in a separate category.

The next VM? WebAssembly’s VM

WebAssembly runs in a VM. Solomon Hykes, a co-founder of Docker, is quoted on WebAssembly’s Wikipedia page: “If WASM+WASI existed in 2008, we wouldn’t have needed to create Docker. That’s how important it is. WebAssembly on the server is the future of computing.” I’d consider it to be a promising development, but will not bet on this yet.

Properties

See …

Continue reading...

Resizing images before upload

An article, posted about 9 years ago filed in form, canvas, image, data, data-url, jpeg & png.

The resolution of photo’s increases every year. And while some of that information may be worthy of retaining, not all is. High resolution images come at a price. Not only storage, but, especially in a mobile context, also data transfer. In this post I explain how you could create an uploader that fixes this.

The old form

Traditionally your form would look something like this:

`<form enctype="multipart/form-data">
  <label for="image_upload">Upload image:</label>
  <input type="file" id="image_upload" name="image_upload"/>
  <input type="submit" />
</form>`

If you want to be forgiving to your end users (and not requiring them to manually resize the images themselves) you could configure your server to accept files > 20MB and resize the images server side.

However, to save bandwidth you you might want to resize the images just before uploading.

Enter canvas

To manipulate pixels we need a canvas. So we need a canvas element.

Continue reading...