Languages
[Edit]
EN

JavaScript - own schema based JSON decompression algorithm

10 points
Created by:
jarlh
295

In this short article, we would like to show how in JavaScript, write a simple JSON decompression algorithm based on custom JSON schema.

This article presents an experimental concept.

 

Motivation:
by splitting JSON into schema and data parts we are able to reduce the amount of data needed to transfer from the server always on request.

The schema should be sent once or embedded into the site code.

Compression effectiveness is visible here:

// Compressed (66 characters):

   ["John",26,2,"Course","Classes',"UK","London","000 000",null,null]


// Normal JSON (213 characters):

   {"name":"John","age":26,"tasks":["Course","Classes"],"address":{"country":"UK","city":"London","postcode":"000 000","street":null,"number":null}}


// 100% * (66 / 213) = 30.98% of original size after compression
// Hint: to get better data can be transmitted as a simple string (44 characters)
// e.g.

   John,26,2,Course,Classes,UK,London,000 000,,

// Where:
//  - coma separates values,
//  - empty value between comas can be treat as null or empty string
//  - escaped coma should be treat as string character,
//  - value types are stored in schema - easy to detect type during decompression


// 100% * (44 / 213) = 20.66% of original size after compression

 

Practical example:

// ONLINE-RUNNER:browser;

const decompressValue = (schema, provider) => {
    if (schema.type === 'object') {
        return decompressObject(schema.properties, provider);
    }
    if (schema.type === 'array') {
        return decompressArray(schema.item, provider);
    }
    return provider.get() ?? null;
};

const decompressObject = (schema, provider) => {
    const data = {};
	for (const entry of schema) {
		data[entry.name] = decompressValue(entry, provider);
	}
    return data;
};

const decompressArray = (schema, provider) => {
    const data = [];
	const length = provider.get() ?? 0;
	for (let i = 0; i < length; ++i) {
		data.push(decompressValue(schema, provider));
	}
    return data;
};

const decompressData = (schema, data) => {
  	let index = -1;
	const provider = {
		get: () => data[++index]
	};
  	return decompressValue(schema, provider);
};


// Usage example:

const schema = {
    type: 'object',
    properties: [
        {name: 'name', type: 'string'},
        {name: 'age',  type: 'number'},
        {
            name: 'tasks',
            type: 'array',
            item: {
                type: 'string'
            }
        },
        {
            name: 'address',
            type: 'object',
            properties: [
              	{name: 'country',  type: 'string'},
              	{name: 'city',     type: 'string'},
              	{name: 'postcode', type: 'string'},
              	{name: 'street',   type: 'string'},
              	{name: 'number',   type: 'string'}
            ]
        }
    ]
};

// Input contains values according to schema order:
//  - name:     John
//  - age:      26
//  - 2 tasks:  Course, Classes
//  - country:  UK
//  - city:     London
//  - postcode: 000 000
//  - street:   null
//  - number:   null
//
const input = ['John', 26, 2, 'Course', 'Classes', 'UK', 'London', '000 000', null, null];
  
// Output contains decompressed object constructed using schema and input.
//
const output = decompressData(schema, input);

console.log(JSON.stringify(output, null, 4));

See also

  1. JavaScript - simple own json schema 
Native Advertising
🚀
Get your tech brand or product in front of software developers.
For more information Contact us
Dirask - we help you to
solve coding problems.
Ask question.

❤️💻 🙂

Join