멘토님께 여쭤보기 위한 성능 측정 간단 예시

performance.now() 를 사용해서 성능 측정을 해보려고 했으나 생각보다 유의미한 값을 얻기 어려워 벤치마크 사이트를 활용해 측정했습니다.

const BOARD = [
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
];

const row = 20;
const col = 10;

1. for문 + BOARD의 length를 매번 측정

for(let i = 0; i < BOARD.length; i++) {
	for(let j = 0; j < BOARD[i].length; j++) {
  	BOARD[i][j] = 1;
  }
}

2. for문 + BOARD의 length를 상수로 사용

for(let i = 0; i < row; i++) {
	for(let j = 0; j < col; j++) {
  	BOARD[i][j] = 1;
  }
}

1. forEach문 사용

BOARD.forEach((row, y) => {
  row.forEach((value, x) => {
    BOARD[y][x] = 1;
  });
});

⇒ 성능 측정 결과 2번의 경우가 가장 잘 나오게 됐고 이걸 채택했다.

(지금은 사진을 붙여 넣었지만 실제 작성할때는 결과를 따로 작성하고, 벤치마크 사이트에서 나온 결과를 링크로 추가할 예정)

라이트 하우스,

최적화 하기 전에