rbxts-pako/examples/browser.html
2016-08-26 01:19:05 +03:00

80 lines
1.8 KiB
HTML

<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<script src="https://cdn.jsdelivr.net/pako/1.0.3/pako.min.js"></script>
<script>
'use strict';
var pako = window.pako;
// In browser
// Initial object //////////////////////////////////////////////////////////////
var obj = new Array(10);
for (var i = 0; i < obj.length; i++) {
obj[i] = { foo: 'bar', baz: 'БАТ' }
}
// Convert /////////////////////////////////////////////////////////////////////
var str = JSON.stringify(obj);
//
// Now `str` is standard utf16 (16-bit) string. But we need 8-bit data
//
// Let's reencode to utf8
// This method is dirty, but simple and ok for example.
var data = unescape(encodeURIComponent(str));
// Compress ////////////////////////////////////////////////////////////////////
//
// After compression we have binary data (typed array here).
//
// `XMLHttpRequest.send` accepts typed arrays in modern browsers.
// For ancient ones - more work needed.
//
var resultAsUint8Array = pako.deflate(data);
var resultAsBinString = pako.deflate(data, { to: 'string' });
// Send data to server /////////////////////////////////////////////////////////
function sendModern() {
var xhr = new XMLHttpRequest;
console.log('Sending data in modern browsers...');
xhr.open('POST', 'http://localhost:8000/', true);
// We could make this work everywhere, if send data as base64 string.
// But that will add 25% of size.
xhr.send(resultAsUint8Array);
setTimeout(sendModern, 2000);
}
function sendAncient() {
var xhr = new XMLHttpRequest;
console.log('Sending data in ancient browsers...');
xhr.open('POST', 'http://localhost:8000/', true);
xhr.send(resultAsBinString);
setTimeout(sendAncient, 2000);
}
sendModern();
sendAncient();
</script>
</html>
<body>
Sending objects to server, run server code to see result.
</body>