How to improve NuxtJS website performance by loading web fonts asynchronously

In an attempt to improve the scores on the google lighthouse test I was browsing through different plugins available that achieved greater performance on NuxtJS projects. One thing that usually always crept up in google lighthouse results was that of importing fonts from google in a script tag. I came across the Nuxt Webfontloader plugin that handles loading fonts asynchronously and setting it up is very simple.

After installing the module to your NuxtJS project you simply add the module in your nuxt config file:

modules: ['nuxt-webfontloader']

Then add the module configuration, this is where you specify what fonts you want to load from google fonts:

webfontloader: {
    google: {
      families: [
          'Open Sans:,400,600',
          'Roboto:400'
      ]
    }
  }

That is all that there is to it and you have easily increased your NuxtJS application performance!