		@@ -1,12 +0,9 @@
		// const textDrawerCanvas = document.createElement("canvas");
		// textDrawerCanvas.width = 1;
		// textDrawerCanvas.height = 1;
		// const textDrawer = textDrawerCanvas.getContext("2d");

		const textDrawerCanvas = new OffscreenCanvas(16, 16);
		const textDrawer = textDrawerCanvas.getContext("2d");
		const textDrawer = textDrawerCanvas.getContext("2d", { willReadFrequently: true });

		onmessage = function onmessage({
		data: {
		command, // either "render" or "loadFontFace"
		workId,

		str,
		@@ -19,3 +16,7 @@ font,
		outlineColour,
		cache = false,
		// cache = false,

		family,
		source,
		descriptors,
		},
		@@ -26,46 +27,65 @@ ...msg

		textDrawer.font = font;
		textDrawer.textAlign = align;
		textDrawer.textBaseline = baseline;
		if (command === "render") {
		textDrawer.font = font;
		textDrawer.textAlign = align;
		textDrawer.textBaseline = baseline;

		let metrics = textDrawer.measureText(str);
		let metrics = textDrawer.measureText(str);

		const left = metrics.actualBoundingBoxLeft + outlineWidth;
		const right = metrics.actualBoundingBoxRight + outlineWidth;
		const up = metrics.actualBoundingBoxAscent + outlineWidth;
		const down = metrics.actualBoundingBoxDescent + outlineWidth;
		const left = metrics.actualBoundingBoxLeft + outlineWidth;
		const right = metrics.actualBoundingBoxRight + outlineWidth;
		const up = metrics.actualBoundingBoxAscent + outlineWidth;
		const down = metrics.actualBoundingBoxDescent + outlineWidth;

		const width = Math.ceil(left + right) + 1;
		const height = Math.ceil((textDrawerCanvas.height = up + down)) + 1;
		const width = Math.ceil(left + right) + 1;
		const height = Math.ceil((textDrawerCanvas.height = up + down)) + 1;

		if (textDrawerCanvas.width < width \|\| textDrawerCanvas.height < height) {
		textDrawerCanvas.width = Math.max(width, textDrawerCanvas.width);
		textDrawerCanvas.height = Math.max(height, textDrawerCanvas.height);
		textDrawer.font = font;
		textDrawer.textAlign = align;
		textDrawer.textBaseline = baseline;
		} else {
		textDrawer.clearRect(0, 0, width, height);
		}
		if (textDrawerCanvas.width < width \|\| textDrawerCanvas.height < height) {
		textDrawerCanvas.width = Math.max(width, textDrawerCanvas.width);
		textDrawerCanvas.height = Math.max(height, textDrawerCanvas.height);
		textDrawer.font = font;
		textDrawer.textAlign = align;
		textDrawer.textBaseline = baseline;
		} else {
		textDrawer.clearRect(0, 0, width, height);
		}

		if (outlineWidth > 0) {
		textDrawer.lineWidth = outlineWidth * 2;
		textDrawer.strokeStyle = outlineColour;
		textDrawer.strokeText(str, left, up);
		}
		if (outlineWidth > 0) {
		textDrawer.lineWidth = outlineWidth * 2;
		textDrawer.strokeStyle = outlineColour;
		textDrawer.strokeText(str, left, up);
		}

		textDrawer.fillStyle = colour;
		textDrawer.fillText(str, left, up);
		textDrawer.fillStyle = colour;
		textDrawer.fillText(str, left, up);

		const imageData = textDrawer.getImageData(0, 0, width, height);
		const imageData = textDrawer.getImageData(0, 0, width, height);

		const returnMsg = {
		imageData,
		left,
		up,
		width,
		height,
		};
		const returnMsg = {
		imageData,
		left,
		up,
		width,
		height,
		};

		return postMessage({ workId, ...returnMsg });
		return postMessage({ workId, ...returnMsg });
		} else if (command === "loadFontFace") {
		const font = new FontFace(family, source, descriptors);
		self.fonts.add(font);
		font.load()
		.catch((ex) =>
		postMessage({
		workId,
		error: ex,
		})
		)
		.then(() => {
		console.log(self.fonts);

		postMessage({
		workId,
		});
		});
		}
		};

CHANGELOG