學習二十六 雙快取技術

2021-10-17 14:49:45 字數 856 閱讀 7668

在 react 中,dom 的更新採用可雙快取技術,雙快取技術致力於快速的 dom 更新。

什麼是雙快取?舉個例子,使用 canvas 繪製動畫時,在繪製每一幀前都會清除上一幀的畫面,清除上一幀需要花費時間,如果當前幀畫面計算量又比較大,又需要花費比較長的時間,這就導致上一幀清除到下一幀顯示中間會有較長的間隙,就會出現白屏。

為了解決這個問題,我們可以在記憶體中繪製當前幀動畫,繪製完畢後直接用當前幀替換上一幀畫面,這樣的話在幀畫面替換的過程中就會節約非常多的時間,就不會出現白屏問題。這種在記憶體中構建並直接替換的技術叫做雙快取。

react 使用雙快取技術完成 fiber 樹的構建與替換,實現dom物件的快速更新。

在 react 中最多會同時存在兩棵 fiber 樹,當前在螢幕中顯示的內容對應的 fiber 樹叫做 current fiber 樹,當發生更新時,react 會在記憶體中重新構建一顆新的 fiber 樹,這顆正在構建的 fiber 樹叫做 workinprogress fiber 樹。在雙快取技術中,workinprogress fiber 樹就是即將要顯示在頁面中的 fiber 樹,當這顆 fiber 樹構建完成後,react 會使用它直接替換 current fiber 樹達到快速更新 dom 的目的,因為 workinprogress fiber 樹是在記憶體中構建的所以構建它的速度是非常快的。

一旦 workinprogress fiber 樹在螢幕上呈現,它就會變成 current fiber 樹。

在 current fiber 節點物件中有乙個 alternate 屬性指向對應的 workinprogress fiber 節點物件,在 workinprogress fiber 節點中有乙個 alternate 屬性也指向對應的 current fiber 節點物件。

Swift學習筆記(二十六) 擴充套件

1.擴充套件的作用 1 使用擴充套件新增屬性 2 使用擴充套件新增方法,可變方法 3 使用擴充套件新增構造器 4 使用擴充套件新增下標 5 使用擴充套件新增巢狀型別 2.擴充套件的特性 1 使用擴充套件新增屬性,方法,可變方法,構造器,下標,巢狀型別 2 可以使乙個已有型別符合乙個或者多個協議 3 ...

二十六 遮蔽中斷

1.6410和210採用向量中斷,由硬體執行。有兩組中斷源,相應的控制暫存器也有多個 2.6410和210使能和遮蔽是分開的暫存器 3.遮蔽控制暫存器的讀寫操作從而遮蔽中斷,都是寫入全1 4.6410的 遮蔽中斷,要操作兩個暫存器,目的是將使能中斷暫存器的相關位清除 define vic0inten...

二十六 裝飾器

裝飾器 由於函式也是乙個物件,而且函式物件可以被賦值給變數,所以,通過變數也能呼叫該函式。def now print 2015 3 25 f now f 2015 3 25 函式物件有乙個 name 屬性,可以拿到函式的名字 now.name now f.name now 現在,假設我們要增強 no...