pageboard / client

Web site building system - client packages
MIT License
4 stars 0 forks source link

Font loading #5

Open kapouer opened 5 years ago

kapouer commented 5 years ago

Move font loading to elements, instead of hard-coding it into stylesheets.

Use Bramstein's https://fontfaceobserver.com/ to load fonts.

Also think about server-side rendering for svg fonts because it's pretty easy to implement with our tools.

kapouer commented 5 years ago

Also optional font rendering. font-display: optional;

kapouer commented 4 years ago

Current way to import an external font (works in pageboard/server 0.7.1):

exports.custom = {
  priority: 100,
  group: 'block',
  stylesheets: [
    'https://fonts.googleapis.com/css?family=Roboto&display=swap',
    '../ui/custom.css'
  ],
  csp: {
    style: ["https://fonts.googleapis.com"],
    font: ["https://fonts.gstatic.com"]
  }
};
kapouer commented 4 years ago

Also https://csswizardry.com/2020/05/the-fastest-google-fonts/ TL,DR: font-display:swap and preconnect !