canvas-hypertxt - npm Package Compare versions

Comparing version 0.0.5 to 0.0.6

package.json

		{
		"name": "canvas-hypertxt",
		"version": "0.0.5",
		"version": "0.0.6",
		"description": "The fastest way to layout wrapped text on a HTML5 canvas",
		@@ -12,7 +12,7 @@ "sideEffects": false,
		"main": "dist/cjs/index.cjs",
		"module": "dist/js/index.cjs",
		"module": "dist/js/index.js",
		"types": "dist/ts/index.d.ts",
		"exports": {
		"import": "./dist/js/index.cjs",
		"require": "./dist/cjs/index.js"
		"import": "./dist/cjs/index.cjs",
		"require": "./dist/js/index.js"
		},
		@@ -19,0 +19,0 @@ "scripts": {

README.md

		@@ -44,3 +44,3 @@ # Canvas HyperTxt 🚀📐✍

		While canvas-hypertxt does not set out to be a drop in replacement to canvas-txt, we can drag race them.
		While canvas-hypertxt does not set out to be a drop-in replacement to canvas-txt, we can drag race them.

		@@ -66,7 +66,7 @@ All tests were done with 5000 iterations. To ensure a fair comparison times include font rendering time.

		Canvas-txt is an excellent library but takes a very inefficient approach to finding wrap points. It is clearly not written with performance in mind, but rather with features and bundle size. Overall it is a fantastic library of raw speed is not important to your use case.
		Canvas-txt is an excellent library but takes a very inefficient approach to finding wrap points. It is clearly not written with performance in mind, but rather with features and bundle size. Overall it is a fantastic library if raw speed is not important to your use case.

		## HyperWrapping

		One of the major items introduced by `canvas-hypertxt` is the concept of hyper wrapping. When enabled the font engine will train a weighting model to provide estimates for string sizes. Once the model is sufficiently trained it will perform string wrapping without calling `ctx.measureText` once. This leads to massive performance gains at the cost of accuracy. In practice with most fonts and text bodies, once trained the hyper wrap guesses will be withing 1% of the actual measured size. A buffer is added to ensure the text wraps slightly too early instead of clipping.
		One of the major items introduced by `canvas-hypertxt` is the concept of hyper wrapping. When enabled the font engine will train a weighting model to provide estimates for string sizes. Once the model is sufficiently trained it will perform string wrapping without calling `ctx.measureText` once. This leads to massive performance gains at the cost of accuracy. In practice with most fonts and text bodies, once trained the hyper wrap guesses will be within 1% of the actual measured size. A buffer is added to ensure the text wraps slightly too early instead of clipping.

		@@ -85,3 +85,3 @@ The end result is text that is correctly wrapped the vast majority of the time, with a very small number of errors where the text wraps too early by a single word. The performance gains in the measure pass are over 100x, with hyper wrapped text basically having zero cost vs unwrapped text of the same size.

		I didn't feel like implementing it, patches welcome. This will 100% be slower that non-justified text due to the large amounts of string manipulation and extra measurement required. If you need justification canvas-txt can do it.
		I didn't feel like implementing it, patches welcome. This will 100% be slower than non-justified text due to the large amounts of string manipulation and extra measurement required. If you need justification canvas-txt can do it.

		@@ -138,2 +138,2 @@ ### Debug mode
		void clearCacheOnLoad();
		```
		```

canvas-hypertxt - npm Package Compare versions

New alerts

Fixed alerts

Improved metrics

Worsened metrics