从谷歌网络字体加载字体或从自己的服务器加载字体，哪一种在页面加载时间方面更有效？

Posted 2023-03-15

【中文标题】从谷歌网络字体加载字体或从自己的服务器加载字体，哪一种在页面加载时间方面更有效？

【英文标题】：Loading font from google web fonts or fonts from own server, which one is more efficient in terms of page load time?

【发布时间】：2013-03-15 22:54:37

【问题描述】：

在使用一些自定义字体时，我有两个选择，要么从我自己的服务器加载表单，要么加载谷歌网络字体。但我担心的是哪一个在页面加载时间方面有效？

我使用css的方式是

@font-face 
    font-family: 'MyWebFont';
    src: url('webfont.eot'); /* IE9 Compat Modes */
    src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('webfont.woff') format('woff'), /* Modern Browsers */
     

这里，在加载字体的同时，我也在使用字体版本缓存和从 CDN 加载字体。

我尝试加载的字体大小接近 36k。

h1 
       font-family: 'MyWebFont', Fallback, sans-serif;

google字体的实现

<link href='http://fonts.googleapis.com/css?family=Caesar+Dressing' rel='stylesheet' type='text/css'>

h1
  font-family: 'Caesar Dressing', cursive;

有人可以帮我了解应该使用哪一个，要么使用谷歌网络字体，要么使用自定义表单自己的服务器。就页面加载时间而言，哪一个最好？

【参考方案1】：

从 google cdn 下载字体总是会更快，如果不适合您（如果您的服务器在局域网中），对于其他所有人来说，原因很简单，google cdn 服务器可能会离他们更近，而不是离你的服务器更近。

另外，如果你想更进一步，谷歌还在他们的 cdn 上托管了一些其他有用的东西，你甚至可以从他们那里获得 jquery，具有上面列出的相同优势。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

【讨论】：

对我来说，从 google 的服务器下载比从我们自己的服务器下载慢大约 1 秒。我们的数据中心就在附近，谷歌的服务器在世界的另一端，需要发出多个请求。至少在我的国家，google 的本地 CDN 目前还没有涵盖他们的字体托管服务。

@AbhiBeckert 在某些情况下，谷歌的 CDN 可能会更慢，但如果您有来自世界各地的人访问该网站，平均而言，谷歌的 CDN 将是最快的选择。跨度>

大多数网站都没有来自世界各地的流量。至少，他们只能从与网站所在语言说相同语言的人那里获得流量。对于我正在处理的网站，我遇到了这个问题，谷歌的服务器需要大约 1 秒的时间来响应字体文件，而我们自己的服务器则接近 30 毫秒。我们运行自己的服务器，我知道谷歌在我们的同一个城市有一个数据中心。如果他们没有将它用于字体，那么大概字体服务在全球范围内的分布不如他们的其他服务那么好。

【参考方案2】：

应该使用哪一个取决于您的服务器的速度、您的服务器位于世界的哪个位置以及您网站的每个访问者在世界的哪个位置。

Google 的服务器非常快，通常它们会更快。但是有些地区他们的服务器不好，你应该使用自己的。