The last time Hackerfall tried to access this page, it returned a not found error. A cached version of the page is below, or clickhereto continue anyway

How Google's CDN prevents your site from loading... - Edward Jiang

(Eg, why your website loads slowly in China)

I’ve been spending the past week in China, and have stumbled upon many websites that don’t seem to load. At first, I thought they were being blocked by the Great Firewall, but upon closer inspection, that’s not the case. 

It turns out that many websites are loading content from Google’s CDN, or Facebook/Twitter APIs, which are blocked in China. This prevents the browser from rendering the entire webpage until the connection times out. 

Let’s say you’re a Chinese netizen, and want to look at the Seattle Times. While some US media like the New York Times is blocked, the Seattle Times isn’t. 

Here’s what happens: 

Google Chrome reports that the DOM took 3.7 minutes to load! The majority of the time, Chrome was waiting for jQuery, Google+, and Facebook’s APIs to timeout. In addition, the site is partially broken, because jQuery is missing! 

According to KISSmetrics, only 40% of your site’s visitors will abandon your site if it takes over 3 seconds to load. Imagine how many abandon your site if it takes 3.7 minutes! This means that the Seattle Times is effectively blocked for Chinese netizens. 

Ironically, it takes 20.6 seconds for KISSmetrics’ blog post to load on my machine, because my browser is waiting for jQuery, Facebook, and Google’s Fonts: 

These sites are totally OK with the Chinese Government, contain useful information for Chinese visitors, yet are basically inaccessible on China’s Internet!

Here’s the major things I’ve found to block the loading of content sites: 

Solutions

Unfortunately, there’s no ideal solution to fixing this. However, here are some ways you can fix it. 

1. Use Alternatives to Google Fonts and Google’s CDN

jQuery recommends using its hosted copy on MaxCDNCloudflare-sponsored cdnjs works as well, although funnily the website is inaccessible due to its usage of Google Fonts API. 

I’m not sure of a good alternative to Google Fonts though. 

2. Asynchronously load javascript files, or include them at the footer

Putting your <script> tags right before the </body>, or asynchronously loading your files will work in some, but not all situations.

Any other ideas? 

Continue reading on edjiang.com