Apply gamma correction to compute the SDF

index.js

@@ -90,7 +90,9 @@ export default class TinySDF {
                     gridInner[j] = INF;
 
                 } else { // aliased pixels
-                    const d = 0.5 - a;
+                    // gamma correction
+                    const aLin = Math.pow(a, 1.0 / 2.2);
+                    const d = 0.5 - aLin;
                     gridOuter[j] = d > 0 ? d * d : 0;
                     gridInner[j] = d < 0 ? d * d : 0;
                 }

package.json

@@ -9,6 +9,7 @@
   "scripts": {
     "pretest": "eslint index.js index.html test",
     "test": "node --test",
+    "bench": "node ./test/bench.js",
     "start": "st --no-cache --localhost --index index.html ."
   },
   "repository": {

test/bench.js

@@ -0,0 +1,31 @@
+import TinySDF from '../index.js';
+import nodeCanvas from 'canvas';
+
+
+class MockTinySDF extends TinySDF {
+    _createCanvas(size) {
+        return nodeCanvas.createCanvas(size, size);
+    }
+}
+
+function bench(iterationsCount) {
+    const sdf = new MockTinySDF({
+        fontSize: 48,
+        buffer: 3
+    });
+    for (let i = 0; i < iterationsCount; ++i) {
+        sdf.draw('@');
+    }
+}
+
+function getCurrentTimestamp() {
+    return performance.now();
+}
+
+const ITERATIONS_COUNT = 1e5;
+const tStart = getCurrentTimestamp();
+bench(ITERATIONS_COUNT);
+const tEnd = getCurrentTimestamp();
+const dtSec = (tEnd - tStart) * 0.001;
+console.log(`Durations for ${ITERATIONS_COUNT} iterations: ${dtSec} seconds`);
+

test/fixtures/1-metrics.json

@@ -1,10 +1,10 @@
 {
-  "width": 48,
-  "actualBoundingBoxLeft": 0,
-  "actualBoundingBoxRight": 48,
-  "actualBoundingBoxAscent": 39.2158203125,
-  "actualBoundingBoxDescent": 4.6083984375,
-  "emHeightAscent": 50.8798828125,
-  "emHeightDescent": 16.3203125,
-  "alphabeticBaseline": 13.9189453125
+  "width": 48.2197265625,
+  "actualBoundingBoxLeft": 1.8720703125,
+  "actualBoundingBoxRight": 45.263671875,
+  "actualBoundingBoxAscent": 39.16796875,
+  "actualBoundingBoxDescent": 4.65625,
+  "emHeightAscent": 51,
+  "emHeightDescent": 17,
+  "alphabeticBaseline": 14.0390625
 }

test/fixtures/1-out.json

@@ -1,9 +1,9 @@
 {
-  "width": 54,
+  "width": 50,
   "height": 51,
-  "glyphWidth": 48,
+  "glyphWidth": 44,
   "glyphHeight": 45,
   "glyphTop": 40,
   "glyphLeft": 0,
-  "glyphAdvance": 48
+  "glyphAdvance": 48.2197265625
 }