Google為jQuery,angularjs,jQuerymobile,jQueryui等常用類庫提供了CDN服務,方便廣大開發者調用,同時還可以加快網站加載速度。例如:我們可以這樣引用jQuery
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
但是,由於我們特殊的國情。在沒翻牆的情況下訪問那些使用了這些服務的網站,就會慢的像烏龜。 例如:訪問http://stackoverflow.com/
先是顯示等待加載。。。
等待大約兩分鍾后,告訴你加載失敗了
由於瀏覽器在加載js的時候,會阻塞后面資源的加載以及內容的呈現,這就會導致呈現頁面時出現明顯的延遲。如果是在<head>
標簽里引用的該js,那么延遲期間瀏覽器窗口將是一片空白。
時間就是生命啊,完全不能忍受啊!!只是想查個資料嘛,要不要這么難!!
經過一番尋找,在github上看到了googleapis-mirror。 通過它,我們可以在本地制作一份google cdn 庫的鏡像(不是完全鏡像,是子集,包含了常用類庫)。
如果你有一台可以穿牆的mac或linux,而且具備一些ruby基礎,你可以跟着googleapis-mirror
的說明,自己鏡像一份。
或者直接用我做好的這份,百度雲上下載。
當然不管用哪種方法,你本地都要有服務器環境,我用的是apache
- 下載完成,解壓到本地 apache 的 www 目錄
- 修改hosts文件,將
ajax.googleapis.com
指向到127.0.0.1
-
修改apache虛擬主機配置,並重啟。
<VirtualHost *:80> ServerName ajax.googleapis.com DocumentRoot "/path/to/googleapis-mirror" <Directory "/path/to/googleapis-mirror"> Options Indexes Order allow,deny Allow from all </Directory> </VirtualHost>
/path/to/googleapis-mirror
要改成你對應的目錄。
再次訪問stackoverflow
速度杠杠的。
類似的,有許多網站用到了google字體庫(fonts.googleapis.com)中的字體,同樣也會導致網頁加載很慢。
我的解決方法簡單粗暴,修改hosts文件,把fonts.googleapis.com
指到 127.0.0.1
。直接使字體加載失敗,損失一些美觀度,節約等待時間。