사이트 맵 로딩 속도 개선하기
템플릿 가이드 문서를 보고 사이트 맵을 설정해두고 보니 로딩이 엄청 느렸습니다.
뭔가 잘못돼도 한참 잘못된 느낌을 받았습니다. 특히나 성능덕후(?)로서 기본 블로그 로딩도 느린데 저 페이지마저 저렇게 보이니 참을 수 없어 부족한 실력에 자바스크립트 최적화를 찾아봤습니다.(검색어는 "javascript performance") 이런저런 정보를 훑어 본 후 for문에 length를 참조하는 것과 aaa.bbb.ccc등의 참조를 var ab = aaa.bbb; ab.c 등으로 변경하는 작업을 해봤습니다.
Javascript 최적화 코드 예제
//before
for(var i = 0; i < aaa.bbb.ccc.length; i++){
name = aaa.bbb.ccc.name;
//do someting
}
//after
abc = aaa.bbb.ccc;
for(var i = 0, len = abc.length; i < len; i++){
name = abc.name;
//do someting
}
대충 정리하자면 위와 같은 방식으로 변경을 했더니 엄청나게 만족할만한 결과를 얻었습니다.😻
페이지 진입하자마자 sitemap이 안보이고 바로 목록이 나오길 원했는데 실력부족탓에 더 이상은 힘들듯 하다.(아마 ajax통신 로딩속도로 이정도가 최선일듯하다.) 이렇게 작은 퍼포먼스 튜닝에 따라 엄청난 차이를 느끼다 보니 성능최적화의 매력에 빠지는거 같습니다.ㅎㅎ
