LESS для Font Awesome в баннер и перед ником.

[Skaiman]

Решение отказаться от фонтов и использовать как минимум SVG формат...

Да ты че :) чем же к примеру иконки шрифта Font Awesome, тяжелее чем svg?

 

[MrBurn]

Да ты че :) чем же к примеру иконки шрифта Font Awesome, тяжелее чем svg?

Я думаю ресурсозатратнее обратится к целой библиотеке чем к определённому? Не так ли?
и + находится "изображение" на твоём хостинге с веб. ресурсом или нужно еще дальше обращаться за результатом?

 

[25517]

MrBurn, ну да, ну да, пошли мы нахер.

 

[Skaiman]

Я думаю ресурсозатратнее обратится к целой библиотеке чем к определённому? Не так ли?

Обращение идет непосредственно к иконке

и + находится "изображение" на твоём хостинге с веб. ресурсом или нужно еще дальше обращаться за результатом?

а шрифт где находится?

 

[Matew]

именно фонт-авесом даёт нагрузку, и не спорь если не работал с крупными ресурсами

Если вы не можете правильно настроить отдачу и кэширование нескольких статических элементов, коими являются файлы шрифтов, то надо решать эту проблему, а не пытаться найти что-то еще. А ваши слова про JS я вообще не понял. Какой JS при работе с FA иконками?

Да ты че :) чем же к примеру иконки шрифта Font Awesome, тяжелее чем svg?

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

 

[25517]

Font Awesome подгружается изначально.

После, его кеширует браузер.


После, браузер берёт шрифт из кеша.

К слову

Чтобы у меня браузер не кешировал стили и шрифты я всегда ставлю галочку для этого.

Все последующие манипуляции с FA, никак не влияют на производительность.
От слова совсем.

Хотите ускорить загрузку страницы - избавьтесь от стилей совсем.
А чтобы ускорить ещё в несколько раз, избавьтесь от базы данных, ЯП на бэке.

Голый штмл без стилей.

 

[MrBurn]

Skaiman, обращение к иконке но через всю библиотеку и это факт. Чтобы получить одно, нужно загрузить всё. Тебе не даром сам сайт авесома даёт возможность забрать вектора в свг, чтобы ты не мучал хостинг.

Да и вообще не все приложения готовы отображать шрифты правильно как нам этого хотелось бы.

Какой JS при работе с FA иконками?

Обычные костыли же.

 

[Skaiman]

ебе не даром сам сайт авесома даёт возможность забрать вектора в свг, чтобы ты не мучал хостинг.

для отображения в разных браузерах и разных ос

Все хватит флудить в теме :)

 

[25517]

MrBurn, первое обращение к психиатру проходит через регистратуру.

После, если психиатр вас зафиксировал (закешировал), не нужно обращаться в регистратуру.
Также, когда вы на приёме у психиатра (подгружено), любой вопрос к нему ничего не стоит.
Вы уже у него на приёме.

 

[MrBurn]

25517, первое обращение к психиатру проходит через регистратуру.

Именно об этом я и писал выше, о новых пользователях.

 

[Matew]

Именно об этом я и писал выше, о новых пользователях.

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

 

[25517]

Matew, тут ключевое слово -

хостинга

 

[Narberal Gamma]

Делаем иконку и цвет персонально. Третий вариант.

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

 

[Skaiman]

После кода

.username-user-id (@userId, @content, @usernameColor: false) {
    .username {
        &[data-user-id="@{userId}"] {
            [class*="username--style"] {
                &when (iscolor(@usernameColor)) {
                    color: @usernameColor;
                }
                &:before {
                    content: "\@{content}";         
                }
            }
        }
    }
}

.username {
    & :before {
        .m-faBase();
        padding-right: 4px;
    }
}

Добавить

.username-user-id (@userId, @content, @usernameColor: false) {
    .memberProfileBanner[style*="background-image: url"] {
        .username {
            &[data-user-id="@{userId}"] {
                [class*="username--style"] {
                    &when (iscolor(@usernameColor)) {
                        color: @usernameColor;
                    }
                    span {
                        &:before {
                            .m-faBase();
                            padding-right: 4px;                       
                            content: "\@{content}";         
                        }
                    }
                }
            }
        }
    }
}

 

[Skaiman]

Короче исправил выше

 

[pandolfomercer]

Делаю по пользователю - не работает, делаю по группе пользователя - не работает.

 

[Benjamin Willson]

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

 

[Skaiman]

Если выдать участнику другую группу

Так то у другой группы и id другой :) приоритет ни при чем