November 21, 2011 3

Instagram Shredder Challenge solved with HTML5


Instagram recently posted a challenge to write an algorithm to piece together an image that had been cut into slices and re-arranged. I thought this was a perfect opportunity to take the HTML5 canvas for a spin!

You can see my working solution here

The algorithm is about 150 lines of JavaScript and seems to work pretty well. I’m sure there are more performant ways to solve the problem but that wasn’t the goal of the exercise. My solution does features an N² loop, although it doesn’t execute expensive comparison code on each iteration, even so it possibly doesn’t scale too well.

Due to limited time I’ve not tackled the “extra credit” problem which was to programmatically work out the width of the slices.

  • Jérôme Mahuet

    404 on your demo dude!

  • Joe Lambert

    Oops, thanks for letting me know. Link fixed!

  • Brian Enriquez

    Once again, you are the man, Joe!