Javascript client-data compression

Question

I am trying to develop a paint brush application thru processingjs. This API has function loadPixels() that will load the RGB values in to the array. Now i want to store the array in the server db.

The problem is the size of the array, when i convert to a string the size is 5 MB.

Is the best solution is to do compression at javascript level? How to do it?

Answer 1

See http://rosettacode.org/wiki/LZW_compression#JavaScript for an LZW compression example. It works best on longer strings with repeated patterns.

From the Wikipedia article on LZW:

A dictionary is initialized to contain the single-character strings corresponding to all the possible input characters (and nothing else except the clear and stop codes if they're being used). The algorithm works by scanning through the input string for successively longer substrings until it finds one that is not in the dictionary. When such a string is found, the index for the string less the last character (i.e., the longest substring that is in the dictionary) is retrieved from the dictionary and sent to output, and the new string (including the last character) is added to the dictionary with the next available code. The last input character is then used as the next starting point to scan for substrings.

In this way, successively longer strings are registered in the dictionary and made available for subsequent encoding as single output values. The algorithm works best on data with repeated patterns, so the initial parts of a message will see little compression. As the message grows, however, the compression ratio tends asymptotically to the maximum.

Answer 2

JavaScript implementation of Gzip has a couple answers that are relevant.

Also, Javascript LZW and Huffman Coding with PHP and JavaScript are other implementations I found.