0

Vuetify offers a few icon font options:

https://vuetifyjs.com/en/features/icon-fonts/#usage

  • Material Design Icons
  • Material Design Icons - JS SVG
  • Material Icons

Is there any performance difference with these choices?

d-_-b
  • 21,536
  • 40
  • 150
  • 256

1 Answers1

2

The actual runtime performance should be pretty similar, the main difference is how much data they load.

Material Icons is google's official icon set. It uses a ligature font which is about 125kB.

Material Design Icons is a third-party project that contains all of google's icons plus a few thousand custom ones, and is pretty big with 324kB (52kB gzipped) of CSS and a 384kB font.

Material Design Icons - JS SVG is a 2.7MB (750kB gzipped) js file, but it allows you to import only the icons you're using so in practice is much smaller.

Kael Watts-Deuchar
  • 4,213
  • 1
  • 26
  • 50