Started case study, some images are not working for b123.

kevinAlbs · Nov 18, 2016 · 451565e · 451565e
1 parent b1a91f4
commit 451565e
Show file tree

Hide file tree

Showing 11 changed files with 78 additions and 0 deletions.
diff --git a/base123.js b/base123.js
@@ -127,6 +127,7 @@ function encode(rawData) {
             stringData.push(b2);
             debugLog(' Unicode character is ', b1.toString(2), b2.toString(2));
         } else {
+            debugLog(' One byte unicode character is ', bits.toString(2));
             stringData.push(bits);
         }
     }

diff --git a/casestudy/base64Encode.js b/casestudy/base64Encode.js
@@ -0,0 +1,6 @@
+let fs = require('fs');
+if (process.argv.length != 3) {
+    console.log("Usage: node base64EncodeImage.js file");
+    process.exit(1);
+}
+console.log(fs.readFileSync(process.argv[2]).toString('base64'));
diff --git a/casestudy/createCases.js b/casestudy/createCases.js
@@ -0,0 +1,31 @@
+// Writes a number of images in both src, base64, and base123 format.
+let fs = require('fs')
+, base123 = require('../base123')
+;
+
+const kNumImages = 1000
+, kImgDir = 'img/'
+, kHeader = "<html><head><meta charset='utf-8'></head><body>"
+, kFooter = "</body></html>"
+, kBase123Script = '<script>function b123d(a){function i(a){a<<=1,f|=a>>>g,g+=7,g>=8&&(e.push(f),g-=8,f=a<<7-g&255)}for(var b=[0,10,13,34,92],d=64,e=[],f=0,g=0,h=a.charCodeAt(0),j=1;j<a.length;j++){var k=a.charCodeAt(j);if(k>127){var l=k>>>8&7;if(i(b[l]),j==a.length-1&&h&d)continue;i(127&k)}else i(k)}return e}document.querySelectorAll("[data-b123]").forEach(a=>{var b=a.dataset.b123,c=a.dataset.b123m||"image/png";inflated=new Uint8Array(b123d(b));var d=new Blob([inflated],{type:c}),e=URL.createObjectURL(d);a.src=e});</script>'
+;
+
+let outSrc = fs.createWriteStream('out.html')
+, outB64 = fs.createWriteStream('out-base64.html')
+, outB123 = fs.createWriteStream('out-base123.html')
+, outFiles = [outSrc, outB64, outB123]
+;
+
+outFiles.forEach((file) => { file.write(kHeader); });
+for (let i = 0; i < kNumImages; i++) {
+    outSrc.write('<img src="' + kImgDir + i + '.png" />');
+    let buf = fs.readFileSync(kImgDir + i + '.png');
+    let base64String = buf.toString('base64');
+    outB64.write('<img src="data:image/png;base64,'+ base64String + '" />');
+    let base123Data = base123.encodeFromBase64(base64String); // TODO: bad, encode from buffer.
+    outB123.write('<img data-b123="');
+    outB123.write(new Buffer(new Uint8Array(base123Data)));
+    outB123.write('">');
+}
+outB123.write(kBase123Script);
+outFiles.forEach((file) => { file.end(kFooter); });
diff --git a/casestudy/out-base123.html b/casestudy/out-base123.html
diff --git a/casestudy/out-base64.html b/casestudy/out-base64.html
diff --git a/casestudy/out.html b/casestudy/out.html
diff --git a/casestudy/scrapeImages.js b/casestudy/scrapeImages.js
@@ -0,0 +1,26 @@
+let fs = require('fs')
+, http = require('http')
+, currentImageIndex = 0
+;
+
+const url = 'http://unsplash.it/64?image='
+, kNumImages = 1000
+, kConcurrency = 8
+;
+
+function fetchImage() {
+    if (currentImageIndex >= kNumImages) return;
+    let index = currentImageIndex++;
+    console.log('Fetching image ' + index + '/' + kNumImages);
+    http.get(url + index, (res) => {
+        let imageData = Buffer.alloc(0);
+        res.on('data', (chunk) => { imageData = Buffer.concat([imageData, chunk]); });
+        res.on('end', () => {
+            fs.writeFile('img/' + index + '.png', imageData);
+            fetchImage();
+        });
+    });
+}
+
+// Each fetchImage will act as a separate thread fetching images.
+for (let i = 0; i < kConcurrency; i++) fetchImage();
diff --git a/readme.md b/readme.md
@@ -96,4 +96,8 @@ Minimal path to release
 transfer rate as a function of data size.). Use JSPerf
 - Do a fair storage size test when gzip considered. original vs base64 vs base123
 - Add a case study of an image rich page before and after.
+    - Refetch images to fix errors
+    - See what is wrong with the mis-rendered few images
+    - Test performance on firefox
+    - Test with gzip
 - Finish blog post.
diff --git a/test/testAll.js b/test/testAll.js
@@ -72,6 +72,7 @@ tester.addTest('realBase64Data', () => {
     testBase64EncodeDecode(testData.base64.img1);
     testBase64EncodeDecode(testData.base64.img2);
     testBase64EncodeDecode(testData.base64.audio1);
+    testBase64EncodeDecode(testData.base64.imgBug);
 });
 
 tester.run();
diff --git a/test/testBug.js b/test/testBug.js
@@ -0,0 +1,5 @@
+let base123 = require('../base123')
+, testData = require('./testData')
+;
+
+base123.encodeFromBase64(testData.base64.imgBug);
diff --git a/test/testData.js b/test/testData.js