Loading font from google web fonts or fonts from o

Question

While working with some custom fonts, I have two options either I can load a form from my own server or I can load a google web fonts. But my concern is which one efficient in terms of page load time?

The way I am using css is

@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 */
    } 

Here, while loading font, I am also using cacheing using font version and loading the fonts from CDN.

The font which I am trying to load is near by 36k in terms of size.

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

Implementation of google fonts

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

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

Can someone please help me to understand which one should be used either google web fonts or custom form own server. In terms of page load time which one is best ?

Answer 1

Downloading the fonts from the google cdn is always going to be faster, if not for you (in the case where you're in lan with your server), for everyone else for the simple reason that the google cdn servers will probably be much closer to them rather than to your server.

Also, if you want to go even further google also hosts a couple of other useful things on their cdn, you can even get jquery from them with the same advantages listed above.

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

Answer 2

Which one should be used depends on how fast your server is, where in the world your server is located, and where in the world each individual visitor to your website is.

Google's servers are pretty fast, usually they will be faster. But there are some regions where their servers are no good and you should use your own.