IE11에서 페인트 작업 시간

Question

각도 4와 함께 ag-grid를 사용하고 있습니다. IE11에서 페인트 시간이 다른 상황에서 더 높다는 문제가 있습니다. 한 예를 들어, 필자는 10-15 행의 매우 기본적인 편집 불가능한 테이블을 가지고있다. 테이블 위로 마우스를 가져 가면 프레임 속도가 떨어지기 시작합니다. 성능을위한 프로파일 링 페인트 이벤트가 매우 빈번하게 발생하고 완료하는데 200 - 400ms가 걸리는 것을 볼 수 있습니다.

3000 개가 넘는 전체 화면 검색 모달에서이 동일한 테이블 구성 요소를 사용하면 페인트 이벤트가 훨씬 적게 발생하고 몇 밀리 초 밖에 걸리지 않습니다. 내가 본 가장 긴 페인트 이벤트는 약 20ms였습니다.

어디서부터 시작해야합니까? 각도 성분의 컨텍스트가 페인트 속도에 어떤 영향을 줄 수 있는지 알아 내기 위해 내가 알아야 할 것들은 무엇입니까?

Answer 1

해결책을 찾을 수있었습니다. 오버 플로우 : 숨김, 테두리 반경> 0 인 요소에서 IE11의 버그가 매우 낮아서 렌더링 성능이 떨어지는 것으로 나타났습니다. 제 경우의 해결책은 부모 div에서 테두리 반경을 제거하는 것이 었습니다.

How does overflow: hidden; & border-radius on a container cause massive slowdowns to "Paint/Render Layer" within container, only on IE?

:

여기 https://connect.microsoft.com/IE/feedbackdetail/view/961961/ie-9-ie-11-divs-with-a-border-radius-and-overflow-other-than-visible-resize-slow-when-filled-with-divs-with-position-relative

날이 문제를 해결 도움이 다른 스택 오버 플로우 게시물입니다 : 여기

버그 보고서입니다