Knowledge Map

4x4 행렬곱 연산 테스트 본문

WEB/JAVASCRIPT

4x4 행렬곱 연산 테스트

2017.09.25 16:53

테스트 코드는 다음과 같다. 

http://jsben.ch/oApXB



var a = [
[1,2,3,4],
[5,6,7,8],
[11,12,13,14],
[15,16,17,18]]
var b = [
[21,22,23,24],
[35,36,37,38],
[41,42,43,44],
[45,46,47,48]]
cs



/**************************************** case 1 ****************************************/
var r = [[],[],[],[]];
r[0][0= a[0][0* b[0][0+ a[0][1* b[1][0+ a[0][2* b[2][0+ a[0][3* b[3][0];
r[0][1= a[0][0* b[0][1+ a[0][1* b[1][1+ a[0][2* b[2][1+ a[0][3* b[3][1]; 
r[0][2= a[0][0* b[0][2+ a[0][1* b[1][2+ a[0][2* b[2][2+ a[0][3* b[3][2];
r[0][3= a[0][0* b[0][3+ a[0][1* b[1][3+ a[0][2* b[2][3+ a[0][3* b[3][3];
r[1][0= a[1][0* b[0][0+ a[1][1* b[1][0+ a[1][2* b[2][0+ a[1][3* b[3][0];
r[1][1= a[1][0* b[0][1+ a[1][1* b[1][1+ a[1][2* b[2][1+ a[1][3* b[3][1]; 
r[1][2= a[1][0* b[0][2+ a[1][1* b[1][2+ a[1][2* b[2][2+ a[1][3* b[3][2];
r[1][3= a[1][0* b[0][3+ a[1][1* b[1][3+ a[1][2* b[2][3+ a[1][3* b[3][3];
r[2][0= a[2][0* b[0][0+ a[2][1* b[1][0+ a[2][2* b[2][0+ a[2][3* b[3][0];
r[2][1= a[2][0* b[0][1+ a[2][1* b[1][1+ a[2][2* b[2][1+ a[2][3* b[3][1]; 
r[2][2= a[2][0* b[0][2+ a[2][1* b[1][2+ a[2][2* b[2][2+ a[2][3* b[3][2];
r[2][3= a[2][0* b[0][3+ a[2][1* b[1][3+ a[2][2* b[2][3+ a[2][3* b[3][3];
r[3][0= a[3][0* b[0][0+ a[3][1* b[1][0+ a[3][2* b[2][0+ a[3][3* b[3][0];
r[3][1= a[3][0* b[0][1+ a[3][1* b[1][1+ a[3][2* b[2][1+ a[3][3* b[3][1]; 
r[3][2= a[3][0* b[0][2+ a[3][1* b[1][2+ a[3][2* b[2][2+ a[3][3* b[3][2];
r[3][3= a[3][0* b[0][3+ a[3][1* b[1][3+ a[3][2* b[2][3+ a[3][3* b[3][3];
cs

4x4 배열이므로 하나하나 코드를 적어주는 방식.




/**************************************** case 2 ****************************************/
var r = [[],[],[],[]];
for(var i = 0; i < 4; i++) {
    r[i][0= a[i][0* b[0][0+ a[i][1* b[1][0+ a[i][2* b[2][0+ a[i][3* b[3][0];
    r[i][1= a[i][0* b[0][1+ a[i][1* b[1][1+ a[i][2* b[2][1+ a[i][3* b[3][1];
    r[i][2= a[i][0* b[0][2+ a[i][1* b[1][2+ a[i][2* b[2][2+ a[i][3* b[3][2];
    r[i][3= a[i][0* b[0][3+ a[i][1* b[1][3+ a[i][2* b[2][3+ a[i][3* b[3][3];
}
cs

for 반복문을 1번 써준다.



/**************************************** case 3 ****************************************/
var r1 = [[],[],[],[]];
for(var i = 0; i < 4; i++) {
    for(var j = 0; j < 4; j++) {
        r1[i][j] = a[i][0]*b[0][j] + a[i][1]*b[1][j] + a[i][2]*b[2][j] + a[i][3]*b[3][j]
    }
}
cs

for 반복문을 2번 써준다.


/**************************************** case 4 ****************************************/
var r1 = [[],[],[],[]];
var temp = 0;
for(var i = 0; i < 4; i++) {
    for(var j = 0; j < 4; j++) {
        for(var k = 0; k < 4; k++) {
            temp += a[i][k] * b[k][j];
        }
        r1[i][j] = temp;
        temp = 0;
    }
}
cs

for를 3번 써준다.



/**************************************** case 5 ****************************************/
var r = [[],[],[],[]];
var b00, b01, b02, b03, b10, b11,b12,b13,b20,b21,b22,b23,b30,b31,b32,b33;
for(var i = 0; i < 4; i++) {
    r[i][0= a[i][0* (b00 || (b00 = b[0][0])) + a[i][1* (b10 || (b10 = b[1][0])) 
            + a[i][2* (b20 || (b20 = b[2][0])) + a[i][3* (b30 || (b30 = b[3][0]));
    r[i][1= a[i][0* (b01 || (b01 = b[0][1])) + a[i][1* (b11 || (b11 = b[1][1])) 
            + a[i][2* (b21 || (b21 = b[2][1])) + a[i][3* (b31 || (b31 = b[3][1]));
    r[i][2= a[i][0* (b02 || (b02 = b[0][2])) + a[i][1* (b12 || (b12 = b[1][2])) 
            + a[i][2* (b22 || (b22 = b[2][2])) + a[i][3* (b32 || (b32 = b[3][2]));
    r[i][3= a[i][0* (b03 || (b03 = b[0][3])) + a[i][1* (b13 || (b13 = b[1][3])) 
            + a[i][2* (b23 || (b23 = b[2][3])) + a[i][3* (b33 || (b33 = b[3][3]));
cs

for 반복문 1번에 각 값들이 반복되므로 캐시를 해준다.



결과


waterfox 54

case 1 : 1346ms

case 2 : 1088ms

case 3 : 1065ms

case 4 : 2410ms

case 5 : 1143ms



edge 15

case 1 : 821ms

case 2 : 812ms

case 3 : 847ms

case 4 : 1037ms

case 5 : 643ms


ie 11

case 1 : 972ms

case 2 : 1001ms

case 3 : 1054ms

case 4 : 1133ms

case 5 : 716ms



chrome 60 (크롬은 계속 결과가 달라진다.;)

case 1 : 118ms   92ms  116ms

case 2 : 107ms  101ms  111ms

case 3 : 126ms  110ms   85ms

case 4 : 104ms   98ms   93ms

case 5 : 126ms  132ms  142ms



chrome 63 (카나리아)

case 1 :  81ms   99ms

case 2 :  88ms   91ms

case 3 :  86ms   87ms

case 4 :  91ms   92ms

case 5 : 113ms  126ms



추가버전(09.27)


이게 크롬, IE, 엣지에서 가장 빠르지만 워터 폭스에서는 뒤에서 2번째의 속도를 가진다.


var r = [[],[],[],[]];
var b00 = b[0][0], b01 = b[0][1], b02 = b[0][2], b03 = b[0][3], 
    b10 = b[1][0], b11 = b[1][1], b12 = b[1][2], b13 = b[1][3], 
    b20 = b[2][0], b21 = b[2][1], b22 = b[2][2], b23 = b[2][3], 
    b30 = b[3][0], b31 = b[3][1], b32 = b[3][2], b33 = b[3][3];
 
var a00 = a[0][0], a01 = a[0][1], a02 = a[0][2], a03 = a[0][3], 
    a10 = a[1][0], a11 = a[1][1], a12 = a[1][2], a13 = a[1][3], 
    a20 = a[2][0], a21 = a[2][1], a22 = a[2][2], a23 = a[2][3], 
    a30 = a[3][0], a31 = a[3][1], a32 = a[3][2], a33 = a[3][3];
 
r[0][0= a00 * b00 + a01 * b10 + a02 * b20 + a03 * b30;
r[0][1= a00 * b01 + a01 * b11 + a02 * b21 + a03 * b31; 
r[0][2= a00 * b02 + a01 * b12 + a02 * b22 + a03 * b32;
r[0][3= a00 * b03 + a01 * b13 + a02 * b23 + a03 * b33;
 
r[1][0= a10 * b00 + a11 * b10 + a12 * b20 + a13 * b30;
r[1][1= a10 * b01 + a11 * b11 + a12 * b21 + a13 * b31; 
r[1][2= a10 * b02 + a11 * b12 + a12 * b22 + a13 * b32;
r[1][3= a10 * b03 + a11 * b13 + a12 * b23 + a13 * b33;
 
r[2][0= a20 * b00 + a21 * b10 + a22 * b20 + a23 * b30;
r[2][1= a20 * b01 + a21 * b11 + a22 * b21 + a23 * b31; 
r[2][2= a20 * b02 + a21 * b12 + a22 * b22 + a23 * b32;
r[2][3= a20 * b03 + a21 * b13 + a22 * b23 + a23 * b33;
 
r[3][0= a30 * b00 + a31 * b10 + a32 * b20 + a33 * b30;
r[3][1= a30 * b01 + a31 * b11 + a32 * b21 + a33 * b31; 
r[3][2= a30 * b02 + a31 * b12 + a32 * b22 + a33 * b32;
r[3][3= a30 * b03 + a31 * b13 + a32 * b23 + a33 * b33;
cs


'WEB > JAVASCRIPT' 카테고리의 다른 글

formData & file sending  (0) 2018.02.08
4x4 행렬곱 연산 테스트  (0) 2017.09.25
2차원 행렬 클래스  (0) 2017.09.08
Dispatch  (0) 2017.08.06
ES5 에서의 실행 컨텍스트  (0) 2017.07.31
javascript API Geolocation  (0) 2017.04.25
0 Comments