ryan/squoosh
1
0
Fork 0
forked from external-repos/squoosh
Code Pull Requests Activity

Remove baseline image decoders, refactor decodeFile

Browse Source
This commit is contained in:
Surma
2018-07-16 15:18:59 +01:00
parent 0f08121596
commit b7c223bc0d
6 changed files with 33 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/codecs/browser-jpeg/decoder.ts
View File

@@ -1,18 +0,0 @@
import { canDecodeImage, fileToBitmap } from '../../lib/util';
export const name = 'Browser JPEG Decoder';
export const supportedMimeTypes = ['image/jpeg'];
export async function decode(file: File): Promise<ImageBitmap> {
return fileToBitmap(file);
}
// tslint:disable-next-line:max-line-length It’s a data URL. Whatcha gonna do?
const jpegFile = 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAMCAgICAgMCAgIDAwMDBAYEBAQEBAgGBgUGCQgKCgkICQkKDA8MCgsOCwkJDRENDg8QEBEQCgwSExIQEw8QEBD/2wBDAQMDAwQDBAgEBAgQCwkLEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBD/wAARCAABAAEDASIAAhEBAxEB/8QAFQABAQAAAAAAAAAAAAAAAAAAAAn/xAAUEAEAAAAAAAAAAAAAAAAAAAAA/8QAFAEBAAAAAAAAAAAAAAAAAAAAAP/EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDEQA/AJVAA//Z';
export function isSupported(): Promise<boolean> {
return canDecodeImage(jpegFile);
}
export function canHandleMimeType(mimeType: string): boolean {
return supportedMimeTypes.includes(mimeType);
}

18
src/codecs/browser-png/decoder.ts
View File

@@ -1,18 +0,0 @@
import { canDecodeImage, fileToBitmap } from '../../lib/util';
export const name = 'Browser PNG Decoder';
export const supportedMimeTypes = ['image/png'];
export async function decode(file: File): Promise<ImageBitmap> {
return fileToBitmap(file);
}
// tslint:disable-next-line:max-line-length It’s a data URL. Whatcha gonna do?
const pngFile = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQYV2NgAAIAAAUAAarVyFEAAAAASUVORK5CYII=';
export function isSupported(): Promise<boolean> {
return canDecodeImage(pngFile);
}
export function canHandleMimeType(mimeType: string): boolean {
return supportedMimeTypes.includes(mimeType);
}

4
src/codecs/browser-webp/decoder.ts
View File

@@ -1,9 +1,9 @@
import { canDecodeImage, fileToBitmap } from '../../lib/util';
import { canDecodeImage, createImageBitmapPolyfill } from '../../lib/util';
export const name = 'Browser WebP Decoder';
export const supportedMimeTypes = ['image/webp'];
export async function decode(file: File): Promise<ImageBitmap> {
return fileToBitmap(file);
return createImageBitmapPolyfill(file);
}
// tslint:disable-next-line:max-line-length It’s a data URL. Whatcha gonna do?

32
src/codecs/decoders.ts
View File

@@ -1,9 +1,7 @@
import * as browserJPEG from './browser-jpeg/decoder';
import * as browserPNG from './browser-png/decoder';
import * as browserWebP from './browser-webp/decoder';
import * as wasmWebP from './webp/decoder';
import * as browserWebP from './browser-webp/decoder';
import { sniffMimeType } from '../lib/util';
import { createImageBitmapPolyfill, sniffMimeType } from '../lib/util';
export interface Decoder {
name: string;
@@ -15,10 +13,8 @@ export interface Decoder {
// We load all decoders and filter out the unsupported ones.
export const decodersPromise: Promise<Decoder[]> = Promise.all(
[
browserPNG,
browserJPEG,
wasmWebP,
browserWebP,
wasmWebP,
]
.map(async (decoder) => {
if (await decoder.isSupported()) {
@@ -38,3 +34,25 @@ export async function findDecoder(file: File): Promise<Decoder | undefined> {
}
return decoders.find(decoder => decoder.canHandleMimeType(mimeType));
}
const nativelySupportedMimeTypes = [
'image/jpeg',
'image/png',
'image/gif',
];
export async function decodeFile(file: File): Promise<ImageBitmap> {
const mimeType = await sniffMimeType(file);
if (!mimeType) {
throw new Error('Could not determine mime type');
}
if (nativelySupportedMimeTypes.includes(mimeType)) {
return createImageBitmapPolyfill(file);
}
const decoder = await findDecoder(file);
if (!decoder) {
throw new Error(`Can’t decode files with mime type ${mimeType}`);
}
console.log(`Going with ${decoder.name}`);
return decoder.decode(file);
}

8
src/components/App/index.tsx
View File

@@ -26,7 +26,7 @@ import {
encoderMap,
} from '../../codecs/encoders';
import { findDecoder } from '../../codecs/decoders';
import { decodeFile } from '../../codecs/decoders';
interface SourceImage {
file: File;
@@ -180,11 +180,7 @@ export default class App extends Component<Props, State> {
async updateFile(file: File) {
this.setState({ loading: true });
try {
const decoder = await findDecoder(file);
if (!decoder) {
throw new Error('Can’t find a decoder for the given file');
}
const bmp = await decoder.decode(file);
const bmp = await decodeFile(file);
// compute the corresponding ImageData once since it only changes when the file changes:
const data = await bitmapToImageData(bmp);

8
src/lib/util.ts
View File

@@ -105,10 +105,6 @@ export function canDecodeImage(data: string): Promise<boolean> {
});
}
export function fileToBitmap(file: File): Promise<ImageBitmap> {
return createImageBitmap(file);
}
export function blobToArrayBuffer(blob: Blob): Promise<ArrayBuffer> {
return new Promise((resolve) => {
const fileReader = new FileReader();
@@ -143,3 +139,7 @@ export async function sniffMimeType(blob: Blob): Promise<string | undefined> {
}
}
}
export function createImageBitmapPolyfill(blob: Blob): Promise<ImageBitmap> {
return createImageBitmap(blob);
}