Angular 由一个bug说起之六：字体预加载

浏览器在加载一个页面时，会解析网页中的html和css，并开始加载字体文件。字体文件可以通过css中的@font-face规则指定，并使用url()函数指定字体文件的路径。

比如下面这样:

css

@font-face {
    font-family: 'MyFont';
    src: url('path/to/font.woff2') format('woff2'),
        url('path/to/font.woff') format('woff');
}

body {
    font-family: 'MyFont', sans-serif;

但是在首次加载一个页面时，浏览器会根据css中字体的使用情况，来决定是否加载某个字体文件，而不是提前加载好。

这样就会有延迟，可能会带来一些问题，比如字体的延迟和闪烁。

像下面这样

一开始是一个字体，过了一会又变成别的字体。