使用@ font-face将自定义字体上传到css doc会让事情变得更慢吗？

Question

我从dafont.com下载了一个字体，然后将其添加到样式表中，以获取当前只在我的计算机上的html文件。我更改了大多数按钮以使用该字体，但现在它似乎加载方式较慢（它几乎立即在我的浏览器中呈现）因为自定义字体。有没有办法可以解决我的计算机本地文件的问题，并且它还会导致页面在实际上传到网站后缓慢呈现？

Answer 1

您可以尝试不同的方法来提高效果：

• 在检查在线版本之前使用local参考：这将在您的计算机上运行，​​但您永远不知道用户是否安装了具有相同名称的其他字体（这是不可能的，但可能会破坏你期望的外观。
• 使用延迟加载在页面呈现后下载字体：这可能不是很有用，因为您使用的字体是页面上的主要字体。
• 不要将@ font-face包含在您不打算使用的字体中：某些浏览器会下载这些字体，无论它们是否被使用。
• 如果可能，请使用外部托管的字体（例如：在Google字体中）：如果字体是从之前的访问中缓存出来的话，这会使您的网页更快，并且只需要与主机建立一个连接。
• 这可能听起来有些偏差但是：明智地选择字体。如果你选择一个漂亮的字体，但文件是10MB，将会对性能产生影响。并且与文件大小有关，
• 如果可能的话，请使用gzip你的字体文件：它们的重量会减轻，下载时间会更短。

在链接上阅读有关此主题的更多信息：

• Preventing the performance hit from custom fonts。
• @font-face and performance