Updating oxi, adding interlace option (#1014)

This commit is contained in:
Jake Archibald
2021-05-13 14:22:19 +01:00
committed by GitHub
parent b9b6e57581
commit f0fb891498
13 changed files with 35 additions and 14 deletions

View File

@@ -12,7 +12,7 @@ wasm-opt = ["-O", "--no-validation"]
crate-type = ["cdylib"]
[dependencies]
oxipng = { version = "4.0.1", default-features = false, features = ["libdeflater"] }
oxipng = { version = "4.0.3", default-features = false, features = ["libdeflater"] }
libdeflater = { version = "0.7.1", features = ["freestanding"] }
wasm-bindgen = "0.2.73"
log = { version = "0.4.11", features = ["release_max_level_off"] }

View File

@@ -3,9 +3,10 @@
/**
* @param {Uint8Array} data
* @param {number} level
* @param {boolean} interlace
* @returns {Uint8Array}
*/
export function optimise(data: Uint8Array, level: number): Uint8Array;
export function optimise(data: Uint8Array, level: number, interlace: boolean): Uint8Array;
/**
* @param {number} num_threads
* @returns {Promise<any>}
@@ -35,7 +36,7 @@ export class wbg_rayon_PoolBuilder {
export type InitInput = RequestInfo | URL | Response | BufferSource | WebAssembly.Module;
export interface InitOutput {
readonly optimise: (a: number, b: number, c: number, d: number) => void;
readonly optimise: (a: number, b: number, c: number, d: number, e: number) => void;
readonly __wbg_wbg_rayon_poolbuilder_free: (a: number) => void;
readonly wbg_rayon_poolbuilder_numThreads: (a: number) => number;
readonly wbg_rayon_poolbuilder_receiver: (a: number) => number;

View File

@@ -56,14 +56,15 @@ function getArrayU8FromWasm0(ptr, len) {
/**
* @param {Uint8Array} data
* @param {number} level
* @param {boolean} interlace
* @returns {Uint8Array}
*/
export function optimise(data, level) {
export function optimise(data, level, interlace) {
try {
const retptr = wasm.__wbindgen_add_to_stack_pointer(-16);
var ptr0 = passArray8ToWasm0(data, wasm.__wbindgen_malloc);
var len0 = WASM_VECTOR_LEN;
wasm.optimise(retptr, ptr0, len0, level);
wasm.optimise(retptr, ptr0, len0, level, interlace);
var r0 = getInt32Memory0()[retptr / 4 + 0];
var r1 = getInt32Memory0()[retptr / 4 + 1];
var v1 = getArrayU8FromWasm0(r0, r1).slice();

View File

@@ -1,6 +1,6 @@
/* tslint:disable */
/* eslint-disable */
export function optimise(a: number, b: number, c: number, d: number): void;
export function optimise(a: number, b: number, c: number, d: number, e: number): void;
export function __wbg_wbg_rayon_poolbuilder_free(a: number): void;
export function wbg_rayon_poolbuilder_numThreads(a: number): number;
export function wbg_rayon_poolbuilder_receiver(a: number): number;

View File

@@ -3,15 +3,16 @@
/**
* @param {Uint8Array} data
* @param {number} level
* @param {boolean} interlace
* @returns {Uint8Array}
*/
export function optimise(data: Uint8Array, level: number): Uint8Array;
export function optimise(data: Uint8Array, level: number, interlace: boolean): Uint8Array;
export type InitInput = RequestInfo | URL | Response | BufferSource | WebAssembly.Module;
export interface InitOutput {
readonly memory: WebAssembly.Memory;
readonly optimise: (a: number, b: number, c: number, d: number) => void;
readonly optimise: (a: number, b: number, c: number, d: number, e: number) => void;
readonly __wbindgen_add_to_stack_pointer: (a: number) => number;
readonly __wbindgen_malloc: (a: number) => number;
readonly __wbindgen_free: (a: number, b: number) => void;

View File

@@ -40,14 +40,15 @@ function getArrayU8FromWasm0(ptr, len) {
/**
* @param {Uint8Array} data
* @param {number} level
* @param {boolean} interlace
* @returns {Uint8Array}
*/
export function optimise(data, level) {
export function optimise(data, level, interlace) {
try {
const retptr = wasm.__wbindgen_add_to_stack_pointer(-16);
var ptr0 = passArray8ToWasm0(data, wasm.__wbindgen_malloc);
var len0 = WASM_VECTOR_LEN;
wasm.optimise(retptr, ptr0, len0, level);
wasm.optimise(retptr, ptr0, len0, level, interlace);
var r0 = getInt32Memory0()[retptr / 4 + 0];
var r1 = getInt32Memory0()[retptr / 4 + 1];
var v1 = getArrayU8FromWasm0(r0, r1).slice();

View File

@@ -1,7 +1,7 @@
/* tslint:disable */
/* eslint-disable */
export const memory: WebAssembly.Memory;
export function optimise(a: number, b: number, c: number, d: number): void;
export function optimise(a: number, b: number, c: number, d: number, e: number): void;
export function __wbindgen_add_to_stack_pointer(a: number): number;
export function __wbindgen_malloc(a: number): number;
export function __wbindgen_free(a: number, b: number): void;

View File

@@ -5,7 +5,7 @@ use oxipng::AlphaOptim;
use wasm_bindgen::prelude::*;
#[wasm_bindgen]
pub fn optimise(data: &[u8], level: u8) -> Vec<u8> {
pub fn optimise(data: &[u8], level: u8, interlace: bool) -> Vec<u8> {
let mut options = oxipng::Options::from_preset(level);
options.alphas.insert(AlphaOptim::Black);
options.alphas.insert(AlphaOptim::White);
@@ -13,6 +13,7 @@ pub fn optimise(data: &[u8], level: u8) -> Vec<u8> {
options.alphas.insert(AlphaOptim::Down);
options.alphas.insert(AlphaOptim::Left);
options.alphas.insert(AlphaOptim::Right);
options.interlace = Some(if interlace { 1 } else { 0 });
options.deflate = oxipng::Deflaters::Libdeflater;
oxipng::optimize_from_memory(data, &options).unwrap_throw()

View File

@@ -2,6 +2,7 @@ import {
canvasEncode,
abortable,
blobToArrayBuffer,
inputFieldChecked,
} from 'client/lazy-app/util';
import { EncodeOptions } from '../shared/meta';
import type WorkerBridge from 'client/lazy-app/worker-bridge';
@@ -9,6 +10,7 @@ import { h, Component } from 'preact';
import { inputFieldValueAsNumber, preventDefault } from 'client/lazy-app/util';
import * as style from 'client/lazy-app/Compress/Options/style.css';
import Range from 'client/lazy-app/Compress/Options/Range';
import Checkbox from 'client/lazy-app/Compress/Options/Checkbox';
export async function encode(
signal: AbortSignal,
@@ -34,6 +36,7 @@ export class Options extends Component<Props, {}> {
const options: EncodeOptions = {
level: inputFieldValueAsNumber(form.level),
interlace: inputFieldChecked(form.interlace),
};
this.props.onChange(options);
};
@@ -41,6 +44,14 @@ export class Options extends Component<Props, {}> {
render({ options }: Props) {
return (
<form class={style.optionsSection} onSubmit={preventDefault}>
<label class={style.optionToggle}>
Interlace
<Checkbox
name="interlace"
checked={options.interlace}
onChange={this.onChange}
/>
</label>
<div class={style.optionOneCell}>
<Range
name="level"

View File

@@ -12,6 +12,7 @@
*/
export interface EncodeOptions {
level: number;
interlace: boolean;
}
export const label = 'OxiPNG';
@@ -20,4 +21,5 @@ export const extension = 'png';
export const defaultOptions: EncodeOptions = {
level: 2,
interlace: false,
};

View File

@@ -40,9 +40,12 @@ export default async function encode(
options: EncodeOptions,
): Promise<ArrayBuffer> {
if (!wasmReady) {
wasmReady = threads().then((hasThreads: boolean) => hasThreads ? initMT() : initST());
wasmReady = threads().then((hasThreads: boolean) =>
hasThreads ? initMT() : initST(),
);
}
const optimise = await wasmReady;
return optimise(new Uint8Array(data), options.level).buffer;
return optimise(new Uint8Array(data), options.level, options.interlace)
.buffer;
}