Загрузка шрифтов Google без блокировки для Google Insights

Я пытаюсь передать информацию о скорости страницы Google, и я не могу получить «Устранить блокирующий рендеринг JavaScript и CSS в содержимом верхней части страницы», потому что загружается шрифт Google. Ни одно из предложений Google Insights не кажется применимым в этом контексте: встраивание css, использование медиа-запросов и т. д. Я даже пытался асинхронно загрузить веб-шрифт с помощью WebFontLoader, но он по-прежнему попадает в Insights.

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

ОБНОВЛЕНИЕ

Упаковка веб-шрифта с помощью Webpack, по-видимому, также работает, но я не уверен, что это «правильное» решение.


javascript html css google-pagespeed
person konrad    schedule 06.09.2016    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Я разрешил это уведомление о блокировке рендеринга, загрузив URL-адрес шрифта Google с помощью javascript/jquery.

Вы устанавливаете, например:

$('head').append("<link href='https://fonts.googleapis.com/css?family=Raleway:300' rel='stylesheet' type='text/css'>);

в файл .js, который вы загрузите как

<script src="your.js" async></script>
person Kyobul    schedule 21.01.2017
comment
Вы только делаете Insights неспособным обнаруживать блокировку рендеринга. Вы не решаете саму блокировку рендеринга, а немного усугубляете ее с точки зрения скорости загрузки страницы и пользовательского опыта. Это как перерезать измерительную ленту, потому что вы понимаете, что только что созданный вами предмет мебели не поместится в отведенное ему место. Мебель от этого не встанет. - person tao; 21.01.2017
comment
Могу я с вами не согласиться. Нет цели обмануть анализ Pagespeed и обмануть его так, как вы его представляете. Отложенные/асинхронные сценарии достаточно быстры и просто выполняют свою работу. Как, по вашему мнению, работают динамические селекторы шрифтов? Я не замечаю измененного пользовательского интерфейса, по крайней мере, на своих веб-сайтах. И, наконец, Pagespeed этим доволен. - person Kyobul; 22.01.2017