Cleanup example

examples/README.md

@@ -2,5 +2,5 @@ Demo of sending compressed objects from browser to server.
 
 Run `node server.js` and open `browser.html`.
 
-__Warning!__ This is the sample only, to explain data reencoding steps. It does
+__Warning!__ This is the sample only, to show data reencoding steps. It does
 not have error checks and so on. Don't copy-paste to production code "as is".

examples/browser.html

@@ -5,43 +5,20 @@
 <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: 'БАТ' };
-}
+const obj = [
+  { foo: 'bar', baz: 'БАТ' },
+  { abra: 1, cadabra: null }
+]
 
 // 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' });
-
+var result = window.pako.deflate(str);
 
 // Send data to server
 //
@@ -52,51 +29,23 @@ var resultAsBinString  = pako.deflate(data, { to: 'string' });
 //
 /////////////////////////////////////////////////////////
 
-function sendModern() {
+function send() {
   var xhr = new XMLHttpRequest;
 
-  console.log('Sending data in modern browsers...');
+  console.log('Sending data...');
 
   xhr.open('POST', 'http://localhost:8000/', true);
 
   var formData = new FormData(document.forms.person);
-  var blob     = new Blob([ resultAsUint8Array ], { type: 'application/octet-stream'});
+  var blob     = new Blob([ result ], { type: 'application/octet-stream'});
 
   formData.append('binson', blob);
   xhr.send(formData);
 
-  setTimeout(sendModern, 5000);
+  setTimeout(send, 5000);
 }
 
-function sendAncient() {
-  var xhr = new XMLHttpRequest;
-
-  console.log('Sending data in ancient browsers...');
-
-  // Emulate form body. But since we can send intact only 7-bit
-  // characters, wrap binary data to base64. That will add 30% of size.
-  var boundary = '----' + String(Math.random()).slice(2);
-
-  var data = '';
-
-  data += '--' + boundary + '\r\n';
-  data += 'Content-Disposition: form-data; name="binson"; filename="blob"\r\n';
-  data += 'Content-Type: application/octet-stream\r\n';
-  data += 'Content-Transfer-Encoding: base64\r\n';
-  data += '\r\n';
-  data += btoa(resultAsBinString) + '\r\n';
-  data += '--' + boundary + '--\r\n';
-
-
-  xhr.open('POST', 'http://localhost:8000/');
-  xhr.setRequestHeader('Content-Type', 'multipart/form-data; boundary=' + boundary);
-  xhr.send(data);
-
-  setTimeout(sendAncient, 5000);
-}
-
-sendModern();
-sendAncient();
+send();
 
 </script>
 </html>

examples/server.js

@@ -1,12 +1,15 @@
 'use strict';
 
-/*eslint-disable no-console*/
+/* eslint-disable no-console */
 
 const http       = require('http');
-const pako       = require('../');
 const multiparty = require('multiparty');
 const fs         = require('fs');
+const zlib       = require('zlib');
+const util       = require('util');
 
+const readFile = util.promisify(fs.readFile);
+const inflate  = util.promisify(zlib.inflate);
 
 const MULTIPART_RE    = /^multipart\/form-data(?:;|$)/i;
 const MAX_FIELDS_SIZE = 100 * 1024;       // 100kb
@@ -20,8 +23,7 @@ function error(msg) {
 }
 
 
-
-const server = http.createServer(async (req, res) => {
+const server = http.createServer(async function (req, res) {
 
   console.log('--- received request');
 
@@ -60,22 +62,17 @@ const server = http.createServer(async (req, res) => {
       throw err;
     }
 
-    // In ideal world, we should process data as stream to minimize memory use
-    // on big data (and use node's `zlib` inflate).
-    //
-    // But that's just a quick sample to explain data reencoding steps from
-    // browser to server. Feel free to improve.
-    let bin = fs.readFileSync(files.binson[0].path);
+    let bin = await readFile(files.binson[0].path);
 
     // Kludge - here we should cleanup all files
     fs.unlinkSync(files.binson[0].path);
 
     // Decompress binary content
     // Note! Can throw error on bad data
-    let uncompressed = pako.inflate(new Uint8Array(bin), { to: 'string' });
+    let uncompressed = await inflate(bin);
 
-    // Convert utf8 -> utf16 (native JavaScript string format)
-    let decoded = decodeURIComponent(escape(uncompressed));
+    // Convert utf8 buffer -> utf16 string (native JavaScript string format)
+    let decoded = uncompressed.toString();
 
     // Finally, create an object
     // Note! Can throw error on bad data