pixel-buffer-diff - npm Package Compare versions

Comparing version 1.2.1 to 1.3.0

dist/index.d.ts

@@ -1,6 +0,2 @@
-export declare const diffImageDatas: (baseline: ImageData, candidate: ImageData, diff: ImageData, options?: {
-    threshold?: number | undefined;
-    cumulatedThreshold?: number | undefined;
-    enableMinimap?: boolean | undefined;
-} | undefined) => {
+export declare type Result = {
     diff: number;
@@ -10,11 +6,9 @@ cumulatedDiff: number;
 };
-export declare const diff: (baseline8: Uint8Array | Uint8ClampedArray, candidate8: Uint8Array | Uint8ClampedArray, diff8: Uint8Array | Uint8ClampedArray, width: number, height: number, options?: {
-    threshold?: number | undefined;
-    cumulatedThreshold?: number | undefined;
-    enableMinimap?: boolean | undefined;
-} | undefined) => {
-    diff: number;
-    cumulatedDiff: number;
-    hash: number;
+export declare type Options = {
+    threshold?: number;
+    cumulatedThreshold?: number;
+    enableMinimap?: boolean;
 };
+export declare const diffImageDatas: (baseline: ImageData, candidate: ImageData, diff: ImageData, options?: Options) => Result;
+export declare const diff: (baseline8: Uint8Array | Uint8ClampedArray, candidate8: Uint8Array | Uint8ClampedArray, diff8: Uint8Array | Uint8ClampedArray, width: number, height: number, options?: Options) => Result;
 //# sourceMappingURL=index.d.ts.map

dist/index.js

@@ -1,1 +0,1 @@
-Object.defineProperty(exports,"__esModule",{value:!0}),exports.diff=exports.diffImageDatas=void 0;exports.diffImageDatas=(t,e,a,i)=>{const n=i&&i.enableMinimap||false,r=i&&i.threshold||.03,f=i&&i.cumulatedThreshold||.5,{width:h,height:o}=t,d=h*o,s=t.data,l=e.data,c=a.data,m=s.length,w=l.length,g=c.length;if(h!==e.width||o!==e.height||4*d!==m||m!==w)throw new Error("Different baseline and candidate ImageData dimensions");const u=a.width/h,M=g/m;if(a.height!==o||u!==M||1!==u&&3!==u)throw new Error("Invalid diff ImageData dimensions");const p=g===m?1:2,x=s.buffer,y=l.buffer,D=c.buffer,b=new Uint32Array(x,0,m>>2),A=new Uint32Array(y,0,m>>2),U=new Uint32Array(D,0,g>>2),I=r*r*35215;let v=0,E=0,_=0,j=0,q=0,C=0,O=0,P=0;const T=Math.ceil(Math.sqrt(d)/128),k=m/T&-4;for(let t=0;t<T;t++)P+=(.299*(s[v]+l[v])+.587*(s[v+1]+l[v+1])+.114*(s[v+2]+l[v+2]))/T/2,v+=k;const z=P<128,B=z?1057016832:1056964863,F=z?1056964863:1057016832;v=0;const G=Math.ceil(o/256),H=Math.ceil(h/256),J=new Uint8ClampedArray(H*G),K=2===p?h:0,L=2*K+h,N=Math.max(h,o),Q=Math.max(H,G),R=new Uint32Array(N);let S=0;for(let t=0;t<Q;t++)R.fill(t,S,Math.min(S+256,N)),S+=256;for(let t=0;t<o;t++){const e=R[t]*H;K>0&&(U.set(new Uint32Array(x,v,h),_),_+=h,U.set(new Uint32Array(y,v,h),_+h));let a=4034073399*(4034073399^t);for(let t=0;t<h;t++,_++,E++,v+=4,a++){if(b[E]===A[E])continue;const i=l[v]-s[v],n=l[v+1]-s[v+1],r=l[v+2]-s[v+2],f=.29889531*i+.58662247*n+.11448223*r,h=.59597799*i-.2741761*n-.32180189*r,o=.21147017*i-.52261711*n+.31114694*r;if(f*f*.5053+h*h*.299+o*o*.1957>I){J[e+R[t]]++,j++;const i=Math.abs(f);O+=i,U[_]=(f>0?B:F)+(Math.min(192,8*i)<<24),0===q&&(C=a),q+=a}}_+=K}if(q-=C,O/=256,n)for(let t=0;t<H*G;t++){if(J[t]>0){const e=t/H|0,a=256*(t%H),i=Math.min(a+256,h),n=256*e,r=Math.min(n+256,o);_=a+n*L+K;const f=L-i+a;for(let t=n;t<r;t++){for(let t=a;t<i;t++)U[_++]|=1082064896;_+=f}}}return O>f?{diff:j,cumulatedDiff:O,hash:q}:{diff:0,cumulatedDiff:0,hash:0}};exports.diff=(t,e,a,i,n,r)=>(0,exports.diffImageDatas)({width:i,height:n,data:t},{width:i,height:n,data:e},{width:i*a.length/t.length,height:n,data:a},r);
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.diff=exports.diffImageDatas=void 0;const t={threshold:.03,cumulatedThreshold:.5,enableMinimap:!1};exports.diffImageDatas=(e,a,i,n=t)=>{if(void 0===n.threshold||void 0===n.cumulatedThreshold||void 0===n.enableMinimap)throw new Error("Invalid options");const{width:h,height:r}=e,o=h*r,d=e.data,f=a.data,l=i.data,s=d.length,c=f.length,m=l.length;if(h!==a.width||r!==a.height||4*o!==s||s!==c)throw new Error("Different baseline and candidate ImageData dimensions");const w=i.width/h,u=m/s;if(i.height!==r||w!==u||1!==w&&3!==w)throw new Error("Invalid diff ImageData dimensions");const g=m===s?1:2,M=d.buffer,p=f.buffer,b=l.buffer,x=new Uint32Array(M,0,s>>2),y=new Uint32Array(p,0,s>>2),D=new Uint32Array(b,0,m>>2),v=n.threshold*n.threshold*35215;let A=0,I=0,U=0,E=0,T=0,_=0,j=0,q=0;const C=Math.ceil(Math.sqrt(o)/128),O=s/C&-4;for(let t=0;t<C;t++)q+=(.299*(d[A]+f[A])+.587*(d[A+1]+f[A+1])+.114*(d[A+2]+f[A+2]))/C/2,A+=O;const P=q<128,k=P?1057016832:1056964863,z=P?1056964863:1057016832;A=0;const B=Math.ceil(r/256),F=Math.ceil(h/256),G=new Uint8ClampedArray(F*B),H=2===g?h:0,J=2*H+h,K=Math.max(h,r),L=Math.max(F,B),N=new Uint32Array(K);let Q=0;for(let t=0;t<L;t++)N.fill(t,Q,Math.min(Q+256,K)),Q+=256;for(let t=0;t<r;t++){const e=N[t]*F;H>0&&(D.set(new Uint32Array(M,A,h),U),U+=h,D.set(new Uint32Array(p,A,h),U+h));let a=4034073399*(4034073399^t);for(let t=0;t<h;t++,U++,I++,A+=4,a++){if(x[I]===y[I])continue;const i=f[A]-d[A],n=f[A+1]-d[A+1],h=f[A+2]-d[A+2],r=.29889531*i+.58662247*n+.11448223*h,o=.59597799*i-.2741761*n-.32180189*h,l=.21147017*i-.52261711*n+.31114694*h;if(r*r*.5053+o*o*.299+l*l*.1957>v){G[e+N[t]]++,E++;const i=Math.abs(r);j+=i,D[U]=(r>0?k:z)+(Math.min(192,8*i)<<24),0===T&&(_=a),T+=a}}U+=H}if(T-=_,j/=256,n.enableMinimap)for(let t=0;t<F*B;t++){if(G[t]>0){const e=t/F|0,a=256*(t%F),i=Math.min(a+256,h),n=256*e,o=Math.min(n+256,r);U=a+n*J+H;const d=J-i+a;for(let t=n;t<o;t++){for(let t=a;t<i;t++)D[U++]|=1082064896;U+=d}}}return j>n.cumulatedThreshold?{diff:E,cumulatedDiff:j,hash:T}:{diff:0,cumulatedDiff:0,hash:0}};exports.diff=(e,a,i,n,h,r=t)=>(0,exports.diffImageDatas)({width:n,height:h,data:e},{width:n,height:h,data:a},{width:n*i.length/e.length,height:h,data:i},r);

package.json

@@ -23,3 +23,3 @@ {
   ],
-  "version": "1.2.1",
+  "version": "1.3.0",
   "scripts": {
@@ -26,0 +26,0 @@ "build": "tsc && terser ./dist/index.js -c -m --module  -o ./dist/index.js"

README.md

@@ -63,4 +63,38 @@ # **Pixel-buffer-diff** aka **Pbd**
 
-**Pbd** exports two methods, `diff` and `diffImageDatas` which work as a drop in replacement for Pixelmatch or directly with ImageData objects. They are exactly the same in term of functionnality and return value, so use either at your convenience.
+**Pbd** exports two types for the diffing `Options` and `Results`, and two methods, `diff` and `diffImageDatas` which work as a drop in replacement for Pixelmatch or directly with ImageData objects. They are exactly the same in term of functionnality and return value, so use either at your convenience.
 
+### The `Options` type
+
+The `Options` type defines the options specifying how to diff pixel buffers and their output.
+
+```typescript
+type Options = {
+  threshold?: number;
+  cumulatedThreshold?: number;
+  enableMinimap?: boolean
+};
+```
+
+* `threshold` specifies the individual pixel matching threshold between `0` and `1`. Smaller values make the comparison more sensitive. Defaults to `0.03`
+* `cumulatedThreshold` specifies the cumulated pixel matching threshold. Smaller values make the comparision more sensitive to anti-aliasing differences. Default to `.5`
+*  `enableMinimap` enables the low resolution overlay. Defaults to `false`
+
+### The `Result` type
+
+The `Result` type defines the properties resulting from diffing two pixel buffers.
+
+```typescript
+type Result = {
+  diff: number;
+  cumulatedDiff: number;
+  hash: number
+};
+```
+
+* `diff` a number showing the number of pixels that exceeded the `threshold`
+* `hash` a numeric hash representing the pixel change between the two images. This hash allows to de-duplicate changes across multiple images to only show unique changes in your visual regression report and approval workflow. 
+* `cumulatedDiff` a number representing the cumulated difference of every pixel change in the two images. This can used to discard changes that only effect subtle differences like anti-aliasing pixels.
+
+These properties are all set to `0` if the two images are within the cumulatedThreshold.
+
 ### The `diff` method
@@ -77,4 +111,4 @@
   height: number,
-  options?: { threshold?: number; cumulatedThreshold?: number; enableMinimap?: boolean }
-): { diff: number; hash: number; cumulatedDiff: number }
+  options: Options = defaultOptions
+): Result
 ```
@@ -84,6 +118,3 @@
 * `width` and `height` are the width and height of the images.
-* `options` is an optional argument with the following properties:
-  * `threshold` specifies the individual pixel matching threshold between `0` and `1`. Smaller values make the comparison more sensitive. Defaults to `0.03`
-  * `cumulatedThreshold` specifies the cumulated pixel matching threshold. Smaller values make the comparision more sensitive to anti-aliasing differences. Default to `.5`
-  *  `enabledMinimap` enables the low resolution overlay. Defaults to `false`
+* `options` defines how to diff the pixel buffers
 
@@ -100,11 +131,8 @@ ### The `diffImageDatas` method
   diff: ImageData,
-  options?: { threshold?: number, cumulatedThreshold?: number; enableMinimap?: boolean,  }
-): { diff: number; hash: number; cumulatedDiff: number }
+  options: Options = defaultOptions
+): Result
 ```
 
 * `baseline`, `candidate` and `diff` are `ImageData` holding the 32bits pixel data for the baseline, candidate and diff images.
-* `options` is an optional argument with the following properties:
-   * `threshold` specifies the individual pixel matching threshold between `0` and `1`. Smaller values make the comparison more sensitive. Defaults to `0.03`
-  * `cumulatedThreshold` specifies the cumulated pixel matching threshold. Smaller values make the comparision more sensitive to anti-aliasing differences. Default to `.5`
-  *  `enabledMinimap` enables the low resolution overlay. Defaults to `false`
+* `options` defines how to diff the pixel buffers
 
@@ -115,10 +143,5 @@ ### Return value of `diff` and `diffImageData`
 
-* `diff` a number showing the number of pixels that exceeded the `threshold`
-* `hash` a numeric hash representing the pixel change between the two images. This hash allows to de-duplicate changes across multiple images to only show unique changes in your visual regression report and approval workflow. 
-* `cumulatedDiff` a number representing the cumulated difference of every pixel change in the two images. This can used to discard changes that only effect subtle differences like anti-aliasing pixels.
 
-These properties are all set to `0` if the two images are within the cumulatedThreshold.
 
 
-
 ## Example usage
@@ -125,0 +148,0 @@

No alert changes

Improved metrics

Number of lines in readme file

185

14.2%

Worsened metrics

Total package byte prevSize

29112

-0.58%

Lines of code

12

-33.33%

No dependency changes