Путать результаты теста скорости для шрифтов Google - <link> vs @import
Я видел несколько постов о сравнении этих двух методов, я буду связывать посты внизу, но меня смущают мои собственные результаты теста скорости.
Во время тестирования скорости / оптимизации нашего сайта я обнаружил, что<<ссылка '>' для Google Fonts:
<link href='https://fonts.googleapis.com/css?family=Roboto:100,300,400' rel='stylesheet' type='text/css'>
отображается как ресурс блокировки рендеринга с потенциальной экономией рабочего стола 230 мс, мобильной 780 мс.
Используя фрагмент @import для того же шрифта:
@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400');
Я удалил '<' link '>' из головы и поместил это в одну из наших таблиц стилей (которая также живет в голове), но не заметил каких-либо изменений в потенциальной экономии времени для этой таблицы стилей после выполнения большей скорости / оптимизации тесты. Единственное отличие, которое я заметил, заключается в том, что ссылка на шрифты Google больше не указана в ресурсах, блокирующих рендеринг.
Я не совсем понимаю, почему результаты потенциальной экономии времени в таблице стилей, которая теперь содержит фрагмент @import, вообще не увеличились, хотя это может быть из-за того, что я в корне неправильно понимаю показатели скорости. Любое понимание, предупреждения или предложения будут с благодарностью.
Полусвязанные посты: