From 6bfce29af61fad344a56d74b862a24fc8cec18ce Mon Sep 17 00:00:00 2001 From: ergunsh Date: Fri, 10 Sep 2021 14:08:21 +0200 Subject: [PATCH 1/9] Improve typing of `Image.encode` Instead of returning `any` we're now returning the whole object. Still from typing perspective, the API is not that great since we don't have any type relation between `encode` calls and `encodedWith` property. Maybe we can think about returning directly from `encode` call with the returned object having properties that is supplied in `encode` calls --- libsquoosh/src/index.ts | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/libsquoosh/src/index.ts b/libsquoosh/src/index.ts index bfd3bac1..cc4fe1af 100644 --- a/libsquoosh/src/index.ts +++ b/libsquoosh/src/index.ts @@ -26,6 +26,12 @@ type PreprocessOptions = { quant?: QuantOptions; rotate?: RotateOptions; }; +type EncodeResult = { + optionsUsed: object; + binary: Uint8Array; + extension: string; + size: number; +}; async function decodeFile({ file, @@ -83,7 +89,7 @@ async function encodeImage({ encConfig: any; optimizerButteraugliTarget: number; maxOptimizerRounds: number; -}) { +}): Promise { let binary: Uint8Array; let optionsUsed = encConfig; const encoder = await encoders[encName].enc(); @@ -172,7 +178,7 @@ class Image { public file: ArrayBuffer | ArrayLike; public workerPool: WorkerPool; public decoded: Promise<{ bitmap: ImageData }>; - public encodedWith: { [key: string]: any }; + public encodedWith: { [key in EncoderKey]?: Promise }; constructor( workerPool: WorkerPool, From 914cdea41db9a6e844d7f38c06445b43bcf22df0 Mon Sep 17 00:00:00 2001 From: ergunsh Date: Fri, 10 Sep 2021 14:45:20 +0200 Subject: [PATCH 2/9] Return encode result from `Image.encode` calls Before this, there were one way to use the API: call `await image.encode({ mozjpeg: {} })` then use `encodedWith` by asserting that `mozjpeg` property exists on it After adding return value to encode, people will be able to use it like `const { mozjpeg } = await image.encode({ mozjpeg: {} });` which provides better type safety --- libsquoosh/src/index.ts | 22 ++++++++++++---------- 1 file changed, 12 insertions(+), 10 deletions(-) diff --git a/libsquoosh/src/index.ts b/libsquoosh/src/index.ts index cc4fe1af..04792394 100644 --- a/libsquoosh/src/index.ts +++ b/libsquoosh/src/index.ts @@ -32,6 +32,14 @@ type EncodeResult = { extension: string; size: number; }; +type EncoderOptions = { + mozjpeg?: Partial; + webp?: Partial; + avif?: Partial; + jxl?: Partial; + wp2?: Partial; + oxipng?: Partial; +}; async function decodeFile({ file, @@ -221,19 +229,12 @@ class Image { * @param {object} encodeOptions - An object with encoders to use, and their settings. * @returns {Promise} - A promise that resolves when the image has been encoded with all the specified encoders. */ - async encode( + async encode( encodeOptions: { optimizerButteraugliTarget?: number; maxOptimizerRounds?: number; - } & { - mozjpeg?: Partial; - webp?: Partial; - avif?: Partial; - jxl?: Partial; - wp2?: Partial; - oxipng?: Partial; - } = {}, - ): Promise { + } & T, + ): Promise<{ [key in keyof T]: EncodeResult }> { const { bitmap } = await this.decoded; for (const [name, options] of Object.entries(encodeOptions)) { if (!Object.keys(encoders).includes(name)) { @@ -257,6 +258,7 @@ class Image { }); } await Promise.all(Object.values(this.encodedWith)); + return this.encodedWith as { [key in keyof T]: EncodeResult }; } } From 95a1b35c917f964d0419e8105954c09ab22e4aaf Mon Sep 17 00:00:00 2001 From: ergunsh Date: Fri, 10 Sep 2021 15:18:14 +0200 Subject: [PATCH 3/9] Update `encodedWith` to contain resolved values We already await the promises that we set on the `encodedWith` instead of setting already resolved promises to `encodedWith` we can set the resolved values So, the users can use like `const { mozjpeg: { binary } } = await image.encode({ mozjpeg })` or they can first run `await image.encode({ mozjpeg })` and then `image.encodedWith.mozjpeg.binary` --- libsquoosh/src/index.ts | 34 +++++++++++++++++++++------------- 1 file changed, 21 insertions(+), 13 deletions(-) diff --git a/libsquoosh/src/index.ts b/libsquoosh/src/index.ts index 04792394..8ed7e01b 100644 --- a/libsquoosh/src/index.ts +++ b/libsquoosh/src/index.ts @@ -186,7 +186,7 @@ class Image { public file: ArrayBuffer | ArrayLike; public workerPool: WorkerPool; public decoded: Promise<{ bitmap: ImageData }>; - public encodedWith: { [key in EncoderKey]?: Promise }; + public encodedWith: { [key in EncoderKey]?: EncodeResult }; constructor( workerPool: WorkerPool, @@ -227,7 +227,7 @@ class Image { /** * Define one or several encoders to use on the image. * @param {object} encodeOptions - An object with encoders to use, and their settings. - * @returns {Promise} - A promise that resolves when the image has been encoded with all the specified encoders. + * @returns {Promise<{ [key in keyof T]: EncodeResult }>} - A promise that resolves when the image has been encoded with all the specified encoders. */ async encode( encodeOptions: { @@ -236,6 +236,7 @@ class Image { } & T, ): Promise<{ [key in keyof T]: EncodeResult }> { const { bitmap } = await this.decoded; + const setEncodedWithPromises = []; for (const [name, options] of Object.entries(encodeOptions)) { if (!Object.keys(encoders).includes(name)) { continue; @@ -246,18 +247,25 @@ class Image { typeof options === 'string' ? options : Object.assign({}, encRef.defaultEncoderOptions, options); - this.encodedWith[encName] = this.workerPool.dispatchJob({ - operation: 'encode', - bitmap, - encName, - encConfig, - optimizerButteraugliTarget: Number( - encodeOptions.optimizerButteraugliTarget ?? 1.4, - ), - maxOptimizerRounds: Number(encodeOptions.maxOptimizerRounds ?? 6), - }); + setEncodedWithPromises.push( + this.workerPool + .dispatchJob({ + operation: 'encode', + bitmap, + encName, + encConfig, + optimizerButteraugliTarget: Number( + encodeOptions.optimizerButteraugliTarget ?? 1.4, + ), + maxOptimizerRounds: Number(encodeOptions.maxOptimizerRounds ?? 6), + }) + .then((encodeResult) => { + this.encodedWith[encName] = encodeResult; + }), + ); } - await Promise.all(Object.values(this.encodedWith)); + + await Promise.all(setEncodedWithPromises); return this.encodedWith as { [key in keyof T]: EncodeResult }; } } From cad09160b6f45ac7ca59c28669c349c5b679def3 Mon Sep 17 00:00:00 2001 From: Jake Archibald Date: Mon, 20 Sep 2021 13:49:53 +0100 Subject: [PATCH 4/9] Reducing browser spinner time (#1157) --- lib/data-url-plugin.js | 28 +++++++++++++------ lib/omt.ejs | 15 +++++++--- missing-types.d.ts | 5 ++++ src/client/initial-app/index.tsx | 10 ++++--- .../Intro/imgs/logo-with-text.svg | 11 +------- src/shared/prerendered-app/Intro/index.tsx | 2 +- 6 files changed, 44 insertions(+), 27 deletions(-) diff --git a/lib/data-url-plugin.js b/lib/data-url-plugin.js index cf725d4d..34e9bec9 100644 --- a/lib/data-url-plugin.js +++ b/lib/data-url-plugin.js @@ -14,28 +14,40 @@ import { promises as fs } from 'fs'; import { lookup as lookupMime } from 'mime-types'; -const prefix = 'data-url:'; +const prefix = /^data-url(-text)?:/; export default function dataURLPlugin() { return { name: 'data-url-plugin', async resolveId(id, importer) { - if (!id.startsWith(prefix)) return; + const match = prefix.exec(id); + if (!match) return; return ( - prefix + (await this.resolve(id.slice(prefix.length), importer)).id + match[0] + (await this.resolve(id.slice(match[0].length), importer)).id ); }, async load(id) { - if (!id.startsWith(prefix)) return; - const realId = id.slice(prefix.length); + const match = prefix.exec(id); + if (!match) return; + + const isText = !!match[1]; + const realId = id.slice(match[0].length); this.addWatchFile(realId); const source = await fs.readFile(realId); const type = lookupMime(realId) || 'text/plain'; - return `export default 'data:${type};base64,${source.toString( - 'base64', - )}';`; + if (isText) { + const encodedBody = encodeURIComponent(source.toString('utf8')); + + return `export default ${JSON.stringify( + `data:${type};charset=utf-8,${encodedBody}`, + )};`; + } + + return `export default ${JSON.stringify( + `data:${type};base64,${source.toString('base64')}`, + )};`; }, }; } diff --git a/lib/omt.ejs b/lib/omt.ejs index 93c5a484..2fb71493 100644 --- a/lib/omt.ejs +++ b/lib/omt.ejs @@ -28,10 +28,17 @@ if (!self.<%- amdFunctionName %>) { <% } else { %> new Promise(resolve => { if ("document" in self) { - const script = document.createElement("script"); - script.src = uri; - script.onload = resolve; - document.head.appendChild(script); + const link = document.createElement("link"); + link.rel = "preload"; + link.as = "script"; + link.href = uri; + link.onload = () => { + const script = document.createElement("script"); + script.src = uri; + script.onload = resolve; + document.head.appendChild(script); + }; + document.head.appendChild(link); } else { self.nextDefineUri = uri; importScripts(uri); diff --git a/missing-types.d.ts b/missing-types.d.ts index 2adaaa15..b13952e1 100644 --- a/missing-types.d.ts +++ b/missing-types.d.ts @@ -44,6 +44,11 @@ declare module 'data-url:*' { export default url; } +declare module 'data-url-text:*' { + const url: string; + export default url; +} + declare module 'service-worker:*' { const url: string; export default url; diff --git a/src/client/initial-app/index.tsx b/src/client/initial-app/index.tsx index c81affc4..3f387cee 100644 --- a/src/client/initial-app/index.tsx +++ b/src/client/initial-app/index.tsx @@ -37,8 +37,10 @@ main(); ga('set', 'transport', 'beacon'); ga('set', 'dimension1', displayMode); ga('send', 'pageview', '/index.html', { title: 'Squoosh' }); - // Load the GA script - const script = document.createElement('script'); - script.src = 'https://www.google-analytics.com/analytics.js'; - document.head.appendChild(script); + // Load the GA script without keeping the browser spinner going. + addEventListener('load', () => { + const script = document.createElement('script'); + script.src = 'https://www.google-analytics.com/analytics.js'; + document.head.appendChild(script); + }); } diff --git a/src/shared/prerendered-app/Intro/imgs/logo-with-text.svg b/src/shared/prerendered-app/Intro/imgs/logo-with-text.svg index b4cfbec6..a9aa929e 100644 --- a/src/shared/prerendered-app/Intro/imgs/logo-with-text.svg +++ b/src/shared/prerendered-app/Intro/imgs/logo-with-text.svg @@ -1,10 +1 @@ - - -Squoosh +Squoosh diff --git a/src/shared/prerendered-app/Intro/index.tsx b/src/shared/prerendered-app/Intro/index.tsx index b777a4e3..84c11e45 100644 --- a/src/shared/prerendered-app/Intro/index.tsx +++ b/src/shared/prerendered-app/Intro/index.tsx @@ -14,7 +14,7 @@ import smallSectionAsset from 'url:./imgs/info-content/small.svg'; import simpleSectionAsset from 'url:./imgs/info-content/simple.svg'; import secureSectionAsset from 'url:./imgs/info-content/secure.svg'; import logoIcon from 'url:./imgs/demos/icon-demo-logo.png'; -import logoWithText from 'url:./imgs/logo-with-text.svg'; +import logoWithText from 'data-url-text:./imgs/logo-with-text.svg'; import * as style from './style.css'; import type SnackBarElement from 'shared/custom-els/snack-bar'; import 'shared/custom-els/snack-bar'; From e3f840c6dafc7632011d465dd116c72aba6bc612 Mon Sep 17 00:00:00 2001 From: Vignesh Raj <53948153+vigneshrajj@users.noreply.github.com> Date: Fri, 15 Oct 2021 16:22:13 +0530 Subject: [PATCH 5/9] Added Apple touch Icon for PWA (#1160) --- src/static-build/pages/index/index.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/static-build/pages/index/index.tsx b/src/static-build/pages/index/index.tsx index 24004137..109c8e36 100644 --- a/src/static-build/pages/index/index.tsx +++ b/src/static-build/pages/index/index.tsx @@ -57,6 +57,7 @@ const Index: FunctionalComponent = () => ( + From f523a07f011c58ee2f93f241df0e803c06192f5a Mon Sep 17 00:00:00 2001 From: Tim van der Lippe Date: Wed, 20 Oct 2021 11:36:27 +0100 Subject: [PATCH 6/9] Update TypeScript and types packages This pulls in TypeScript 4.4, which ships ResizeObserver in the DOM types, as well as sets caught errors to `unknown`, requiring explicit checks for `AbortError`. --- package-lock.json | 42 +++++++++---------- package.json | 6 +-- src/client/lazy-app/Compress/index.tsx | 10 ++--- src/shared/missing-types.d.ts | 21 ---------- .../prerendered-app/Intro/missing-types.d.ts | 5 --- 5 files changed, 29 insertions(+), 55 deletions(-) diff --git a/package-lock.json b/package-lock.json index cad3c5f8..aff18309 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,8 +16,8 @@ "@rollup/plugin-replace": "^2.3.4", "@surma/rollup-plugin-off-main-thread": "^2.2.2", "@types/dedent": "^0.7.0", - "@types/mime-types": "^2.1.0", - "@types/node": "^14.14.7", + "@types/mime-types": "^2.1.1", + "@types/node": "^16.11.1", "@web/rollup-plugin-import-meta-assets": "^1.0.6", "comlink": "^4.3.0", "cssnano": "^4.1.10", @@ -44,7 +44,7 @@ "rollup": "^2.38.0", "rollup-plugin-terser": "^7.0.2", "serve": "^11.3.2", - "typescript": "^4.1.3", + "typescript": "^4.4.4", "which": "^2.0.2" } }, @@ -315,9 +315,9 @@ } }, "node_modules/@types/mime-types": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@types/mime-types/-/mime-types-2.1.0.tgz", - "integrity": "sha1-nKUs2jY/aZxpRmwqbM2q2RPqenM=", + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/@types/mime-types/-/mime-types-2.1.1.tgz", + "integrity": "sha512-vXOTGVSLR2jMw440moWTC7H19iUyLtP3Z1YTj7cSsubOICinjMxFeb/V57v9QdyyPGbbWolUFSSmSiRSn94tFw==", "dev": true }, "node_modules/@types/minimatch": { @@ -327,9 +327,9 @@ "dev": true }, "node_modules/@types/node": { - "version": "14.14.7", - "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.7.tgz", - "integrity": "sha512-Zw1vhUSQZYw+7u5dAwNbIA9TuTotpzY/OF7sJM9FqPOF3SPjKnxrjoTktXDZgUjybf4cWVBP7O8wvKdSaGHweg==", + "version": "16.11.1", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.1.tgz", + "integrity": "sha512-PYGcJHL9mwl1Ek3PLiYgyEKtwTMmkMw4vbiyz/ps3pfdRYLVv+SN7qHVAImrjdAXxgluDEw6Ph4lyv+m9UpRmA==", "dev": true }, "node_modules/@types/parse-json": { @@ -8602,9 +8602,9 @@ } }, "node_modules/typescript": { - "version": "4.1.3", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.1.3.tgz", - "integrity": "sha512-B3ZIOf1IKeH2ixgHhj6la6xdwR9QrLC5d1VKeCSY4tvkqhF2eqd9O7txNlS0PO3GrBAFIdr3L1ndNwteUbZLYg==", + "version": "4.4.4", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.4.4.tgz", + "integrity": "sha512-DqGhF5IKoBl8WNf8C1gu8q0xZSInh9j1kJJMqT3a94w1JzVaBU4EXOSMrz9yDqMT0xt3selp83fuFMQ0uzv6qA==", "dev": true, "bin": { "tsc": "bin/tsc", @@ -9040,9 +9040,9 @@ } }, "@types/mime-types": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@types/mime-types/-/mime-types-2.1.0.tgz", - "integrity": "sha1-nKUs2jY/aZxpRmwqbM2q2RPqenM=", + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/@types/mime-types/-/mime-types-2.1.1.tgz", + "integrity": "sha512-vXOTGVSLR2jMw440moWTC7H19iUyLtP3Z1YTj7cSsubOICinjMxFeb/V57v9QdyyPGbbWolUFSSmSiRSn94tFw==", "dev": true }, "@types/minimatch": { @@ -9052,9 +9052,9 @@ "dev": true }, "@types/node": { - "version": "14.14.7", - "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.7.tgz", - "integrity": "sha512-Zw1vhUSQZYw+7u5dAwNbIA9TuTotpzY/OF7sJM9FqPOF3SPjKnxrjoTktXDZgUjybf4cWVBP7O8wvKdSaGHweg==", + "version": "16.11.1", + "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.1.tgz", + "integrity": "sha512-PYGcJHL9mwl1Ek3PLiYgyEKtwTMmkMw4vbiyz/ps3pfdRYLVv+SN7qHVAImrjdAXxgluDEw6Ph4lyv+m9UpRmA==", "dev": true }, "@types/parse-json": { @@ -15917,9 +15917,9 @@ "dev": true }, "typescript": { - "version": "4.1.3", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.1.3.tgz", - "integrity": "sha512-B3ZIOf1IKeH2ixgHhj6la6xdwR9QrLC5d1VKeCSY4tvkqhF2eqd9O7txNlS0PO3GrBAFIdr3L1ndNwteUbZLYg==", + "version": "4.4.4", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.4.4.tgz", + "integrity": "sha512-DqGhF5IKoBl8WNf8C1gu8q0xZSInh9j1kJJMqT3a94w1JzVaBU4EXOSMrz9yDqMT0xt3selp83fuFMQ0uzv6qA==", "dev": true }, "uniq": { diff --git a/package.json b/package.json index e381c971..953b7b90 100644 --- a/package.json +++ b/package.json @@ -16,8 +16,8 @@ "@rollup/plugin-replace": "^2.3.4", "@surma/rollup-plugin-off-main-thread": "^2.2.2", "@types/dedent": "^0.7.0", - "@types/mime-types": "^2.1.0", - "@types/node": "^14.14.7", + "@types/mime-types": "^2.1.1", + "@types/node": "^16.11.1", "@web/rollup-plugin-import-meta-assets": "^1.0.6", "comlink": "^4.3.0", "cssnano": "^4.1.10", @@ -44,7 +44,7 @@ "rollup": "^2.38.0", "rollup-plugin-terser": "^7.0.2", "serve": "^11.3.2", - "typescript": "^4.1.3", + "typescript": "^4.4.4", "which": "^2.0.2" }, "husky": { diff --git a/src/client/lazy-app/Compress/index.tsx b/src/client/lazy-app/Compress/index.tsx index a7d7464a..5c37caae 100644 --- a/src/client/lazy-app/Compress/index.tsx +++ b/src/client/lazy-app/Compress/index.tsx @@ -116,7 +116,7 @@ async function decodeImage( // Otherwise fall through and try built-in decoding for a laugh. return await builtinDecode(signal, blob, mimeType); } catch (err) { - if (err.name === 'AbortError') throw err; + if (err instanceof Error && err.name === 'AbortError') throw err; console.log(err); throw Error("Couldn't decode image"); } @@ -481,7 +481,7 @@ export default class Compress extends Component { open('https://github.com/GoogleChromeLabs/squoosh/tree/dev/cli'); } } catch (e) { - this.props.showSnack(e); + this.props.showSnack(String(e)); } }; @@ -640,7 +640,7 @@ export default class Compress extends Component { return { sides }; }); } catch (err) { - if (err.name === 'AbortError') return; + if (err instanceof Error && err.name === 'AbortError') return; this.props.showSnack(`Source decoding error: ${err}`); throw err; } @@ -698,7 +698,7 @@ export default class Compress extends Component { return newState; }); } catch (err) { - if (err.name === 'AbortError') return; + if (err instanceof Error && err.name === 'AbortError') return; this.setState({ loading: false }); this.props.showSnack(`Preprocessing error: ${err}`); throw err; @@ -822,7 +822,7 @@ export default class Compress extends Component { this.activeSideJobs[sideIndex] = undefined; } catch (err) { - if (err.name === 'AbortError') return; + if (err instanceof Error && err.name === 'AbortError') return; this.setState((currentState) => { const sides = cleanMerge(currentState.sides, sideIndex, { loading: false, diff --git a/src/shared/missing-types.d.ts b/src/shared/missing-types.d.ts index 0320ec90..baf404ec 100644 --- a/src/shared/missing-types.d.ts +++ b/src/shared/missing-types.d.ts @@ -13,24 +13,3 @@ /// declare const __PRERENDER__: boolean; - -type ResizeObserverCallback = ( - entries: ResizeObserverEntry[], - observer: ResizeObserver, -) => void; - -interface ResizeObserverEntry { - readonly target: Element; - readonly contentRect: DOMRectReadOnly; -} - -interface ResizeObserver { - observe(target: Element): void; - unobserve(target: Element): void; - disconnect(): void; -} - -declare var ResizeObserver: { - prototype: ResizeObserver; - new (callback: ResizeObserverCallback): ResizeObserver; -}; diff --git a/src/shared/prerendered-app/Intro/missing-types.d.ts b/src/shared/prerendered-app/Intro/missing-types.d.ts index 6ef3d345..bf077eb8 100644 --- a/src/shared/prerendered-app/Intro/missing-types.d.ts +++ b/src/shared/prerendered-app/Intro/missing-types.d.ts @@ -30,11 +30,6 @@ interface WindowEventMap { beforeinstallprompt: BeforeInstallPromptEvent; } -interface ClipboardItem { - types: string[]; - getType(type: string): Promise; -} - interface Clipboard { read(): Promise; } From e23bc4d2e5ea43aa9e6725abeee5f6d12a333b3d Mon Sep 17 00:00:00 2001 From: Tim van der Lippe Date: Wed, 20 Oct 2021 12:21:56 +0100 Subject: [PATCH 7/9] Update Prettier Also manually run prettier on `src/` and `lib/` to ensure consistent formatting. --- lib/entry-data-plugin.js | 4 ++- package-lock.json | 14 ++++---- package.json | 2 +- .../lazy-app/Compress/Options/index.tsx | 31 +++++++++--------- .../encoders/oxiPNG/worker/oxipngEncode.ts | 8 +++-- .../custom-els/loading-spinner/index.ts | 4 +-- src/shared/custom-els/snack-bar/index.ts | 4 +-- src/sw/to-cache.ts | 32 ++++++++----------- 8 files changed, 49 insertions(+), 50 deletions(-) diff --git a/lib/entry-data-plugin.js b/lib/entry-data-plugin.js index f4bc86c5..d131e1ae 100644 --- a/lib/entry-data-plugin.js +++ b/lib/entry-data-plugin.js @@ -77,7 +77,9 @@ export default function entryDataPlugin() { } return JSON.stringify( - getDependencies(chunks, chunk).map((filename) => fileNameToURL(filename)), + getDependencies(chunks, chunk).map((filename) => + fileNameToURL(filename), + ), ); }, ); diff --git a/package-lock.json b/package-lock.json index cad3c5f8..8cbcdd20 100644 --- a/package-lock.json +++ b/package-lock.json @@ -40,7 +40,7 @@ "postcss-url": "^8.0.0", "preact": "^10.5.5", "preact-render-to-string": "^5.1.11", - "prettier": "^2.1.2", + "prettier": "^2.4.1", "rollup": "^2.38.0", "rollup-plugin-terser": "^7.0.2", "serve": "^11.3.2", @@ -7529,9 +7529,9 @@ } }, "node_modules/prettier": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.1.2.tgz", - "integrity": "sha512-16c7K+x4qVlJg9rEbXl7HEGmQyZlG4R9AgP+oHKRMsMsuk8s+ATStlf1NpDqyBI1HpVyfjLOeMhH2LvuNvV5Vg==", + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.4.1.tgz", + "integrity": "sha512-9fbDAXSBcc6Bs1mZrDYb3XKzDLm4EXXL9sC1LqKP5rZkT6KRr/rf9amVUcODVXgguK/isJz0d0hP72WeaKWsvA==", "dev": true, "bin": { "prettier": "bin-prettier.js" @@ -15029,9 +15029,9 @@ } }, "prettier": { - "version": "2.1.2", - "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.1.2.tgz", - "integrity": "sha512-16c7K+x4qVlJg9rEbXl7HEGmQyZlG4R9AgP+oHKRMsMsuk8s+ATStlf1NpDqyBI1HpVyfjLOeMhH2LvuNvV5Vg==", + "version": "2.4.1", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.4.1.tgz", + "integrity": "sha512-9fbDAXSBcc6Bs1mZrDYb3XKzDLm4EXXL9sC1LqKP5rZkT6KRr/rf9amVUcODVXgguK/isJz0d0hP72WeaKWsvA==", "dev": true }, "pretty-format": { diff --git a/package.json b/package.json index e381c971..701cc340 100644 --- a/package.json +++ b/package.json @@ -40,7 +40,7 @@ "postcss-url": "^8.0.0", "preact": "^10.5.5", "preact-render-to-string": "^5.1.11", - "prettier": "^2.1.2", + "prettier": "^2.4.1", "rollup": "^2.38.0", "rollup-plugin-terser": "^7.0.2", "serve": "^11.3.2", diff --git a/src/client/lazy-app/Compress/Options/index.tsx b/src/client/lazy-app/Compress/Options/index.tsx index 7f531098..3c23e4dc 100644 --- a/src/client/lazy-app/Compress/Options/index.tsx +++ b/src/client/lazy-app/Compress/Options/index.tsx @@ -40,24 +40,23 @@ type PartialButNotUndefined = { [P in keyof T]: T[P]; }; -const supportedEncoderMapP: Promise> = (async () => { - const supportedEncoderMap: PartialButNotUndefined = { - ...encoderMap, - }; +const supportedEncoderMapP: Promise> = + (async () => { + const supportedEncoderMap: PartialButNotUndefined = { + ...encoderMap, + }; - // Filter out entries where the feature test fails - await Promise.all( - Object.entries(encoderMap).map(async ([encoderName, details]) => { - if ('featureTest' in details && !(await details.featureTest())) { - delete supportedEncoderMap[encoderName as keyof typeof encoderMap]; - } - }), - ); + // Filter out entries where the feature test fails + await Promise.all( + Object.entries(encoderMap).map(async ([encoderName, details]) => { + if ('featureTest' in details && !(await details.featureTest())) { + delete supportedEncoderMap[encoderName as keyof typeof encoderMap]; + } + }), + ); - return supportedEncoderMap; -})(); + return supportedEncoderMap; + })(); export default class Options extends Component { state: State = { diff --git a/src/features/encoders/oxiPNG/worker/oxipngEncode.ts b/src/features/encoders/oxiPNG/worker/oxipngEncode.ts index c71525ea..e047ed77 100644 --- a/src/features/encoders/oxiPNG/worker/oxipngEncode.ts +++ b/src/features/encoders/oxiPNG/worker/oxipngEncode.ts @@ -14,9 +14,11 @@ import { EncodeOptions } from '../shared/meta'; import { threads } from 'wasm-feature-detect'; async function initMT() { - const { default: init, initThreadPool, optimise } = await import( - 'codecs/oxipng/pkg-parallel/squoosh_oxipng' - ); + const { + default: init, + initThreadPool, + optimise, + } = await import('codecs/oxipng/pkg-parallel/squoosh_oxipng'); await init(); await initThreadPool(navigator.hardwareConcurrency); return optimise; diff --git a/src/shared/custom-els/loading-spinner/index.ts b/src/shared/custom-els/loading-spinner/index.ts index 2985b6d9..7cd1bb6f 100644 --- a/src/shared/custom-els/loading-spinner/index.ts +++ b/src/shared/custom-els/loading-spinner/index.ts @@ -2,9 +2,9 @@ import * as styles from './styles.css'; import 'add-css:./styles.css'; // So it doesn't cause an error when running in node -const HTMLEl = ((__PRERENDER__ +const HTMLEl = (__PRERENDER__ ? Object - : HTMLElement) as unknown) as typeof HTMLElement; + : HTMLElement) as unknown as typeof HTMLElement; /** * A simple spinner. This custom element has no JS API. Just put it in the document, and it'll diff --git a/src/shared/custom-els/snack-bar/index.ts b/src/shared/custom-els/snack-bar/index.ts index f8c5fd25..c844f35a 100644 --- a/src/shared/custom-els/snack-bar/index.ts +++ b/src/shared/custom-els/snack-bar/index.ts @@ -2,9 +2,9 @@ import * as style from './styles.css'; import 'add-css:./styles.css'; // So it doesn't cause an error when running in node -const HTMLEl = ((__PRERENDER__ +const HTMLEl = (__PRERENDER__ ? Object - : HTMLElement) as unknown) as typeof HTMLElement; + : HTMLElement) as unknown as typeof HTMLElement; export interface SnackOptions { timeout?: number; diff --git a/src/sw/to-cache.ts b/src/sw/to-cache.ts index bad10ef0..4f90bb4f 100644 --- a/src/sw/to-cache.ts +++ b/src/sw/to-cache.ts @@ -82,24 +82,20 @@ initialJs = subtractSets( export const initial = ['/', ...initialJs]; export const theRest = (async () => { - const [ - supportsThreads, - supportsSimd, - supportsWebP, - supportsAvif, - ] = await Promise.all([ - threads(), - simd(), - ...[webpDataUrl, avifDataUrl].map(async (dataUrl) => { - if (!self.createImageBitmap) return false; - const response = await fetch(dataUrl); - const blob = await response.blob(); - return createImageBitmap(blob).then( - () => true, - () => false, - ); - }), - ]); + const [supportsThreads, supportsSimd, supportsWebP, supportsAvif] = + await Promise.all([ + threads(), + simd(), + ...[webpDataUrl, avifDataUrl].map(async (dataUrl) => { + if (!self.createImageBitmap) return false; + const response = await fetch(dataUrl); + const blob = await response.blob(); + return createImageBitmap(blob).then( + () => true, + () => false, + ); + }), + ]); const items: string[] = []; From 129b92509884b2f419465f95323c6d533bbb4ec7 Mon Sep 17 00:00:00 2001 From: Tim van der Lippe Date: Wed, 20 Oct 2021 12:43:02 +0100 Subject: [PATCH 8/9] Fix Husky pre-commit By upgrading to version 7, we now ensure that NPM/Yarn will run the `prepare` script and appropriately install Husky. This also migrates us to the `pre-commit` hook as a separate file, rather than as part of the `package.json` definition. --- .husky/pre-commit | 1 + package-lock.json | 272 +++------------------------------------------- package.json | 10 +- 3 files changed, 17 insertions(+), 266 deletions(-) create mode 100755 .husky/pre-commit diff --git a/.husky/pre-commit b/.husky/pre-commit new file mode 100755 index 00000000..2312dc58 --- /dev/null +++ b/.husky/pre-commit @@ -0,0 +1 @@ +npx lint-staged diff --git a/package-lock.json b/package-lock.json index cad3c5f8..165be174 100644 --- a/package-lock.json +++ b/package-lock.json @@ -24,7 +24,7 @@ "dedent": "^0.7.0", "del": "^5.1.0", "file-drop-element": "^1.0.1", - "husky": "^4.3.0", + "husky": "^7.0.2", "idb-keyval": "^3.2.0", "image-size": "^0.9.3", "linkstate": "^2.0.0", @@ -866,12 +866,6 @@ "node": ">=4" } }, - "node_modules/ci-info": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-2.0.0.tgz", - "integrity": "sha512-5tK7EtrZ0N+OLFMthtqOj4fI2Jeb88C4CAZPu25LDVUgXJ0A3Js4PMGqrn0JU1W0Mh1/Z8wZzYPxqUrXeBboCQ==", - "dev": true - }, "node_modules/clean-stack": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/clean-stack/-/clean-stack-2.2.0.tgz", @@ -1176,12 +1170,6 @@ "integrity": "sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs=", "dev": true }, - "node_modules/compare-versions": { - "version": "3.6.0", - "resolved": "https://registry.npmjs.org/compare-versions/-/compare-versions-3.6.0.tgz", - "integrity": "sha512-W6Af2Iw1z4CB7q4uU4hv646dW9GQuBM+YpC0UvUCWSD8w90SJjp+ujJuXaEMtAXBtSqGfMPuFOVn4/+FlaqfBA==", - "dev": true - }, "node_modules/compressible": { "version": "2.0.18", "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz", @@ -2284,31 +2272,6 @@ "node": ">=8" } }, - "node_modules/find-up": { - "version": "4.1.0", - "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz", - "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==", - "dev": true, - "dependencies": { - "locate-path": "^5.0.0", - "path-exists": "^4.0.0" - }, - "engines": { - "node": ">=10" - } - }, - "node_modules/find-versions": { - "version": "3.2.0", - "resolved": "https://registry.npmjs.org/find-versions/-/find-versions-3.2.0.tgz", - "integrity": "sha512-P8WRou2S+oe222TOCHitLy8zj+SIsVJh52VP4lvXkaFVnOFFdoWv1H1Jjvel1aI6NCFOAaeAVm8qrI0odiLcww==", - "dev": true, - "dependencies": { - "semver-regex": "^2.0.0" - }, - "engines": { - "node": ">=10" - } - }, "node_modules/fs.realpath": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", @@ -2485,28 +2448,18 @@ } }, "node_modules/husky": { - "version": "4.3.0", - "resolved": "https://registry.npmjs.org/husky/-/husky-4.3.0.tgz", - "integrity": "sha512-tTMeLCLqSBqnflBZnlVDhpaIMucSGaYyX6855jM4AguGeWCeSzNdb1mfyWduTZ3pe3SJVvVWGL0jO1iKZVPfTA==", + "version": "7.0.2", + "resolved": "https://registry.npmjs.org/husky/-/husky-7.0.2.tgz", + "integrity": "sha512-8yKEWNX4z2YsofXAMT7KvA1g8p+GxtB1ffV8XtpAEGuXNAbCV5wdNKH+qTpw8SM9fh4aMPDR+yQuKfgnreyZlg==", "dev": true, - "dependencies": { - "chalk": "^4.0.0", - "ci-info": "^2.0.0", - "compare-versions": "^3.6.0", - "cosmiconfig": "^7.0.0", - "find-versions": "^3.2.0", - "opencollective-postinstall": "^2.0.2", - "pkg-dir": "^4.2.0", - "please-upgrade-node": "^3.2.0", - "slash": "^3.0.0", - "which-pm-runs": "^1.0.0" - }, "bin": { - "husky-run": "bin/run.js", - "husky-upgrade": "lib/upgrader/bin.js" + "husky": "lib/bin.js" }, "engines": { - "node": ">=10" + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/typicode" } }, "node_modules/icss-replace-symbols": { @@ -3164,18 +3117,6 @@ "node": ">=4.0.0" } }, - "node_modules/locate-path": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz", - "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==", - "dev": true, - "dependencies": { - "p-locate": "^4.1.0" - }, - "engines": { - "node": ">=10" - } - }, "node_modules/lodash.camelcase": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz", @@ -3689,15 +3630,6 @@ "node": ">=6" } }, - "node_modules/opencollective-postinstall": { - "version": "2.0.3", - "resolved": "https://registry.npmjs.org/opencollective-postinstall/-/opencollective-postinstall-2.0.3.tgz", - "integrity": "sha512-8AV/sCtuzUeTo8gQK5qDZzARrulB3egtLzFgteqB2tcT4Mw7B8Kt7JcDHmltjz6FOAHsvTevk70gZEbhM4ZS9Q==", - "dev": true, - "bin": { - "opencollective-postinstall": "index.js" - } - }, "node_modules/p-finally": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz", @@ -3707,30 +3639,6 @@ "node": ">=4" } }, - "node_modules/p-limit": { - "version": "2.3.0", - "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz", - "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==", - "dev": true, - "dependencies": { - "p-try": "^2.0.0" - }, - "engines": { - "node": ">=10" - } - }, - "node_modules/p-locate": { - "version": "4.1.0", - "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz", - "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==", - "dev": true, - "dependencies": { - "p-limit": "^2.2.0" - }, - "engines": { - "node": ">=10" - } - }, "node_modules/p-map": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/p-map/-/p-map-3.0.0.tgz", @@ -3743,15 +3651,6 @@ "node": ">=8" } }, - "node_modules/p-try": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz", - "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==", - "dev": true, - "engines": { - "node": ">=6" - } - }, "node_modules/parent-module": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz", @@ -3779,15 +3678,6 @@ "node": ">=4" } }, - "node_modules/path-exists": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz", - "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==", - "dev": true, - "engines": { - "node": ">=8" - } - }, "node_modules/path-is-absolute": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", @@ -3863,18 +3753,6 @@ "node": ">=4" } }, - "node_modules/pkg-dir": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-4.2.0.tgz", - "integrity": "sha512-HRDzbaKjC+AOWVXxAU/x54COGeIv9eb+6CkDSQoNTt4XyWoIJvuPsXizxu/Fr23EiekbtZwmh1IcIG/l/a10GQ==", - "dev": true, - "dependencies": { - "find-up": "^4.0.0" - }, - "engines": { - "node": ">=10" - } - }, "node_modules/please-upgrade-node": { "version": "3.2.0", "resolved": "https://registry.npmjs.org/please-upgrade-node/-/please-upgrade-node-3.2.0.tgz", @@ -7808,15 +7686,6 @@ "integrity": "sha1-De4hahyUGrN+nvsXiPavxf9VN/w=", "dev": true }, - "node_modules/semver-regex": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/semver-regex/-/semver-regex-2.0.0.tgz", - "integrity": "sha512-mUdIBBvdn0PLOeP3TEkMH7HHeUP3GjsXCwKarjv/kGmUFOYg1VqEemKhoQpWMu6X2I8kHeuVdGibLGkVK+/5Qw==", - "dev": true, - "engines": { - "node": ">=8" - } - }, "node_modules/serialize-javascript": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-4.0.0.tgz", @@ -8708,12 +8577,6 @@ "node": ">= 8" } }, - "node_modules/which-pm-runs": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/which-pm-runs/-/which-pm-runs-1.0.0.tgz", - "integrity": "sha1-Zws6+8VS4LVd9rd4DKdGFfI60cs=", - "dev": true - }, "node_modules/widest-line": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-2.0.1.tgz", @@ -9494,12 +9357,6 @@ "supports-color": "^7.1.0" } }, - "ci-info": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-2.0.0.tgz", - "integrity": "sha512-5tK7EtrZ0N+OLFMthtqOj4fI2Jeb88C4CAZPu25LDVUgXJ0A3Js4PMGqrn0JU1W0Mh1/Z8wZzYPxqUrXeBboCQ==", - "dev": true - }, "clean-stack": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/clean-stack/-/clean-stack-2.2.0.tgz", @@ -9753,12 +9610,6 @@ "integrity": "sha1-3dgA2gxmEnOTzKWVDqloo6rxJTs=", "dev": true }, - "compare-versions": { - "version": "3.6.0", - "resolved": "https://registry.npmjs.org/compare-versions/-/compare-versions-3.6.0.tgz", - "integrity": "sha512-W6Af2Iw1z4CB7q4uU4hv646dW9GQuBM+YpC0UvUCWSD8w90SJjp+ujJuXaEMtAXBtSqGfMPuFOVn4/+FlaqfBA==", - "dev": true - }, "compressible": { "version": "2.0.18", "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz", @@ -10676,25 +10527,6 @@ "to-regex-range": "^5.0.1" } }, - "find-up": { - "version": "4.1.0", - "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz", - "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==", - "dev": true, - "requires": { - "locate-path": "^5.0.0", - "path-exists": "^4.0.0" - } - }, - "find-versions": { - "version": "3.2.0", - "resolved": "https://registry.npmjs.org/find-versions/-/find-versions-3.2.0.tgz", - "integrity": "sha512-P8WRou2S+oe222TOCHitLy8zj+SIsVJh52VP4lvXkaFVnOFFdoWv1H1Jjvel1aI6NCFOAaeAVm8qrI0odiLcww==", - "dev": true, - "requires": { - "semver-regex": "^2.0.0" - } - }, "fs.realpath": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", @@ -10841,22 +10673,10 @@ "dev": true }, "husky": { - "version": "4.3.0", - "resolved": "https://registry.npmjs.org/husky/-/husky-4.3.0.tgz", - "integrity": "sha512-tTMeLCLqSBqnflBZnlVDhpaIMucSGaYyX6855jM4AguGeWCeSzNdb1mfyWduTZ3pe3SJVvVWGL0jO1iKZVPfTA==", - "dev": true, - "requires": { - "chalk": "^4.0.0", - "ci-info": "^2.0.0", - "compare-versions": "^3.6.0", - "cosmiconfig": "^7.0.0", - "find-versions": "^3.2.0", - "opencollective-postinstall": "^2.0.2", - "pkg-dir": "^4.2.0", - "please-upgrade-node": "^3.2.0", - "slash": "^3.0.0", - "which-pm-runs": "^1.0.0" - } + "version": "7.0.2", + "resolved": "https://registry.npmjs.org/husky/-/husky-7.0.2.tgz", + "integrity": "sha512-8yKEWNX4z2YsofXAMT7KvA1g8p+GxtB1ffV8XtpAEGuXNAbCV5wdNKH+qTpw8SM9fh4aMPDR+yQuKfgnreyZlg==", + "dev": true }, "icss-replace-symbols": { "version": "1.1.0", @@ -11394,15 +11214,6 @@ "json5": "^1.0.1" } }, - "locate-path": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz", - "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==", - "dev": true, - "requires": { - "p-locate": "^4.1.0" - } - }, "lodash.camelcase": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz", @@ -11815,36 +11626,12 @@ "mimic-fn": "^2.1.0" } }, - "opencollective-postinstall": { - "version": "2.0.3", - "resolved": "https://registry.npmjs.org/opencollective-postinstall/-/opencollective-postinstall-2.0.3.tgz", - "integrity": "sha512-8AV/sCtuzUeTo8gQK5qDZzARrulB3egtLzFgteqB2tcT4Mw7B8Kt7JcDHmltjz6FOAHsvTevk70gZEbhM4ZS9Q==", - "dev": true - }, "p-finally": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz", "integrity": "sha1-P7z7FbiZpEEjs0ttzBi3JDNqLK4=", "dev": true }, - "p-limit": { - "version": "2.3.0", - "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz", - "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==", - "dev": true, - "requires": { - "p-try": "^2.0.0" - } - }, - "p-locate": { - "version": "4.1.0", - "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz", - "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==", - "dev": true, - "requires": { - "p-limit": "^2.2.0" - } - }, "p-map": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/p-map/-/p-map-3.0.0.tgz", @@ -11854,12 +11641,6 @@ "aggregate-error": "^3.0.0" } }, - "p-try": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz", - "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==", - "dev": true - }, "parent-module": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz", @@ -11881,12 +11662,6 @@ "lines-and-columns": "^1.1.6" } }, - "path-exists": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz", - "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==", - "dev": true - }, "path-is-absolute": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", @@ -11941,15 +11716,6 @@ "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=", "dev": true }, - "pkg-dir": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-4.2.0.tgz", - "integrity": "sha512-HRDzbaKjC+AOWVXxAU/x54COGeIv9eb+6CkDSQoNTt4XyWoIJvuPsXizxu/Fr23EiekbtZwmh1IcIG/l/a10GQ==", - "dev": true, - "requires": { - "find-up": "^4.0.0" - } - }, "please-upgrade-node": { "version": "3.2.0", "resolved": "https://registry.npmjs.org/please-upgrade-node/-/please-upgrade-node-3.2.0.tgz", @@ -15257,12 +15023,6 @@ "integrity": "sha1-De4hahyUGrN+nvsXiPavxf9VN/w=", "dev": true }, - "semver-regex": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/semver-regex/-/semver-regex-2.0.0.tgz", - "integrity": "sha512-mUdIBBvdn0PLOeP3TEkMH7HHeUP3GjsXCwKarjv/kGmUFOYg1VqEemKhoQpWMu6X2I8kHeuVdGibLGkVK+/5Qw==", - "dev": true - }, "serialize-javascript": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-4.0.0.tgz", @@ -16007,12 +15767,6 @@ "isexe": "^2.0.0" } }, - "which-pm-runs": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/which-pm-runs/-/which-pm-runs-1.0.0.tgz", - "integrity": "sha1-Zws6+8VS4LVd9rd4DKdGFfI60cs=", - "dev": true - }, "widest-line": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-2.0.1.tgz", diff --git a/package.json b/package.json index e381c971..80a7c316 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,8 @@ "debug": "node --inspect-brk node_modules/.bin/rollup -c", "dev": "DEV_PORT=\"${DEV_PORT:=5000}\" run-p watch serve", "watch": "rollup -cw", - "serve": "serve --listen=$DEV_PORT --config ../../../serve.json .tmp/build/static" + "serve": "serve --listen=$DEV_PORT --config ../../../serve.json .tmp/build/static", + "prepare": "husky install" }, "devDependencies": { "@rollup/plugin-commonjs": "^17.0.0", @@ -24,7 +25,7 @@ "dedent": "^0.7.0", "del": "^5.1.0", "file-drop-element": "^1.0.1", - "husky": "^4.3.0", + "husky": "^7.0.2", "idb-keyval": "^3.2.0", "image-size": "^0.9.3", "linkstate": "^2.0.0", @@ -47,11 +48,6 @@ "typescript": "^4.1.3", "which": "^2.0.2" }, - "husky": { - "hooks": { - "pre-commit": "lint-staged" - } - }, "lint-staged": { "*.{js,css,json,md,ts,tsx}": "prettier --write", "*.{c,h,cpp,hpp}": "clang-format -i", From e6810059efb953001cafd00d1e2accce8ac212ef Mon Sep 17 00:00:00 2001 From: Tim van der Lippe Date: Wed, 20 Oct 2021 14:56:34 +0100 Subject: [PATCH 9/9] Add warning for using multiple image pools Instantiating and using multiple image pools is not intended and can lead to memory problems. Instead, users should use a single pool and reuse that pool across all image processing. Therefore, let's add a warning in the README to specify call this out and avoid users of running into issues. Relates to #1065 --- libsquoosh/README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/libsquoosh/README.md b/libsquoosh/README.md index 7f4dbb82..2c067efc 100644 --- a/libsquoosh/README.md +++ b/libsquoosh/README.md @@ -22,6 +22,8 @@ const imagePool = new ImagePool(cpus().length); This will create an image pool with an underlying processing pipeline that you can use to ingest and encode images. The ImagePool constructor takes one argument that defines how many parallel operations it is allowed to run at any given time. +:warning: Important! Make sure to only create 1 `ImagePool` when performing parallel image processing. If you create multiple pools, the `ImagePool` can run out of memory and crash. By reusing a single `ImagePool`, you can ensure that the backing worker queue and processing pipeline releases memory prior to processing the next image. + ## Ingesting images You can ingest a new image like so: