一種基于合成渲染加速的網(wǎng)頁更新方法和裝置的制造方法
【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及網(wǎng)頁渲染技術(shù)領(lǐng)域，尤其涉及一種基于合成渲染加速的網(wǎng)頁更新方法和裝置。
【背景技術(shù)】
[0002]現(xiàn)階段瀏覽器一般都采用多線程的渲染加速架構(gòu)，以充分利用多核CPU (CentralProcessing Unit,中央處理器)和GPU (Graphic Processing Unit,圖形處理器)的硬件性能,和避免UI (User Interface,用戶界面)線程阻塞導(dǎo)致用戶操作不流暢。其中，合成渲染加速是使用較多的渲染加速架構(gòu)，通過將網(wǎng)頁劃分成多個圖層來提升渲染性能。在合成渲染加速架構(gòu)下，瀏覽器將所有的網(wǎng)頁元素按照預(yù)定的規(guī)則分組，使其從屬于某一特定圖層，將所有圖層以樹狀結(jié)構(gòu)組織成圖層樹，網(wǎng)頁快照則由圖層樹構(gòu)成。
[0003]圖層樹中，圖層包括內(nèi)容和屬性兩部分。圖層內(nèi)容為從屬于圖層的所有網(wǎng)頁元素的繪制描述。圖層屬性(即圖層的屬性)則跟其包含的網(wǎng)頁元素的某些CSS屬性對應(yīng)，網(wǎng)頁元素圖層分組規(guī)則會保證從屬于同一圖層的所有網(wǎng)頁元素在這些css屬性上的值都是一樣的，所以圖層某一屬性的值就來自于從屬于它的網(wǎng)頁元素跟這個圖層屬性相對應(yīng)的CSS屬性的值。例如:圖層的CSS Transform(幾何變換)屬性、CSS Animat1n (動畫)屬性和CSS Opacity (不透明度)屬性跟圖層包含的網(wǎng)頁元素的這些CSS屬性形成映射關(guān)系。合成渲染加速架構(gòu)下的渲染加速引擎通常包括兩個主要的線程:內(nèi)核線程和合成線程。內(nèi)核線程主要負(fù)責(zé)HTML (HyperText Markup language,超文本標(biāo)記語言)和CSS腳本的解析、JavaScript動態(tài)代碼的執(zhí)行和網(wǎng)頁的排版等任務(wù)，內(nèi)核線程持有當(dāng)前網(wǎng)頁的快照，在每次重新排版后更新該網(wǎng)頁快照，并拷貝更新后的快照發(fā)送給合成線程。合成線程則負(fù)責(zé)預(yù)繪制從內(nèi)核線程接收到的網(wǎng)頁快照，所述預(yù)繪制為將每個圖層的內(nèi)容(繪制描述)光柵化為像素并存入緩存中，然后合成線程再根據(jù)預(yù)繪制得到的像素緩存和圖層的屬性合成為網(wǎng)頁緩存輸出至當(dāng)前顯示窗口的幀緩沖存儲器(Frame Buffer，簡稱幀緩存)。顯示控制器讀取幀緩存則可以將網(wǎng)頁呈現(xiàn)到屏幕上。
[0004]現(xiàn)在網(wǎng)頁在運(yùn)行時會通過JavaScript代碼不斷動態(tài)改變網(wǎng)頁元素的CSS屬性，其中一部分CSS屬性跟網(wǎng)頁元素所屬圖層的圖層屬性相對應(yīng)，例如CSS Transform屬性、CSSAnimat1n屬性和CSS Opacity屬性，一般而言這些屬性的變更不會導(dǎo)致元素內(nèi)容的變化，也就是說這些屬性不影響元素是如何預(yù)繪制的。在現(xiàn)有的合成渲染加速架構(gòu)下，在網(wǎng)頁加載完畢以及首次排版和預(yù)繪制完成后，當(dāng)圖層的內(nèi)容和屬性發(fā)生變化需要更新網(wǎng)頁時，內(nèi)核線程都要重新排版生成新的網(wǎng)頁快照，拷貝新的網(wǎng)頁快照發(fā)送至合成線程，而合成線程則重新進(jìn)行預(yù)繪制等處理步驟。但前述跟網(wǎng)頁元素部分CSS屬性相對應(yīng)的圖層屬性只影響圖層內(nèi)容的展示，對網(wǎng)頁排版無影響，也不影響圖層光柵化的結(jié)果，上述需要重新排版和重新預(yù)繪制的網(wǎng)頁更新過程會占據(jù)很多的系統(tǒng)資源，導(dǎo)致更新效率和速度低，由于網(wǎng)頁更新的效率和速度低，也使得網(wǎng)頁動態(tài)效果顯示的幀率低，網(wǎng)頁動態(tài)顯示性能不佳。

【發(fā)明內(nèi)容】

[0005]為克服相關(guān)技術(shù)中運(yùn)行JavaScript動態(tài)代碼使得網(wǎng)頁元素的與圖層屬性對應(yīng)的層疊樣式表屬性發(fā)生變化時，導(dǎo)致的網(wǎng)頁更新效率低的問題，本申請?zhí)峁┮环N基于合成渲染加速的網(wǎng)頁更新方法和裝置。
[0006]根據(jù)本申請實(shí)施例的第一方面，提供一種基于合成渲染加速的網(wǎng)頁更新方法，包括:
[0007]當(dāng)JavaScript動態(tài)代碼使網(wǎng)頁元素的與圖層屬性對應(yīng)的層疊樣式表屬性發(fā)生變化時，內(nèi)核線程更新源網(wǎng)頁快照中對應(yīng)網(wǎng)頁元素所在圖層的屬性，所述源網(wǎng)頁快照為內(nèi)核線程中當(dāng)前的網(wǎng)頁快照；
[0008]內(nèi)核線程向合成線程發(fā)送同步更新請求；
[0009]接收到所述同步更新請求后，合成線程根據(jù)所述源網(wǎng)頁快照中圖層的屬性同步更新合成線程中當(dāng)前的網(wǎng)頁快照中對應(yīng)圖層的屬性。
[0010]其中，所述與圖層屬性對應(yīng)的層疊樣式表屬性，其變更不會導(dǎo)致網(wǎng)頁元素內(nèi)容的變化，不影響網(wǎng)頁元素的預(yù)繪制。
[0011]其中，所述層疊樣式表屬性包括層疊樣式表幾何變換屬性、層疊樣式表動畫屬性和層疊樣式表不透明度屬性。
[0012]可選的，所述根據(jù)根據(jù)源網(wǎng)頁快照中圖層的屬性同步更新當(dāng)前網(wǎng)頁快照中對應(yīng)圖層的屬性，包括:
[0013]比較當(dāng)前網(wǎng)頁快照的每個圖層與源網(wǎng)頁快照的每個對應(yīng)圖層，合成線程中當(dāng)前的網(wǎng)頁快照中存在與所述源網(wǎng)頁快照中對應(yīng)圖層的屬性不同的圖層時，設(shè)置所述圖層的屬性與源網(wǎng)頁快照中對應(yīng)圖層的屬性相同。
[0014]可選的，所述根據(jù)所述源網(wǎng)頁快照中圖層的屬性同步更新合成線程中當(dāng)前的網(wǎng)頁快照中對應(yīng)圖層的屬性，包括:
[0015]比較合成線程中當(dāng)前的網(wǎng)頁快照中設(shè)置有層疊樣式表幾何變換屬性、層疊樣式表動畫屬性和層疊樣式表不透明度屬性至少其中之一的網(wǎng)頁元素，與所述源網(wǎng)頁快照中對應(yīng)的設(shè)置有層疊樣式表幾何變換屬性、層疊樣式表動畫屬性和層疊樣式表不透明度屬性至少其中之一的網(wǎng)頁元素；
[0016]當(dāng)合成線程中當(dāng)前的網(wǎng)頁快照中存在幾何變換屬性、層疊樣式表動畫屬性和層疊樣式表不透明度屬性不同的網(wǎng)頁元素時，設(shè)置所述網(wǎng)頁元素所在圖層的屬性與所述源網(wǎng)頁快照中對應(yīng)網(wǎng)頁元素的幾何變換屬性、層疊樣式表動畫屬性和層疊樣式表不透明度屬性屬性相同。
[0017]所述基于合成渲染加速的網(wǎng)頁更新方法，在根據(jù)所述源網(wǎng)頁快照中圖層的層疊樣式表屬性同步更新合成線程中當(dāng)前的網(wǎng)頁快照中對應(yīng)的圖層的層疊樣式表屬性之后，還包括:
[0018]合成線程根據(jù)更新后的當(dāng)前網(wǎng)頁快照進(jìn)行合成操作生成網(wǎng)頁緩存。
[0019]根據(jù)本申請實(shí)施例的第二方面，提供一種基于合成渲染加速的網(wǎng)頁更新裝置，包括:
[0020]內(nèi)核線程快照更新模塊，用于在內(nèi)核線程中，當(dāng)JavaScript動態(tài)代碼使網(wǎng)頁元素的與圖層屬性對應(yīng)的層疊樣式表屬性發(fā)生變化時，內(nèi)核線程更新源網(wǎng)頁快照中對應(yīng)網(wǎng)頁元素所在圖層的屬性，所述源網(wǎng)頁快照為內(nèi)核線程中當(dāng)前的網(wǎng)頁快照；
[0021]內(nèi)核線程請求發(fā)送模塊，用于在內(nèi)核線程中向合成線程發(fā)送同步更新請求消息；
[0022]合成線程請求接收模塊，用于在合成線程中接收所述同步更新請求；
[0023]合成線程快照更新模塊，用于在合成線程中根據(jù)所述源網(wǎng)頁快照中圖層的屬性同步更新合成線程中當(dāng)前的網(wǎng)頁快照中對應(yīng)圖層的屬性。
[0024]可選的，所述合成線程快照更新模塊，包括:
[0025]內(nèi)核線程訪問模塊，用于訪問內(nèi)核線程；
[0026]圖層比較子模塊，用于通過內(nèi)核線程訪問模塊比較合成線程中當(dāng)前的網(wǎng)頁快照的每個圖層與源網(wǎng)頁快照的每個對應(yīng)圖層；
[0027]第一判斷子模塊，用于判斷合成線程中當(dāng)前的網(wǎng)頁快照中每個圖層的屬性與所述源網(wǎng)頁快照中每個對應(yīng)圖層的屬性是否相同；
[0028]第一更新子模塊，用于合成線程中當(dāng)前的網(wǎng)頁快照中存在與所述源網(wǎng)頁快照中對應(yīng)圖層的屬性不同的圖層時，設(shè)置所述圖層的屬性與源網(wǎng)頁快照中對應(yīng)圖層的屬性相同。
[0029]可選的，所述合成線程快照更新模塊，包括:
[0030]內(nèi)核線程訪問模塊，用于訪問內(nèi)核線程；
[0031]第一查找子模塊，用于查找合成線程中當(dāng)前的網(wǎng)頁快照中設(shè)置有層疊樣式表幾何變換屬性、層疊樣式表動畫屬性和層疊樣式表不透明度屬性至少其中之一的網(wǎng)頁元素；<