今天部署外網上線事宜，前端我來配置了CDN，阿里雲的 CDN服務，其他都沒問題，簡直了  

阿里雲的CDN  GZIP壓縮也是夠強

開啟GZIP壓縮後，原來我幾十K 的 JS檔案，直接變成了 不足1K ，秒載入，你妹，我們專案組高興了一把。

這網站還不是秒開麼 ？

----------------------------------------------

看效果 ：

通過這個 我得到也給結論， 在程式碼檔案結構 儘量優化的同時，能力再強已經到極限了，但你伺服器辣雞，搭配不當，你程式碼優化上天 也是徒勞啊。

你不怎麼優化， 伺服器 各種技術配置到位的話， now你也看到了，我一個系統首頁也不過用了幾百ms，比我本地開發環境都快（mdzz，怪不得阿里這麼貴）！

------------------------------  吹牛逼結束 ，開始記錄今天遇到的一個問題  

*  字型 font  跨域載入問題   看圖

注：由於採用了cdn 加速， 本地測試 就出現瞭如此問題，其他一切正常的額！

那麼本問題直接導致 ， css 字型 圖示無效，呵呵噠，顏值瞬間沒了。這能忍？

原因是：字型檔案在CDN伺服器上、專案部署在自己的伺服器上，字型檔案就出現了跨域載入的問題。

於是乎，開始了Google之旅，好吧，小夥伴大部分都給出瞭如下建議： 摘自 網路。親測有效

1、服務端設定XXX，具體的大家可以直接去搜索，分為apache和nginx兩種設定方法，因為我很討厭折騰這個務器，在我們坑，也無需弄我折騰，所以沒測試過，這個上線之後 親測有效，畢竟同源嘍

2、將字型檔案以base64編碼的方式引入內嵌到樣式檔案中。這個本人嘗試過，書寫格式如下：

@font-face {
  font-family: 'icon-tb';
  src: url('../fonts/icon-tb.eot?59lb71');
  src: url('../fonts/icon-tb.eot?#iefix59lb71') format('embedded-opentype'), url('../fonts/icon-tb.woff?59lb71') format('woff'), url('../fonts/icon-tb.ttf?59lb71') format('truetype'), url('../fonts/icon-tb.svg?59lb71#icon-tb') format('svg');
  font-weight: normal;
  font-style: normal;
}
 

改成 

@font-face {
  font-family: 'icon-tb';
  Src : url("data:application/x-font-ttf;charset=utf-8;base64,XXXXXXXXXXXX") format("ttf");
}rc : url("data:application/x-font-ttf;charset=utf-8;base64,XXXXXXXXXXXX") format("ttf");
}

實際使用過程將那一長串”X“換成自己的base64編碼即可。

3、將字型檔案放到專案的目錄下，也即讓它們同源即可，好吧，都是一個爹生的，也不認生啦，問題也就解決了。這個方法是最後採取的，驗證OK。