1. 루프
bad case :
for( let i = 0; i < arr.length;, i++){
better :
let l = arr.length;
for(let i =0; i<l;i++){
루프가 반복될 때마다 배열의 length 속성에 접근하여 실행 속도가 느려진다고 한다.
2.Dom 접근
HTML DOM에 접근 하는것은 script 문법에 비해 매우 느리다고 한다.
Dom에 접근해야 할 경우 최소한으로 접근하여 로컬변수로 저장하여 사용
ex) const obj = document.getElementById("target");
obj.innerHTML = "hellow world!";
3. DOM 크기 줄이기
HTML DOM의 요소 수가 적을 수록 성능에 유리
DOM을 검색하는 모든시도(getElementsByTagName)는 더작은 DOM에서 유리
4. 불필요한 변수 제거
값을 저장 해야 하는게 아니라면 변수를 사용하지 않는다
badcase :
let fullName = firstName + " " + lastName; document.getElementById("target").innerHTML = fullName
better :
document.getElementById("target").innerHTML = firstName + " " + lastName;
출처:w3schools.com/js/js_performance.asp
2,4 번의 경우는
평소 디버깅 편의성 때문에
코딩에서 자주 나오는 습관인데
주의해야 겠습니다.
'JavaScript' 카테고리의 다른 글
javascript - 배열 검색 search array (2) | 2024.10.17 |
---|---|
JavaScript Array.prototype.at() (0) | 2024.10.16 |
Javascript Variables (0) | 2024.10.07 |
JavaScript document.getElementById (0) | 2024.10.01 |
[Javascript]마우스 좌표 가져오기 (0) | 2019.06.30 |