From 4621cbcae915dafaecb67bed7998b915ae3defa8 Mon Sep 17 00:00:00 2001 From: Ingvar Stepanyan Date: Thu, 9 Apr 2020 13:24:58 +0100 Subject: [PATCH] Add encoding/decoding times to console This intentionally excludes time of loading corresponding modules, and only measures actual processing. While this is not perfect as it's not integrated in the UI (cc @jakearchibald), it gives at least some way to measure performance of different codecs and their integrations on particular files. --- src/codecs/processor-worker/index.ts | 21 +++++++++++++-------- 1 file changed, 13 insertions(+), 8 deletions(-) diff --git a/src/codecs/processor-worker/index.ts b/src/codecs/processor-worker/index.ts index e1c4682b..cf0112bd 100644 --- a/src/codecs/processor-worker/index.ts +++ b/src/codecs/processor-worker/index.ts @@ -2,13 +2,18 @@ import { expose } from 'comlink'; import { isHqx } from '../resize/processor-meta'; import { clamp } from '../util'; +function timed(name: string, func: () => Promise) { + console.time(name); + return func().finally(() => console.timeEnd(name)); +} + async function mozjpegEncode( data: ImageData, options: import('../mozjpeg/encoder-meta').EncodeOptions, ): Promise { const { encode } = await import( /* webpackChunkName: "process-mozjpeg-enc" */ '../mozjpeg/encoder'); - return encode(data, options); + return timed('mozjpegEncode', () => encode(data, options)); } async function quantize( @@ -17,7 +22,7 @@ async function quantize( const { process } = await import( /* webpackChunkName: "process-imagequant" */ '../imagequant/processor'); - return process(data, opts); + return timed('quantize', () => process(data, opts)); } async function rotate( @@ -27,7 +32,7 @@ async function rotate( /* webpackChunkName: "process-rotate" */ '../rotate/processor'); - return rotate(data, opts); + return timed('rotate', () => rotate(data, opts)); } async function resize( @@ -43,13 +48,13 @@ async function resize( const ratio = Math.max(widthRatio, heightRatio); if (ratio <= 1) return data; const factor = clamp(Math.ceil(ratio), { min: 2, max: 4 }) as 2|3|4; - return hqx(data, { factor }); + return timed('hqx', () => hqx(data, { factor })); } const { resize } = await import( /* webpackChunkName: "process-resize" */ '../resize/processor'); - return resize(data, opts); + return timed('resize', () => resize(data, opts)); } async function optiPngEncode( @@ -58,7 +63,7 @@ async function optiPngEncode( const { compress } = await import( /* webpackChunkName: "process-optipng" */ '../optipng/encoder'); - return compress(data, options); + return timed('optiPngEncode', () => compress(data, options)); } async function webpEncode( @@ -67,14 +72,14 @@ async function webpEncode( const { encode } = await import( /* webpackChunkName: "process-webp-enc" */ '../webp/encoder'); - return encode(data, options); + return timed('webpEncode', () => encode(data, options)); } async function webpDecode(data: ArrayBuffer): Promise { const { decode } = await import( /* webpackChunkName: "process-webp-dec" */ '../webp/decoder'); - return decode(data); + return timed('webpDecode', () => decode(data)); } const exports = {