Add lossless compressors

jperelli · Jan 6, 2020 · fbd907b · fbd907b
1 parent efb894c
commit fbd907b
Show file tree

Hide file tree

Showing 7 changed files with 1,720 additions and 60 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,10 @@
+# 3.2.0
+
+Add optional lossless compresion
+
+ - Add `imagemin` boolean option to lossless compress the result image using [imagemin](https://github.com/imagemin/imagemin) (optipng / jpegtran)
+ - Add `oxipng` boolean option to lossless compress the result image using [oxipng](https://github.com/shssoichiro/oxipng) (only for png images) (searches in `/root/.cargo/bin/oxipng`, see how to install it in [Dockerfile](./Dockerfile))
+
 # 3.1.1
 
 Bugfixing

diff --git a/Dockerfile b/Dockerfile
@@ -14,6 +14,11 @@ RUN \
     && \
     rm -rf /var/lib/apt/lists/*
 
+RUN \
+    curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh -s -- -y \
+    && \
+    /root/.cargo/bin/cargo install oxipng
+
 WORKDIR /app
 EXPOSE 3000
 CMD [ "npm", "run", "installandstartdev" ]
diff --git a/README.md b/README.md
@@ -27,6 +27,8 @@ Parameters that can be used (can be passed to the app server as GET query params
 | renderToHtml | returns html of the webpage containing the map (instead of a binary image) | `false` |
 | type | format of the image returned (`'jpeg'`/`'png'`) | `'png'` |
 | quality | quality of the image returned (`0`-`100`, only for `jpg`) | `100` |
+| imagemin | enable lossless compression with [optipng](https://github.com/imagemin/imagemin-optipng) / [jpegtran](https://github.com/imagemin/imagemin-jpegtran) | `false` |
+| oxipng | enable losslsess compression with [oxipng](https://github.com/shssoichiro/oxipng) | `false` |
 
 ## How to use
 
@@ -39,7 +41,7 @@ Parameters that can be used (can be passed to the app server as GET query params
   -index.js-
   osmsm = require('osm-static-maps');
   osmsm({geojson: geojson})
-    .then(function(imageStream) { ... })
+    .then(function(imageBinaryBuffer) { ... })
     .catch(function(error) { ... })
   ```
 

diff --git a/lib/lib.js b/lib/lib.js
@@ -2,6 +2,7 @@ const fs = require('fs');
 const Handlebars = require('handlebars');
 const puppeteer = require('puppeteer');
 const path = require('path');
+const child_process = require("child_process");
 
 const files = {
   leafletjs: fs.readFileSync(path.join(__dirname, '..', 'node_modules', 'leaflet', 'dist', 'leaflet.js'), 'utf8'),
@@ -34,6 +35,8 @@ module.exports = function(options) {
     options.tileserverUrl = options.tileserverUrl || 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
     options.vectorserverUrl = options.vectorserverUrl || '';
     options.vectorserverToken = options.vectorserverToken || 'no-token';
+    options.imagemin = options.imagemin || false;
+    options.oxipng = options.oxipng || false;
 
     const html = replacefiles(template(options));
 
@@ -59,11 +62,47 @@ module.exports = function(options) {
       });
       await page.setContent(html, { waitUntil: 'networkidle0' });
 
-      const imageBinary = await page.screenshot({ type: options.type || 'png', quality: options.type === 'jpeg' ? Number(options.quality || 100) : undefined, fullPage: true });
+      let imageBinary = await page.screenshot({
+        type: options.type || 'png',
+        quality: options.type === 'jpeg' ? Number(options.quality || 100) : undefined,
+        fullPage: true
+      });
+
+      if (options.imagemin) {
+        const imagemin = require("imagemin");
+        const imageminJpegtran = require("imagemin-jpegtran");
+        const imageminOptipng = require("imagemin-optipng");
+        const plugins = []
+        if (options.type === 'jpeg') {
+          plugins.push(imageminJpegtran());
+        } else {
+          plugins.push(imageminOptipng());
+        }
+        (async () => {
+          resolve(await imagemin.buffer(
+            imageBinary,
+            {
+              plugins,
+            }
+          ))
+        })();
+      } else {
+        if (options.oxipng) {
+          const child = child_process.spawn('/root/.cargo/bin/oxipng', ['-']);
+          child.stdin.on('error', function() {});
+          child.stdin.write(imageBinary);
+          child.stdin.end();
+          let newimg = [];
+          child.stdout.on('data', data => newimg.push(data));
+          child.on('close', () => resolve(Buffer.concat(newimg)));
+          child.on('error', e => reject(e.toString()));
+        } else {
+          resolve(imageBinary);
+        }
+      }
 
       browser.close();
 
-      resolve(imageBinary);
     })()
   });
 };
diff --git a/lib/template.html b/lib/template.html
@@ -87,8 +87,13 @@
                 }).addTo(map);
             {{else}}
                 {{#if tileserverUrl}}
-                    var osm = new L.TileLayer('{{{tileserverUrl}}}', {maxZoom: maxZoom, fadeAnimation: false});
-                    map.addLayer(osm);
+                    L.tileLayer(
+                        '{{{tileserverUrl}}}',
+                        {
+                            maxZoom: maxZoom,
+                            fadeAnimation: false
+                        }
+                    ).addTo(map);
                 {{/if}}
             {{/if}}