Повторение с проблемами производительности пользовательских элементов в IE

У нас есть некоторые проблемы с производительностью с IE10/11. Следующий плункер объясняет некоторые из наших ухудшающихся характеристик, повторяя строки таблицы с настраиваемыми элементами.Повторение с проблемами производительности пользовательских элементов в IE

Plunker Example

code

В этом plunker примере, мы получаем в общей сложности 68 мс в хроме, чтобы сделать всю таблицу. В IE11 мы получаем 280 мс и видим 100% -ное увеличение скорости рендеринга в строке. В то время как chrome делает до 3 строк в мс, IE делает это каждые 2 мс.

Этот plunkr является базовой моделью нашего приложения. В нашем приложении мы повторяем следующий шаблон, который намного тяжелее. Он включает в себя расчет стиля и отображение/скрытие привязок в зависимости от настроек пользователей и уровня разрешений.

Это на шведском, так что не против текста.

Вторая строка (расширенная информация) является if.bound, поэтому она не нарисована изначально.

В нашем приложении, если визуализировать представление со 100 строками нашего шаблона, chrome отображает всю таблицу в 587 мс. IE11 делает это в 3779мс. Edge делает это в 1283ms и Firefox 909ms.

Каждая строка занимает около 30 мс в IE11,

Есть ли какой-либо причине IE11 должен выполнять намного хуже с Aurelia-шаблон? Что мы можем сделать для повышения скорости рендеринга IE? Я попытался установить привязки к oneTime, но это мало что делало. Есть ли что-то, чего вам следует избегать в пользовательских элементах, которые не работают с повторением и IE. Нам нужны пользовательские элементы из-за возможности повторного использования и управления кодом, так как шаблон довольно большой.

источник

2016-11-04 Anders

Используете ли вы синюю птицу для обещаний? –

Да, мы делаем, bluebird: 3.4.6 – Anders

Я опубликовал вопрос с командой aurelia https://github.com/aurelia/polyfills/issues/39 и проектом github https://github.com/4nderss/aurelia-performance-test, воспроизводящим мои проблемы.

Команда Aurelia закрыла проблему, чтобы на IE11 не было никаких исправлений.

Редактировать: Команда aurelia нашла проблему, и теперь она исправлена

источник

2016-11-14 07:32:50 Anders

Похоже, были какие-то проблемы с IE, команда aurelia работает над исправлением. – Anders

Я оставлю свой ответ, потому что там есть какая-то хорошая информация. Надеюсь, кто-то еще придет и поддержит ваш ответ, хотя и поставит его наверх. –

Убедитесь, что вы используете обновленную версию Aurelia и убедитесь, что используете Bluebird, если вам нужно поддерживать IE или более старые версии Edge, так как их реализации Promise ужасно плохие.

Если заменить index.html в вашем Plunkr с этим:

<!doctype html> 
<html> 
    <head> 
    <title>Aurelia</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="styles.css"> 
    </head> 
    <body aurelia-app> 
    <h1>Loading...</h1> 

    <script src="//cdn.jsdelivr.net/bluebird/3.4.5/bluebird.min.js"></script> 
    <script src="https://jdanyow.github.io/rjs-bundle/node_modules/requirejs/require.js"></script> 
    <script src="https://jdanyow.github.io/rjs-bundle/config.js"></script> 
    <script src="https://jdanyow.github.io/rjs-bundle/bundles/aurelia.js"></script> 
    <script src="https://jdanyow.github.io/rjs-bundle/bundles/babel.js"></script> 
    <script> 
     require(['aurelia-bootstrapper']); 
    </script> 
    </body> 
</html>

Тогда время создания последнего ряда на моем рабочем столе находится в IE 11 278 ms на окно 10. Смотрите здесь: plunkr

источник

2016-11-04 22:40:50

Теперь я обновил свой plunkr. Я не понимаю, как ваш ответ помогает нашему делу, его же скорость на вашем plunkr. Но есть еще тот факт, что IE10 намного медленнее. Нет ли способа повысить производительность с помощью IE10 и aurelia? В нашем реальном приложении мы уже используем последнюю версию aurelia. Я сделал небольшое сравнение с угловым2, не преобразовывая всю вещь http: // plnkr.co/edit/7VGTXg4MQ6QIN1ZJ0eqx? p = preview Интересно, что угловой 2, кажется, отображает каждую строку в течение 10 мс после рендеринга первой строки (что медленнее). Но в целом быстрее. – Anders

У меня действительно есть чувство, что мы сравниваем здесь яблоки и апельсины. Способ, которым Aurelia и NG2 управляют DOM, совершенно разные, и это показано тем, как отличаются таймеры. Угловой 2 имеет свой собственный JavaScript-парсер JavaScript и не работает напрямую с DOM, как Aurelia. Таким образом, время, указанное вашим кодом NG2, не является «честным». –

Хотелось бы, чтобы у нас был способ запустить оба этих plunkrs бок о бок, пробивая одновременно. Неоднократно. Я неоднократно повторяю b/c. Я вижу совершенно разные времена выполнения, сообщаемые для обеих версий, за многократные прогоны в виртуальной машине IE10/Win7. При этом, как Aurelia, так и Angular 2, кажется, работают довольно медленно для первого рендеринга в IE 10. Я собираюсь сыграть с несколькими вещами, чтобы увидеть, как меняется воспринимаемая скорость. –

Повторение с проблемами производительности пользовательских элементов в IE

ответ

Смежные вопросы