Загружает ли Web Font Loader кеширование шрифтов?

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

Вот как я загружаю шрифт:

 <script>
    WebFont.load({
        custom: {
            families: ['Univers45custom', 'Univers45customIE']
        }
    });
</script>

Я использую Web Font Loader v1.5.10.

Добавление BramVanroy: эта нехватка кэширования также присутствует при использовании веб-сайтов Google. FOUT (Flash Unstyled Text) ненадолго появляется на веб-сайте, который использует загрузчик шрифтов даже после перезагрузки страницы несколько раз.

Редактировать по eldi: Привет, BramVanroy → Сейчас я не совсем уверен, как я обошел эту проблему, но, вероятно, я просто использовал @font-face. Причина, по которой я тестировал Web Font Loader, был FOUT в первую очередь. Loader добавляет класс css в элемент html, который предоставляет вам способ стилизации вашей страницы без правильного шрифта, когда шрифты загружаются, а класс уходит, и ваш "стандартный" стиль присутствует. Это работает как ожидалось, но с исключением "отсутствия кэширования", которое в моей ситуации было неприемлемым. Я верю, что обходное решение staypuftman с изменением HTTP-заголовка выполнит эту работу, у меня нет времени на его тестирование, особенно мне нужно будет провести некоторое исследование, чтобы найти способ установить его в asp.net-хостинг-провайдере, поскольку установка его из приложения будет добавьте дополнительное время обработки.

Ответ 1

Web Font Loader не имеет кэширования, но ваш браузер кэширует шрифт, если - и только если - вы фактически используете его на своем сайте где-то. Убедитесь, что шрифт вызывается на интересующей вас странице.

Вы можете убедиться, что все кэшируется, заставляя заголовок управления кешем HTTP (неплохо сгладить это в Google Developers). Я обычно устанавливаю это через Apache, как это (есть много других способов сделать это, хотя):

#Set cache-control HTTP header for public with max time
Header set Cache-Control "max-age=290304000, public"

Если все это не удастся, лучшим способом, я могу думать о том, чтобы взять дело в свои руки, было бы установить cookie, проверить его и загрузить шрифты соответственно. В вашей ситуации код будет выглядеть примерно так:

// 1- Check for cookie, if it not present we enter this conditional
if (!font_is_cached) {
  $(window).load(function() {

    // 2- Load your webfont, this would put the font in cache
    WebFont.load({
      custom: {
          families: ['Univers45custom', 'Univers45customIE']
      }
    });

    // 3- Set cookie indicating fonts are cached
    // This leverages Filament Group cookie.js as a dependency
    // https://github.com/filamentgroup/cookie/blob/master/cookie.js
    // Sets a one-day session cookie
    cookie( "font_is_cached", "true", 1 );
  });
}

Дополнительные ресурсы

  • Филаментная группа имеет отличный снимок загрузки шрифтов. Они не используют загрузчик веб-шрифтов, но вы можете следить за тем, что они делают.
  • CSS-трюки обводят нечто подобное тому, что я имею в виду, но они явно устанавливают cookie на back-end, прежде чем делать фронт -end check/set, который я изложил.

Ответ 2

WebFont Loader будет кэшировать шрифт в веб-браузере в течение 1 года, вот подробная информация о том, как вы можете загружать webfont end detail home много времени, которое будет в кеше браузера.

http://peterwilson.cc/caching-google-webfont-loader/

Веб-загрузчик шрифтов

Web Font Loader дает вам дополнительный контроль при использовании связанных шрифтов через @font-face. Он обеспечивает общий интерфейс для загрузки шрифтов независимо от источника, а затем добавляет стандартный набор событий, которые вы можете использовать для управления загрузкой. Web Font Loader может загружать шрифты из Google Fonts, Typekit, Fonts.com и Fontdeck, а также собственные веб-шрифты. Он совместно разработан Google и Typekit.