2021-12-11 13:21:08 +00:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="utf-8" />
|
|
|
|
|
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
|
|
|
<meta name="theme-color" content="#000000" />
|
|
|
|
|
<meta
|
|
|
|
|
name="description"
|
|
|
|
|
content="Web site created using create-react-app"
|
|
|
|
|
/>
|
|
|
|
|
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
|
|
|
|
|
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
|
|
|
|
<title>Palette Switcher</title>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<noscript>You need to enable JavaScript to run this app.</noscript>
|
2021-12-11 15:19:48 +00:00
|
|
|
<article>
|
|
|
|
|
<h1>Go+Wasm image dithering tool</h1>
|
|
|
|
|
<aside>Featuring the Nord Color Palette</aside>
|
|
|
|
|
<p>
|
|
|
|
|
Load an image, click Go and wait (potentially for a while) for the image
|
|
|
|
|
to be dithered using the Nord color palette and the Floyd-Steinberg
|
|
|
|
|
algorithm.
|
|
|
|
|
</p>
|
|
|
|
|
<p>
|
|
|
|
|
Running in the browser with Wasm causes a bit of a performance penalty.
|
|
|
|
|
Multithreading is not available (not that it matters much since
|
|
|
|
|
Floyd-Steinberg is single-threaded), and sending data back and forth
|
|
|
|
|
between JS and Wasm can take a little while.
|
|
|
|
|
</p>
|
|
|
|
|
<p>
|
|
|
|
|
I've re-used code from
|
|
|
|
|
<a
|
|
|
|
|
href="https://www.sitepen.com/blog/using-webassembly-with-web-workers"
|
|
|
|
|
>
|
|
|
|
|
this article
|
|
|
|
|
</a>
|
|
|
|
|
to make the Wasm code run in a web worker, with some adaptations for Go
|
|
|
|
|
oddities.
|
|
|
|
|
</p>
|
|
|
|
|
<p>
|
|
|
|
|
If you're into that sort of thing, source code is available on
|
|
|
|
|
<a href="https://github.com/CrispyBaguette/wasm-palette-converter">
|
|
|
|
|
GitHub
|
|
|
|
|
</a>
|
|
|
|
|
.
|
|
|
|
|
</p>
|
|
|
|
|
</article>
|
2021-12-11 13:21:08 +00:00
|
|
|
<div id="root"></div>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
