Unfortunately, the server where my old weblog was hosted is affected by Meltdown and Specter. Therefore it has been disabled by my service provider. Although I still have a backup, I think that it would be an opportunity to try a new weblog system and introduce my latest contribution to the Open Source community: express-sharp-server.

Meltdown Spectre


My old weblog was powered by WordPress. Since I have been working as a JavaScript application developer for more than 10 years and practically do not use PHP anymore, I think it’s time to try something new. HEXO is a simple and easy to learn weblog system for NodeJs. Like many new weblog systems, Hexo is based on Markdown files. The advantage is that no databases are required as well as versioning and deployment can be done via Github.
Only the image processing is a little more complicated. While Typo3 or Wordpress offer extensive functions here, with Hexo only the URL to a picture is to be specified. Preprocessing does not take place.

Because of that, my latest contribution to the Open Source community is express-sharp-server.

Either I took a picture myself, or I choose a public domain from wikimedia commons to illustrate articles. In both cases I have to edit the image to prepare it for use in my weblog.

With express-sharp-server I have developed a easy-to-use restful image server that allows to save an image in arbitrary resolution and to query of derivatives, clippings, size and rotation via GET parameter and use it directly in Hexo or any other web application. In addition, user data can be stored, for example, to store license information directly with the image. express-sharp-server is based on node-sharp, a nodejs wrapper for libvips. libvips is an extremely fast library for processing image data and supports not only the image formats commonly used on the web, such as jpeg, png but also svg.

The Images above for Spectr and Meltdown are directly referenced from Wikimedia Commons. Hence the following POST was send to the server.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
{
"_links": {
"origin": {
"href": "https://upload.wikimedia.org/wikipedia/commons/2/25/Spectre_with_text.svg"
}
},
"userdata": {
"license": {
"label": "CC0 1.0",
"href": "https://creativecommons.org/publicdomain/zero/1.0",
"attribution": "Natascha Eibl at Wikimedia Commons"
}
}
}

As the result, the server returns with some image information and a url to the resource:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
{
"metadata": {
"width": 702,
"height": 836,
"channels": 4,
"density": 72,
"size": 23867,
"mimetype": "image/svg",
"format": "svg"
},
"created": {
"datetime": "2019-01-06T17:31:30.920Z"
},
"_links": {
"origin": {
"href": "https://upload.wikimedia.org/wikipedia/commons/2/25/Spectre_with_text.svg"
},
"self": {
"href": "/image/dfe8084ca4ffc40a1a37089a6ed4c3f6"
}
},
"userdata": {
"license": {
"label": "CC0 1.0",
"href": "https://creativecommons.org/publicdomain/zero/1.0",
"attribution": "Natascha Eibl at Wikimedia Commons"
}
}
}

The user can retrieve this information by requesting url _links.self.href and sending Accept: application/json. If just the url is requested, the original data will be sent out of the servers cache and can be used in any website.

1
2
3
4
5
<img src="/image/dfe8084ca4ffc40a1a37089a6ed4c3f6" width="702" height="836">

or

![Spectre](/image/47cc7d1b098ff2de256881e1ddb523a2)

The editor of a web application now has the ability to request different clippings and sizes of the image to fit it into the web page.

Some examples:

1
2
<img src="/image/47cc7d1b098ff2de256881e1ddb523a2
?polygon=[{x:0,y:650},{x:622,y:650},{x:622,y:836},{x:0,y:836}]&height=50">

Spectre

1
<img src="/image/47cc7d1b098ff2de256881e1ddb523a2?width=100">

Spectre

At the moment the functionality is limited to my personal needs. But the project is easy to expand and new functionality will be added in the future.