Firefox с лагами текста-тени, отлично работает на Chrome / Edge

Question

Я создаю веб-сайт, и у меня проблема с text-shadow и Firefox. Есть около 100 div, содержащих текст в фоновом режиме и со следующим css:

.hex {
    position: absolute;
    user-select: none;
    outline: none;
    writing-mode: vertical-lr;
    text-orientation: upright;
    cursor: pointer;
    opacity: 0.2;
    text-shadow: 0px 0px 3px rgba(148, 0, 211, 1)
}

Он отлично работает даже на Edge ... но Firefox, похоже, имеет проблему с text-shadow;если я на самом деле отключаю это правило, оно отлично работает и в Firefox.

При небольшом тестировании кажется, что производительность немного улучшается на FF при использовании filter: drop-shadow(0px 0px 3px rgba(148, 0, 211, 1);с другой стороны, это отстой от Chrome / Edge.

Какое здесь лучшее решение? Почему FF борется с тенью текста?

Answer 1

Я провел несколько тестов, и, похоже, Firefox не примет значение с rgba в свойстве text-shadow. Вы используете непрозрачность 1 в своем коде, поэтому там нет никакой пользы, попробуйте изменить его на text-shadow: 0px 0px 3px rgb(148, 0, 211)