Что можно сделать, чтобы улучшить поведение IE11 с помощью Angular Material?

Я работаю над проектом Angular, в котором я использовал компоненты Angular Material (в основном md-Buttons). Приложение показывает различные плитки, каждая из которых является md-Button. За раз у меня будет максимум 20-30 плиток. Эти плитки повторяются с использованием ng-repeat.

Приложение достаточно хорошо работает в Chrome, однако в IE11 я регулярно сталкиваюсь с проблемами рендеринга. Рендеринг занимает около 5-6 секунд. Переключение отображения плитки работает плохо. Прокрутка экрана приводит к тому, что компоненты залипают, а затем перемещаются, скажем, через 1 секунду.

Вероятно, я думаю, что Angular Material слишком тяжел для IE11. Есть ли что-то, что я могу сделать, чтобы ускорить работу в IE11, так как это мой основной целевой браузер?

Я пытался:

  1. Обновление библиотек Angular.
  2. Использование патча MS052
  3. Удаление нескольких переходов из Angular Material css.

Ничто из вышеперечисленного, кажется, не имеет большого эффекта.

Я думаю, что материал Angular — хорошая библиотека, и нужно что-то сделать, чтобы улучшить его работу в IE11. Пожалуйста, может кто-нибудь предложить что-то эффективное?


angularjs angular-material internet-explorer-11
person Saurabh Tiwari    schedule 24.09.2015    source источник

Ответы (3)


arrow_upward
5
arrow_downward

Мы также работаем над проектом angular и сталкиваемся с проблемами производительности в Internet Explorer 11.

Я нашел эту ошибку на github, которая мне помогла: https://github.com/angular/material/issues/1771

Решение: в последней версии 0.11.1 они работали над проблемами отображения макета для Internet Explorer, поэтому я просто обновил материал angular до версии 0.11.1 и добавил эту строку в свой файл JavaScript конфигурации angular:

$provide.constant('$MD_THEME_CSS', '/**/');

Улучшена производительность для Internet Explorer 11.

person Vincent Cueto    schedule 28.09.2015

arrow_upward
0
arrow_downward

Я обнаружил, что оборачивая все мои js в IIFE и добавляя «use strict;» везде, где это уместно, значительно улучшилась производительность моего приложения Angular Material. Это все еще медленнее, чем Chrome в IE, но производительность неприемлема.

person Mike Feltman    schedule 28.09.2015

arrow_upward
0
arrow_downward

Проблема с CSS.

Используйте NPM-модуль clean-css, чтобы CSS, совместимый с IE, запускался ниже кода на runkit.com и оптимизировал CSS для IE. Для получения дополнительной информации см. параметр совместимости clean-css.

https://runkit.com/npm/clean-css-pre-2.1. 0

var request = require("request")
CleanCSS = require("clean-css-pre-2.1.0")

var url = "https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.1.1/angular-material.min.css"

request({
    url: url,
}, function (error, response, body) {

    if (!error && response.statusCode === 200) {
        var source = body;
        var minimized = new CleanCSS({compatibility : '*'}).minify(source);
        console.log(minimized)
    }
})
person Vishal Salunkhe    schedule 13.12.2016