Najszybsza metoda na sprawdzenie czy obraz posiada więcej niż jeden kolor

Question

Natknąłem się na ciekawy problem - musiałem sprawdzić czy dany obraz posiada więcej niż 1 kolor. Użyłem funkcji getPixels która zwraca ndarray (wielowymiarowa tablica w js) pikseli. W tej tablicy piksele były ułożone we wzorze [ r, g, b, a, r, g, b, a ... ] czyli każde 4 elementy stanowiły opis jednego piksela. Przekonwertowałem to na zwykłą tablicę tablic we wzorze [ [r, g, b, a], [r, g, b, a] ... ].

Następnie w pętli przeiterowałem po tej tablicy i porównwałem kolejno obecną zagnieżdżoną tablicę z następną zamieniając je na JSON stringa.

Jeżeli którakolwiek z tablic się nie zgadza to ustawiam boolean na false i przerywałem działanie pętli.

const getPixels = require("get-pixels");

//1px only black https://i.imgur.com/dStJ1Og.png
//2px only black https://i.imgur.com/5z46WVp.png
//88x62px only black https://i.imgur.com/ZtGMUh9.png
//88x62px black and red https://i.imgur.com/67IZCaD.png
//220x297px black and red https://i.imgur.com/KTNnJGF.jpg

getPixels("https://i.imgur.com/JiHtQuR.jpg", function(err, ndarray) {
    if(err) {
        console.log("Bad image path!");
        return;
    }

    const uintArr = new Uint8Array(ndarray.data);
    const regularArr = [];
    let oneColor = true;

    for(let i = 0, l = uintArr.length / 4; i < l; i++) {
        regularArr.push([uintArr[4*i], uintArr[4*i+1], uintArr[4*i+2], uintArr[4*i+3]])
    }
    for(let i = 0, l = regularArr.length; i < l; i++) {
        if(regularArr[i + 1]) {
            let currentValString = JSON.stringify(regularArr[i]);
            let nextValString = JSON.stringify(regularArr[i + 1]);

            if(currentValString !== nextValString) {
                oneColor = false;
                break;
            }
        }
    }

    console.log('Is image one color? ', oneColor);
});

Wygląda na to, że kod działa poprawnie. Problemem jest wydajność. Dla obrazu 3000x4000px (12 mln pikseli) operacja trwa 8 sekund (co prawda specjalnie stworzyłem cały czarny obraz z 1 px czerwonym gdzieś w prawym dolnym rogu). To o 90% za dużo. Czy mam jakieś opcje poza zmianą języka?

Comments

Jakie formaty plików chcesz obsługiwać?

---

gif, png

Answer 1

Coś takiego?

let r = uintArr[0], g = uintArr[1], b = uintArr[2], a = uintArr[3];
for (let i = 0; i < uintArr.length; i += 4) {
	if (
		r != uintArr[i] ||
		g != uintArr[i+1] ||
		b != uintArr[i+2] ||
		a != uintArr[i+3]
	) {
		return false;
	}
}
return true;

 

Comments

i porównać Uint32Array z ...?

---

no, porównać jego elementy.

---

aaa, dobra spróbuje

---

żeby nie sprawdzać długości przy każdym "obrocie" pętli

Polecam poczytać: https://mrale.ph/blog/2014/12/24/array-length-caching.html 

---

a spoko czyli v8 robi to za mnie