Низкая производительность с таблицами в стандартном режиме Internet Explorer 8

При использовании таблицы с разумным объемом данных - 100 строк на 50 столбцов - я замечаю, что производительность IE8 неприемлемо снижается (только в режиме рендеринга стандартов IE8). Загрузка ЦП увеличивается до 100%, и браузер становится очень вялым. Увеличение количества данных в таблице усиливает медлительность.

Это стало очевидным при применении цвета фона при наведении курсора на строку, но снижение производительности, похоже, происходит при любом изменении стиля и не связано с обработкой события наведения.

Прилагается очень простой тестовый пример, с помощью которого я могу последовательно воспроизвести проблему.

Пара замечаний по проблеме:

  • Отчеты Dynatrace показывают, что почти 100% времени ЦП тратится на «Расчет» Общий макет ». Этого не происходит, если вместо таблиц (см. Ниже) используются
    .
  • Переключение режима документа на стандарты IE7 или режим совместимости с помощью панели инструментов разработчика устраняет проблему.
  • Срок выполнения. из-за ограничений, накладываемых на среду, в которой я работаю, IE8 работает в режиме браузера IE8 в режиме совместимости со стандартным режимом документов IE8. Изменение этого параметра с помощью панели инструментов разработчика не влияет на производительность.
  • Замена решения на
    / ] подход улучшает производительность, исключение количества узлов DOM само по себе как виновника.
  • В примере добавляются события наведения курсора мыши на каждый
  • , но использование делегирования событий не устраняет проблему. Фактически, если я заменю решение при наведении курсора мыши на setInterval , где каждые 50 мс выделяется случайная строка, происходит такое же снижение производительности.
  • Я протестировал и подтвердил это поведение на нескольких разных машинах (все Windows XP, Intel Core Duo @ 2.33 Ghz, с 3.5 GB RAM) в моей рабочей среде. Все демонстрируют одинаковое поведение.
  • Я тестировал HTML 4 Strict, XHTML 1.0 strict и HTML5 doctypes. Все демонстрируют одинаковое поведение.
  • Предварительный рендеринг таблицы на стороне сервера не влияет на производительность во время выполнения.
  • Использование table-layout: fixed и / или установка ширины в
  • не имеет никакого эффекта.

    Я считаю, что исчерпал свои возможности для улучшения производительности эффекта наведения курсора мыши с точки зрения программирования, и должен сделать вывод, что IE8

    не имеет никакого эффекта.
  • Использование стилей CSS через классы вместо управления стилями через JavaScript не имеет никакого эффекта.
  • Применение цвета фона к объектам
  • вместо
    работает крайне плохо - хотя, если это всегда так плохо Я удивлен, что не нашел дополнительной информации по этому вопросу.

    Надеюсь, кто-нибудь еще сможет подтвердить такое поведение в отдельной среде IE8 или указать на ошибку с моей стороны. Мне любопытно узнать, почему IE8 в стандартах работает намного хуже, чем IE6 или IE8, работающий в режиме IE7 / Quirks.


    
    
        
         
            IE8 Table Hover
        
        
            
     
    
    

    Контрольный пример @ jsfiddle

17
задан Brian Tompsett - 汤莱恩 11 August 2017 в 13:10
поделиться