Load google fonts using javascript

We can load google fonts using javascript, resulting in better google pagespeed score.

<script defer src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js"></script>
<script defer>
WebFont.load({
	google: {
		families: ['Tangerine:300i,400i,700,700i', 'Open Sans:300']
	}
});
</script>

Google webfonts loader also allows us to set a timeout before loading the google fonts.

The code would look like this:

WebFontConfig = {
  google: {
    families: ['Droid Sans']
  },
  timeout: 2000 // Set the timeout to two seconds
};

For more info: https://github.com/typekit/webfontloader

Note: we can also load custom font files using webfontloader. More details on their github page.