안녕하세요. 평소 정성태님의 닷넷이야기를 자주 즐겨보고 있습니다.
저는 웹 프로그래밍중 , 자바스크립트 관련하여 ie10에서 호완이 안되는 부분이 있어 질문드립니다
windows7, ie10에서 html로 구성된 테이블 tr td (총 1000건 이상의 행)에서 이벤트를 작동시킬때 느림현상이 있어 문의드립니다.
특히 에뮬레이션 문서모드에서 edge모드로 실행하면 테이블의 스크롤이 느려지고,
에뮬레이션 문서모드를 5로 설정하면 한 행의 체크박스가 급격히 느리게 선택되는 현상이 있습니다.
<에러나는 부분>
<tr bordercolor="#CCCCCC">
<td height="19" class="style5"><div align="center">1</div></td>
<td height="19" class="style5" align="center"><input style="align:center" type="checkbox" name="key" id="key0" value="4101322629:10 "/></td>
<td height="19" class="style5"><div align="center">2015-08-06</div></td>
.
.
.
(1000개 이상의 td)
UA 문자열은 기본값이고, 브라우저프로필도 데스크탑입니다.
ui응답성 결과를 보고 분석을 해본결과,
스타일지정시 걸리는 시간이 cpu사용율을 100%차지하면서 한행의 체크박스 하나를 선택하는데만 5초가 걸립니다.
특히 <input id ="key<%=i%>"> 이런식으로 key값을 지정하는 document 요소에 대해서 부하가 많이 걸리는것 같습니다.
"ui응답성결과에 따르면 스타일계산,그리기 항목에서 시간이 많이 소요되며 ,
dom이 시각적으로 변경되어 영향받는 페이지의 모든 부분을 다시그렸음" 이라고 나오는데
체크박스 한번에 화면이 전체가 깜빡거리는 (dom을 다시 그리는) 현상이 발생하고 있는 것 같습니다.
체크박스선택시 실행되는 자바스크립트 이벤트는 없습니다.
기존에 windows xp에서 실행하거나 크롬에서 실행하면 정상적으로 작동되는 부분이며,
혹시 적절한 해결책이나 소스 조언, 혹은 설정변경 방법등을 정중하게 구합니다
[최초 등록일: ]
[최종 수정일: 7/29/2015]