Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 173d1ea1e5 | |||
| 0e90f805a4 |
@ -5,5 +5,7 @@ ENV CXXFLAGS "${CFLAGS} -std=c++17"
|
||||
ENV LDFLAGS "${CFLAGS}"
|
||||
# Build and cache standard libraries with these flags
|
||||
RUN emcc ${CXXFLAGS} --bind -xc++ /dev/null -o /dev/null
|
||||
RUN curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash
|
||||
RUN /bin/bash -ic 'nvm install 14.7.0'
|
||||
WORKDIR /src
|
||||
CMD ["sh", "-c", "emmake make -j`nproc`"]
|
||||
|
||||
13
codecs/mozjpeg_enc/.emscripten
Normal file
13
codecs/mozjpeg_enc/.emscripten
Normal file
@ -0,0 +1,13 @@
|
||||
import os
|
||||
emsdk_path = "/emsdk/"
|
||||
#NODE_JS = emsdk_path + '/node/12.18.1_64bit/bin/node'
|
||||
# We need a newer version of Node that supports the most recent iteration of Wasm SIMD
|
||||
# and need to enable that experimental support via flag so that autoconf can successfully
|
||||
# detect SIMD support.
|
||||
NODE_JS=["/root/.nvm/versions/node/v14.7.0/bin/node", "--experimental-wasm-simd"]
|
||||
LLVM_ROOT = emsdk_path + '/upstream/bin'
|
||||
BINARYEN_ROOT = emsdk_path + '/upstream'
|
||||
EMSCRIPTEN_ROOT = emsdk_path + '/upstream/emscripten'
|
||||
TEMP_DIR = emsdk_path + '/tmp'
|
||||
COMPILER_ENGINE = NODE_JS
|
||||
JS_ENGINES = [NODE_JS]
|
||||
@ -2,14 +2,24 @@ CODEC_URL := https://github.com/mozilla/mozjpeg/archive/v3.3.1.tar.gz
|
||||
CODEC_DIR := node_modules/mozjpeg
|
||||
CODEC_OUT_RELATIVE := .libs/libjpeg.a rdswitch.o
|
||||
CODEC_OUT := $(addprefix $(CODEC_DIR)/, $(CODEC_OUT_RELATIVE))
|
||||
OUT_JS := mozjpeg_enc.js
|
||||
OUT_JS := mozjpeg_enc_simd.js
|
||||
OUT_WASM := $(OUT_JS:.js=.wasm)
|
||||
|
||||
CFLAGS += -msimd128 -msse --em-config /src/.emscripten
|
||||
CXXFLAGS += -msimd128 -msse --em-config /src/.emscripten
|
||||
|
||||
#CFLAGS += --em-config /src/.emscripten
|
||||
#CXXFLAGS += --em-config /src/.emscripten
|
||||
|
||||
.PHONY: all clean
|
||||
|
||||
all: $(OUT_JS)
|
||||
|
||||
%.js: %.cpp $(CODEC_OUT)
|
||||
# We just to disable the overridden NODE_JS binary because
|
||||
# `--closure 1` can’t handle arrays in `.emscripten` it seems.
|
||||
# https://github.com/emscripten-core/emsdk/issues/583
|
||||
export EM_NODE_JS='/root/.nvm/versions/node/v14.7.0/bin/node' && \
|
||||
$(CXX) \
|
||||
-I $(CODEC_DIR) \
|
||||
${CXXFLAGS} \
|
||||
@ -18,6 +28,7 @@ all: $(OUT_JS)
|
||||
--closure 1 \
|
||||
-s ALLOW_MEMORY_GROWTH=1 \
|
||||
-s MODULARIZE=1 \
|
||||
-s EXPORT_ES6=1 \
|
||||
-s 'EXPORT_NAME="$(basename $(@F))"' \
|
||||
-o $@ \
|
||||
$+
|
||||
|
||||
62
codecs/mozjpeg_enc/bench.d8.js
Normal file
62
codecs/mozjpeg_enc/bench.d8.js
Normal file
@ -0,0 +1,62 @@
|
||||
import mozjpeg from "./mozjpeg_enc.js";
|
||||
import mozjpegSimd from "./mozjpeg_enc_simd.js";
|
||||
|
||||
const width = 2048;
|
||||
const height = 2048;
|
||||
const size = width * height * 4;
|
||||
const data = new Uint8ClampedArray(size);
|
||||
for(let i = 0; i < size; i++) {
|
||||
data[i] = Math.random() * 256;
|
||||
}
|
||||
|
||||
mozjpeg({
|
||||
onRuntimeInitialized() {
|
||||
const start = performance.now();
|
||||
const result = this.encode(data, width, height, {
|
||||
quality: 75,
|
||||
baseline: false,
|
||||
arithmetic: false,
|
||||
progressive: true,
|
||||
optimize_coding: true,
|
||||
smoothing: 0,
|
||||
color_space: 3,
|
||||
quant_table: 3,
|
||||
trellis_multipass: false,
|
||||
trellis_opt_zero: false,
|
||||
trellis_opt_table: false,
|
||||
trellis_loops: 1,
|
||||
auto_subsample: true,
|
||||
chroma_subsample: 2,
|
||||
separate_chroma_quality: false,
|
||||
chroma_quality: 75,
|
||||
});
|
||||
const end = performance.now();
|
||||
console.log("No SIMD", end - start);
|
||||
}
|
||||
})
|
||||
|
||||
mozjpegSimd({
|
||||
onRuntimeInitialized() {
|
||||
const start = performance.now();
|
||||
const result = this.encode(data, width, height, {
|
||||
quality: 75,
|
||||
baseline: false,
|
||||
arithmetic: false,
|
||||
progressive: true,
|
||||
optimize_coding: true,
|
||||
smoothing: 0,
|
||||
color_space: 3,
|
||||
quant_table: 3,
|
||||
trellis_multipass: false,
|
||||
trellis_opt_zero: false,
|
||||
trellis_opt_table: false,
|
||||
trellis_loops: 1,
|
||||
auto_subsample: true,
|
||||
chroma_subsample: 2,
|
||||
separate_chroma_quality: false,
|
||||
chroma_quality: 75,
|
||||
});
|
||||
const end = performance.now();
|
||||
console.log("SIMD", end - start);
|
||||
}
|
||||
})
|
||||
@ -1,26 +1,14 @@
|
||||
<!doctype html>
|
||||
<script src='mozjpeg_enc.js'></script>
|
||||
<script>
|
||||
const module = mozjpeg_enc();
|
||||
|
||||
async function loadImage(src) {
|
||||
// Load image
|
||||
const img = document.createElement('img');
|
||||
img.src = src;
|
||||
await new Promise(resolve => img.onload = resolve);
|
||||
// Make canvas same size as image
|
||||
const canvas = document.createElement('canvas');
|
||||
[canvas.width, canvas.height] = [img.width, img.height];
|
||||
// Draw image onto canvas
|
||||
const ctx = canvas.getContext('2d');
|
||||
ctx.drawImage(img, 0, 0);
|
||||
return ctx.getImageData(0, 0, img.width, img.height);
|
||||
}
|
||||
|
||||
module.onRuntimeInitialized = async _ => {
|
||||
console.log('Version:', module.version().toString(16));
|
||||
const module = mozjpeg_enc({
|
||||
loadFile() {
|
||||
return "./mozjpeg_enc.wasm";
|
||||
},
|
||||
async onRuntimeInitialized() {
|
||||
//console.log('Version:', module.version().toString(16));
|
||||
const image = await loadImage('../example.png');
|
||||
const result = module.encode(image.data, image.width, image.height, {
|
||||
const result = this.encode(image.data, image.width, image.height, {
|
||||
quality: 75,
|
||||
baseline: false,
|
||||
arithmetic: false,
|
||||
@ -44,5 +32,21 @@
|
||||
const img = document.createElement('img');
|
||||
img.src = blobURL;
|
||||
document.body.appendChild(img);
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
async function loadImage(src) {
|
||||
// Load image
|
||||
const img = document.createElement('img');
|
||||
img.src = src;
|
||||
await new Promise(resolve => img.onload = resolve);
|
||||
// Make canvas same size as image
|
||||
const canvas = document.createElement('canvas');
|
||||
[canvas.width, canvas.height] = [img.width, img.height];
|
||||
// Draw image onto canvas
|
||||
const ctx = canvas.getContext('2d');
|
||||
ctx.drawImage(img, 0, 0);
|
||||
return ctx.getImageData(0, 0, img.width, img.height);
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
|
||||
var mozjpeg_enc = (function() {
|
||||
var _scriptDir = typeof document !== 'undefined' && document.currentScript ? document.currentScript.src : undefined;
|
||||
if (typeof __filename !== 'undefined') _scriptDir = _scriptDir || __filename;
|
||||
var _scriptDir = import.meta.url;
|
||||
|
||||
return (
|
||||
function(mozjpeg_enc) {
|
||||
mozjpeg_enc = mozjpeg_enc || {};
|
||||
@ -63,10 +63,4 @@ d.run=Cb;if(d.preInit)for("function"==typeof d.preInit&&(d.preInit=[d.preInit]);
|
||||
}
|
||||
);
|
||||
})();
|
||||
if (typeof exports === 'object' && typeof module === 'object')
|
||||
module.exports = mozjpeg_enc;
|
||||
else if (typeof define === 'function' && define['amd'])
|
||||
define([], function() { return mozjpeg_enc; });
|
||||
else if (typeof exports === 'object')
|
||||
exports["mozjpeg_enc"] = mozjpeg_enc;
|
||||
|
||||
export default mozjpeg_enc;
|
||||
Binary file not shown.
Reference in New Issue
Block a user