Font Awesome Performance - PullRequest
       11

Font Awesome Performance

3 голосов
/ 14 марта 2019

Я использую font-awesome 5.6.1 библиотеку для заполнения таблицы множеством строк и столбцов. Для каждого ряда есть около трех шрифтов. Шрифт обычно определяется так:

<a href="#" class="d-inline" title="Lock Event" onclick=lockEvent()><i class="fas fa-lock"></i></a>

Однако я заметил огромный скачок производительности после примерно 50 значков на экране. Загружаемые таблицы иногда содержат до 1000 строк, что составляет около 3000 значков. Загрузка браузера Chrome занимает около 30 секунд, если он полностью не падает (только шрифты).

Является ли то, что я испытываю реалистичным исполнением для библиотеки FA? Или я что-то не так делаю?

UPDATE

Дальнейшие исследования показывают, что шрифты были фактически созданы как svg. Пытаясь выяснить, почему это произошло, я указываю шрифты CSS как таковые:

 cell1.innerHTML = `<a href="#" class="d-inline" title="Unlock Event" onclick=unlockEvent()><i class="fas fa-unlock"></i></a>`;

UPDATE

Произошло то, что я указал на файлы FA CSS и JS. Таким образом, браузер использовал код JS для генерации SVG. Убедитесь, что у вас есть только CSS!

Ответы [ 2 ]

0 голосов
/ 14 марта 2019

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

0 голосов
/ 14 марта 2019

Как поживаете в Font Awesome? Если вы просто включите в своей голове:

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">

Вы сможете делать то, что делаете, без проблем, и оно не будет генерировать svg.

...