mirror of
https://github.com/GoogleChromeLabs/squoosh.git
synced 2025-11-11 16:26:20 +00:00
Remove web codecs usage
It was decoding transparency incorrectly (multiplication wrong?), and I'd rather not have a different code path there for the sake of it
This commit is contained in:
@@ -114,7 +114,7 @@ async function decodeImage(
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
// Otherwise fall through and try built-in decoding for a laugh.
|
// Otherwise fall through and try built-in decoding for a laugh.
|
||||||
return await builtinDecode(signal, blob, mimeType);
|
return await builtinDecode(signal, blob);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
if (err instanceof Error && err.name === 'AbortError') throw err;
|
if (err instanceof Error && err.name === 'AbortError') throw err;
|
||||||
console.log(err);
|
console.log(err);
|
||||||
|
|||||||
@@ -63,35 +63,17 @@ interface DrawableToImageDataOptions {
|
|||||||
sh?: number;
|
sh?: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
function getWidth(
|
|
||||||
drawable: ImageBitmap | HTMLImageElement | VideoFrame,
|
|
||||||
): number {
|
|
||||||
if ('displayWidth' in drawable) {
|
|
||||||
return drawable.displayWidth;
|
|
||||||
}
|
|
||||||
return drawable.width;
|
|
||||||
}
|
|
||||||
|
|
||||||
function getHeight(
|
|
||||||
drawable: ImageBitmap | HTMLImageElement | VideoFrame,
|
|
||||||
): number {
|
|
||||||
if ('displayHeight' in drawable) {
|
|
||||||
return drawable.displayHeight;
|
|
||||||
}
|
|
||||||
return drawable.height;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function drawableToImageData(
|
export function drawableToImageData(
|
||||||
drawable: ImageBitmap | HTMLImageElement | VideoFrame,
|
drawable: ImageBitmap | HTMLImageElement,
|
||||||
opts: DrawableToImageDataOptions = {},
|
opts: DrawableToImageDataOptions = {},
|
||||||
): ImageData {
|
): ImageData {
|
||||||
const {
|
const {
|
||||||
width = getWidth(drawable),
|
width = drawable.width,
|
||||||
height = getHeight(drawable),
|
height = drawable.height,
|
||||||
sx = 0,
|
sx = 0,
|
||||||
sy = 0,
|
sy = 0,
|
||||||
sw = getWidth(drawable),
|
sw = drawable.width,
|
||||||
sh = getHeight(drawable),
|
sh = drawable.height,
|
||||||
} = opts;
|
} = opts;
|
||||||
|
|
||||||
// Make canvas same size as image
|
// Make canvas same size as image
|
||||||
|
|||||||
@@ -10,8 +10,6 @@
|
|||||||
* See the License for the specific language governing permissions and
|
* See the License for the specific language governing permissions and
|
||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import * as WebCodecs from '../util/web-codecs';
|
|
||||||
import { drawableToImageData } from './canvas';
|
import { drawableToImageData } from './canvas';
|
||||||
|
|
||||||
/** If render engine is Safari */
|
/** If render engine is Safari */
|
||||||
@@ -139,15 +137,7 @@ export async function blobToImg(blob: Blob): Promise<HTMLImageElement> {
|
|||||||
export async function builtinDecode(
|
export async function builtinDecode(
|
||||||
signal: AbortSignal,
|
signal: AbortSignal,
|
||||||
blob: Blob,
|
blob: Blob,
|
||||||
mimeType: string,
|
|
||||||
): Promise<ImageData> {
|
): Promise<ImageData> {
|
||||||
// If WebCodecs are supported, use that.
|
|
||||||
if (await WebCodecs.isTypeSupported(mimeType)) {
|
|
||||||
assertSignal(signal);
|
|
||||||
try {
|
|
||||||
return await abortable(signal, WebCodecs.decode(blob, mimeType));
|
|
||||||
} catch (e) {}
|
|
||||||
}
|
|
||||||
assertSignal(signal);
|
assertSignal(signal);
|
||||||
|
|
||||||
// Prefer createImageBitmap as it's the off-thread option for Firefox.
|
// Prefer createImageBitmap as it's the off-thread option for Firefox.
|
||||||
|
|||||||
@@ -1,33 +0,0 @@
|
|||||||
import { drawableToImageData } from '../canvas';
|
|
||||||
|
|
||||||
const hasImageDecoder = typeof ImageDecoder !== 'undefined';
|
|
||||||
|
|
||||||
export async function isTypeSupported(mimeType: string): Promise<boolean> {
|
|
||||||
if (!hasImageDecoder) return false;
|
|
||||||
// Some old versions of this API threw here.
|
|
||||||
// It only impacted folks with experimental web platform flags enabled in Chrome 90.
|
|
||||||
// The API was updated in Chrome 91.
|
|
||||||
try {
|
|
||||||
return await ImageDecoder.isTypeSupported(mimeType);
|
|
||||||
} catch (err) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export async function decode(
|
|
||||||
blob: Blob | File,
|
|
||||||
mimeType: string,
|
|
||||||
): Promise<ImageData> {
|
|
||||||
if (!hasImageDecoder) {
|
|
||||||
throw Error(
|
|
||||||
`This browser does not support ImageDecoder. This function should not have been called.`,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
const decoder = new ImageDecoder({
|
|
||||||
type: mimeType,
|
|
||||||
// Non-obvious way to turn an Blob into a ReadableStream
|
|
||||||
data: new Response(blob).body!,
|
|
||||||
});
|
|
||||||
const { image } = await decoder.decode();
|
|
||||||
return drawableToImageData(image);
|
|
||||||
}
|
|
||||||
@@ -1,60 +0,0 @@
|
|||||||
interface ImageDecoderInit {
|
|
||||||
type: string;
|
|
||||||
data: BufferSource | ReadableStream;
|
|
||||||
premultiplyAlpha?: PremultiplyAlpha;
|
|
||||||
colorSpaceConversion?: ColorSpaceConversion;
|
|
||||||
desiredWidth?: number;
|
|
||||||
desiredHeight?: number;
|
|
||||||
preferAnimation?: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface ImageDecodeOptions {
|
|
||||||
frameIndex: number;
|
|
||||||
completeFramesOnly: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface ImageDecodeResult {
|
|
||||||
image: VideoFrame;
|
|
||||||
complete: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
// I didn’t do all the types because the class is kinda complex.
|
|
||||||
// I focused on what we need.
|
|
||||||
// See https://w3c.github.io/webcodecs/#videoframe
|
|
||||||
declare class VideoFrame {
|
|
||||||
displayWidth: number;
|
|
||||||
displayHeight: number;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Add VideoFrame to canvas’ drawImage()
|
|
||||||
interface CanvasDrawImage {
|
|
||||||
drawImage(
|
|
||||||
image: CanvasImageSource | VideoFrame,
|
|
||||||
dx: number,
|
|
||||||
dy: number,
|
|
||||||
): void;
|
|
||||||
drawImage(
|
|
||||||
image: CanvasImageSource | VideoFrame,
|
|
||||||
dx: number,
|
|
||||||
dy: number,
|
|
||||||
dw: number,
|
|
||||||
dh: number,
|
|
||||||
): void;
|
|
||||||
drawImage(
|
|
||||||
image: CanvasImageSource | VideoFrame,
|
|
||||||
sx: number,
|
|
||||||
sy: number,
|
|
||||||
sw: number,
|
|
||||||
sh: number,
|
|
||||||
dx: number,
|
|
||||||
dy: number,
|
|
||||||
dw: number,
|
|
||||||
dh: number,
|
|
||||||
): void;
|
|
||||||
}
|
|
||||||
|
|
||||||
declare class ImageDecoder {
|
|
||||||
static isTypeSupported(type: string): Promise<boolean>;
|
|
||||||
constructor(desc: ImageDecoderInit);
|
|
||||||
decode(opts?: Partial<ImageDecodeOptions>): Promise<ImageDecodeResult>;
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user