Reduce bandwidth usage of images by converting to either JSON or PNG

[gitchly]

Fabric.js has a feature which allows us to serialize a canvas to a JSON object. In some cases, this may be a lot smaller than the base64 PNG representation of the image, and it might be worth sending this over the network in order to save bandwidth.

See http://fabricjs.com/docs/fabric.Canvas.html#toJSON

This would require changing both the client and server-side javascript to implement.

Client side changes:

• Client would need to convert image to both PNG and JSON, compare the sizes, and send the smallest one (shortest string).
• Upon receiving image data from the server, the client would need to parse whether it's a PNG or JSON and display it appropriately

Server side changes:

• Server image validation would need to be changed to account for the different types of data

[gitchly]

After thinking about this a bit more, I doubt it would be more efficient to only send JSON data, due to the way the fill tool creates png images in memory for the fill shapes.

Sending the whole image as just an 800x600 base64 string seems more efficient than passing a JSON string containing multiple base64 images of varying sizes (up to 800x600).

The only other alternative I can think of is instead sending the fill instructions and letting each client calculate the fill, but this opens up a pretty large attack vector and wouldn't be the quickest to process for an image with a lot of fills.