一 概念 什麼是迴流？ 迴流也叫重排（reflow），當頁面中的元素髮生影響佈局的變化，比如：改變寬高，修改顯示影藏。頁面需要重新佈局，就會觸發重排。 簡單的說就是，頁面佈局改變，就會觸發重排。 什麼是重繪（repaint）？ 頁面中的元素樣式發生改變，比如：背景顏色，背景圖片，字體顏色的樣式改變。 ...
一 概念
什麼是迴流？ 迴流也叫重排（reflow），當頁面中的元素髮生影響佈局的變化，比如：改變寬高，修改顯示影藏。頁面需要重新佈局，就會觸發重排。 簡單的說就是，頁面佈局改變，就會觸發重排。
什麼是重繪（repaint）？ 頁面中的元素樣式發生改變，比如：背景顏色，背景圖片，字體顏色的樣式改變。 只要頁面需要重新渲染，就會觸發重繪。
註意： 每個頁面只要會發生一次 重排和重繪。
重排一定會觸發重繪
二 關於前端性能的優化
前端性能優化的關鍵在於 減少DOM操作 和 減少頁面的重排重繪
如何減少頁面重排重繪呢？ 想要減少重排重繪還要瞭解瀏覽器自帶的優化，每個瀏覽器都是聰明的，瀏覽器都有自己的優化操作。每個瀏覽器都有一個 維護隊列 ，它會把引起重排和重繪的操作放到維護隊列中， 等 維護隊列 中的操作到達一定數量或者到達一定的時間間隔， 瀏覽器就會清空這個維護隊列，進行批量處理，這樣就會減少重排和重繪的次數。 註意：對應一些特殊的獲取操作，為了保證獲取數值的準確性，瀏覽器會提前清空維護隊列，將其提前渲染。
所以想要減少重排和重繪，條件允許一定要減少獲取操作
如： 01 在for迴圈中，儘量不要進行樣式的獲取操作（因為一獲取就會flush(清空)瀏覽器維護的隊列 ）
02 儘量少用sytle修改樣式，通過添加class進行一次性修改樣式
03 使用 translate 代替 left/top等，（translate只會觸發重繪，不會引起重排，可以減少一次重排的時間）
04 使用opacity代替visibility,改透明度渲染效率更高
05 使用絕對定位或者固定定位(absolute fixed),脫離文檔流不會引起頁面其它盒子的變化
06 將大量需要重排操作的元素，進行display:none ，（專業術語是' 離線處理'）
這些是減少重排重繪的優化方法。
// GPU 是圖形處理器，使用3d屬性可以觸發gpu硬體加速。
移動端的優化可以給元素添加 3d屬性（比如 transform: translateZ(0)），使用3d屬性可以使手機開啟gpu硬體加速，讓手機可以最高性能的進行渲染。
關於優化還可以
使用css精靈圖片，減少圖片的張數，或者使用iconfont字體圖標
減少ajax請求的次數，使用webpack打包
壓縮/合併js和css代碼，減少代碼文件的個數和體積
關於網站排名的優化
<title>京東(JD.COM)-正品低價、品質保障、配送及時、輕鬆購物！</title> <meta name="description" content="京東JD.COM-專業的綜合網上購物商城、數位通訊、電腦、家居百貨、服食品等數萬個品牌優質商品.便捷、誠信的服務，為您提供愉悅的網上購物體驗!" /> <meta name="Keywords" content="網上購物,網上商城,手機,筆記本,電腦,MP3,CD,VCD,DV,相機,數位,配件,手錶,存儲卡,京東" /><div class="logo"> <h1> <a href="#" title="京東網"> 京東<!-- 這裡的字不能刪除 ，起到網站優化作用 --> </a> </h1> </div> 在寫html時，使用 div>h1>a 這種結構有優化作用，比如 上面的logo區域，a標簽裡面的字也不要刪除，可以使用text-indent：-99999（首行縮進進行隱藏），這樣做可以啟動搜索優化，可以使自己的網站靠前一點
<title></title>具有不可替代性，搜索引擎瞭解網頁的入口，一定要寫
meta中的 description關鍵字，網站說明，說明這個網站是做什麼的。 有很多搜索引擎是根據meta中的描述部分作為搜索結果的“內容摘要” 所以一定要寫
meta中的 keywords 裡面寫的是頁面的關鍵詞，也是搜索引擎的關註點之一。 也要寫。。。。。。。
使用div>h1>a這種結構
