Question

我将在我的“ Drupal 8”站点上以“ Bootstrap”主题托管“ Font Awesome”字体。

我在网站上使用SVG版本。

这是我的bootstrap_subtheme_front_office.libraries.yml文件：

bootstrap:
  version: 3.4.1
  js:
    bootstrap/js/bootstrap.min.js: {}
  css:
    component:
      bootstrap/css/bootstrap.min.css: {}
      ../../contrib/bootstrap/css/3.4.1/overrides-cosmo.min.css: {}
fontawesome:
  version: 5.7.2
  header: true
  js:
    fonts/fontawesome/js/all.min.js: {}
bootstrap-toggle:
  version: 2.2.0
  js:
    js/bootstrap-toggle.min.js: {}
  css:
    component:
      css/bootstrap-toggle.min.css: {}
global:
  js:
    js/bootstrap.js: {}
    js/back-to-top.js: {}
  css:
    component:
      css/style.css: {}

这是我的bootstrap_subtheme_front_office.info.yml文件：

name: Bootstrap Sub-Theme Front Office
type: theme
description: 'Uses the Bootstrap framework LESS source files and must be compiled (not for beginners).'
core: 8.x
base theme: bootstrap
libraries:
  - bootstrap_subtheme_front_office/bootstrap
  - bootstrap_subtheme_front_office/fontawesome
  - bootstrap_subtheme_front_office/bootstrap-toggle
  - bootstrap_subtheme_front_office/global
regions:
  navigation_collapsible_first: 'Navigation (Collapsible first)'
  navigation_menu_first: 'Navigation (Menu first)'
  navigation_notification_first: 'Navigation (Notification first)'
  navigation_logo: 'Navigation (Logo)'
  navigation_notification_second: 'Navigation (Notification second)'
  navigation_menu_second: 'Navigation (Menu second)'
  navigation_collapsible_second: 'Navigation (Collapsible second)'
  breadcrumb: 'Breadcrumb'
  header: 'Top Bar'
  sidebar_first: 'Primary'
  highlighted: 'Highlighted'
  help: 'Help'
  content: 'Content'
  sidebar_second: 'Secondary'
  footer: 'Footer'

当我在智能手机上测试网站的显示时，它可以正常工作：

enter image description here

但是，我的一些访问者在加载“ Font Awesome”时遇到问题。 pilice无法加载，我的印象是Internet浏览器尝试加载警察，并且在延迟后他放弃了：

enter image description here

我在网站上使用了很多“ Font Awesome”字体（用于导航，菜单等）。如何解决这个问题？

https://developers.google.com/speed/pagespeed/insights/?hl=fr&url=https%3A%2F%2Fwww.s1biose.com%2Ffr%2Farticle%2Fla-spiruline-une-micro-algue-dans-nos-assiettes&tab=desktop

在Drupal和Bootstrap上加载“ Font Awesome”非常慢

0 个答案: