1.使用Base64格式的圖片製作icon

記得寫備註
缺點：圖片體積更大，因為base64是未經壓縮的，比原圖大；維護不方便。
優點：base64圖片利於頁面載入，可以減少請求；加快首屏資料的顯示速度。

background: url.............
url(data:image/png;base64,{img_data})

2.使用CS3的圖片製作icon(一般用在規格圖形上面)
優點：體積小；
缺點：也不容易維護，存在相容性問題（2012年）
但是在web app上面就幾乎存在0相容性問題咯
常用屬性
border-radius
box-shadow
transform

DOM節點操作QuerySelector
postMessage 跨域通訊
H5 API:
效能監控介面，頁面載入速度



js是單執行緒的，setTimeout類似開闢一個執行緒，把需要非同步操作的一些程式碼放到function裡面。
worker是後臺的一個計算執行緒，跟UI執行緒完全獨立。檔案裡面的js不能與UI相關

跨域請求，AJAX
以前跨域的做法
iframe
jsonp本身就是script標籤

這裡的url與當前域是同域的：協議相同
設定伺服器的響應頭

header('Access-Control-Aloow-Origin:*')

統一互動
移動端效能陷阱和硬體加速：

• 減少和避免repaint,reflow(頁面重繪（位置不變），頁面迴流（位置變 ）)
• 減少對DOM節點的操作，也可以理解為把DOM元素從DOM文件流中提取出來
• 儘量快取所有可以快取資料
• 使用CSS3 transform（底層操作） 代替dom操作
• 不要給非static定位元素（absulate和relative）增加css3動畫
• 適當的使用硬體加速GPU（canvas,transform:translate3d(0,0,0)）

HTML5時代之前利用Response Header來做快取

之後

indexedDB能儲存更多的資料，也能夠建立序列