- 5
- 네모
- 조회 수 1343
생각없이 코드 짜다보면 놓치기 쉬운 중첩 반복문의 배치.
지금 바로 알아봅시다.
아래엔 똑같은 결과물을 가져다주는 2개의 다른 코드가 있습니다.
// Case A
for(var i = 0; i < 100; i++){
for(var j = 0; j < 1000; j++){
for(var k = 0; k < 10000; k++){
// 쓰담쓰담
}
}
}
// Case B
for(var i = 0; i < 10000; i++){
for(var j = 0; j < 1000; j++){
for(var k = 0; k < 100; k++){
// 쓰담쓰담
}
}
}
A와 B 모두 총 반복 횟수는 100 * 1000 * 10000
으로 천만회의 루프를 타게 됩니다.
그런데 과연 두 코드의 실행 속도는 동일할까요?
console.time
함수를 사용하여 간단하게 측정해 봅시다.
// Case A
(function(){
console.time();
for(var i = 0; i < 100; i++){
for(var j = 0; j < 1000; j++){
for(var k = 0; k < 10000; k++){
// 쓰담쓰담
}
}
}
console.timeEnd();
})();
A 케이스의 평균 실행시간은 약 360ms 정도가 나옵니다.
// Case B
(function(){
console.time();
for(var i = 0; i < 10000; i++){
for(var j = 0; j < 1000; j++){
for(var k = 0; k < 100; k++){
// 쓰담쓰담
}
}
}
console.timeEnd();
})();
A에 비해 B 케이스의 경우 405ms 수준의 실행시간을 가집니다.
실행 순서를 약간 변경했을 뿐인데, 무려 50ms 의 차이를 보입니다.
사실 조금만 생각해보면, 왜 이러한 결과가 나오는지 알아차릴 수 있습니다.
코드를 간소화하여 비교해 봅시다.
// Case A
for(var i = 0; i < 10; i++){
for(var j = 0; j < 100; j++){
// 쥬물쥬물
}
}
// Case B
for(var i = 0; i < 100; i++){
for(var j = 0; j < 10; j++){
// 쥬물쥬물
}
}
A 케이스에서 var j
가 선언되는 횟수는 10 회인 반면, B 케이스에서는 var j
가 총 100 회 선언됩니다.
이런 간단한 수준의 반복문에서도 무려 10배의 차이가 나타납니다.
이러한 결과를 보았을 때, 우리는 아래와 같은 교훈을 얻을 수 있습니다.
1 - 중첩 반복문에서 반복횟수가 많은 반복문을 안에 위치할수록 더 유리해진다.
2 - 이런 사소한 것들도 고려하며 코드를 작성해도, 우리의 월급은 그대로다.
님 포함 2명이 추천
추천인 2
작성자
댓글 5
![comment menu](/modules/board/skins/comely_board/images/icn_more.png)
2021.09.30. 17:43
![profile image](/files/member_extra_info/profile_image/145/220/220145.jpg?t=1603012768)
일단 컴파일 언어에서도 많이 실행되는 루프가 내부에 있는게 유리합니다.
다만 모 유저분의 분석에 따르면, 천만회 수준까지 올라가야 유의미한 차이를 보인다고 하네요.
증감 연산자나 분기 예측에 따른 코스트 차이가 있어 큰 루프가 내부에 있는것이 유리한 것은 맞으나,
말씀하신대로 컴파일러의 최적화 덕분에 웬만해선 큰 차이가 없다 합니다.
설령 실질적인 차이가 없더라도,
저런 형태의 루프문을 사용해야 할 경우 가독성을 해치지 않는 수준에서는 내부의 루프가 더 크게 작성하는 것이 올바른 방향이 아닐까 생각합니다.
다만 모 유저분의 분석에 따르면, 천만회 수준까지 올라가야 유의미한 차이를 보인다고 하네요.
증감 연산자나 분기 예측에 따른 코스트 차이가 있어 큰 루프가 내부에 있는것이 유리한 것은 맞으나,
말씀하신대로 컴파일러의 최적화 덕분에 웬만해선 큰 차이가 없다 합니다.
설령 실질적인 차이가 없더라도,
저런 형태의 루프문을 사용해야 할 경우 가독성을 해치지 않는 수준에서는 내부의 루프가 더 크게 작성하는 것이 올바른 방향이 아닐까 생각합니다.
![comment menu](/modules/board/skins/comely_board/images/icn_more.png)
2021.10.01. 00:21
![profile image](/files/member_extra_info/profile_image/852/368/368852.png?t=1583473743)
어? 생코에서 똑같은 글을 본 적이 있는데.....?
![comment menu](/modules/board/skins/comely_board/images/icn_more.png)
2021.10.01. 10:53
![profile image](/files/member_extra_info/profile_image/145/220/220145.jpg?t=1603012768)
ㅋㅋㅋㅋㅋㅋ 저도 협스님 글 자주 보고 있습니다 :)
![comment menu](/modules/board/skins/comely_board/images/icn_more.png)
2021.10.01. 22:01
![profile image](/files/member_extra_info/profile_image/852/368/368852.png?t=1583473743)
잘 봤습니다. ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ
![comment menu](/modules/board/skins/comely_board/images/icn_more.png)
2021.10.02. 16:51
권한이 없습니다.
자바스크립트 JIT 관련 문제로 추정됩니다
HotPath를 컴파일하는 특성상 더 많이 실행되는 루프가 내부에 있는 것이 유리하겠군요
C/C++같은 컴파일 언어에서는 컴파일러가 알아서 최적화 할것 같습니다.