Как предотвратить мерцание с двойным определением webfont?

Question

Предположим, у меня есть webfont, определенный в правиле CSS @font-face. Во время выполнения я хочу добавить еще CSS через JS. Я не говорю о .

Так получилось, что мой каркас иногда добавляет тот же самый @font-face правило. Оказывается, Firefox и Chrome пытаются повторно загружать (или загружать диск) файлы шрифтов, и это вызывает мерцание.

Demo: http://jsfiddle.net/Hg9Pc/ _{(Firefox, это частный случай, отлично работает в Chrome)}

Есть ли способ, чтобы предотвратить это мерцание, кроме «просто не сделать это?» Сумасшедшие заголовки кешей или еще что-то?

Answer 1

Я не думаю, что вы можете предотвратить мерцание, если вы на самом деле вызывают еще один звонок @font-face. Тем не менее, кажется, что вы могли бы сделать одно из следующих двух вещей:

1. Имейте Javascript просеять и удалить, что дополнительное определение перед загрузкой его в страницу (это будет правда, будет довольно сложно задача, на мой взгляд, но не невозможная).

2. Если вы можете, определите первоначальную реализацию с помощью другого имени шрифта. Например, исходный шрифт может быть определен как My Arial, поэтому позже, когда Arial (я знаю, что вы не использовали бы @font-face для Arial, это просто для примера) загружается через фреймворк (оба из которых указывают на тот же файл для определения) мерцание не должно происходить, потому что на самом деле страница не пытается заменить определение My Arial. Проблема с этим была бы, если бы был когда-нибудь экземпляр, где вы do хотите, чтобы он был переписан, это не так.