[發(fā)明專利]網(wǎng)頁渲染方法、裝置及電子設(shè)備

有效

• 申請?zhí)枺?/td>: 202210008830.3
• 申請日: 2022-01-06
• 公開（公告）號: CN114139083B
• 公開（公告）日: 2023-03-14
• 發(fā)明（設(shè)計）人: 刁佳佳
• 申請（專利權(quán)）人: 北京百度網(wǎng)訊科技有限公司
• 主分類號: G06F16/957
• 分類號: G06F16/957;G06T13/00
• 代理公司: 北京銀龍知識產(chǎn)權(quán)代理有限公司 11243
• 代理人: 劉念

本公開提供了一種網(wǎng)頁渲染方法、裝置及電子設(shè)備，涉及計算機技術(shù)領(lǐng)域，具體涉及網(wǎng)頁技術(shù)領(lǐng)域。具體實現(xiàn)方案為：檢測所述網(wǎng)頁的運行信息，所述運行信息包括所述網(wǎng)頁的運行狀態(tài)，所述網(wǎng)頁包括M個元素，M為正整數(shù)；在檢測到所述網(wǎng)頁的運行狀態(tài)從第一狀態(tài)切換至第二狀態(tài)的情況下，基于所述網(wǎng)頁的層疊樣式表CSS信息，確定所述M個元素在所述第二狀態(tài)下的目標動畫信息，所述CSS信息包括所述M個元素在所述網(wǎng)頁的各個運行狀態(tài)下的動畫信息；基于所述目標動畫信息，對所述網(wǎng)頁進行渲染。

技術(shù)領(lǐng)域

本公開涉及計算機技術(shù)領(lǐng)域，尤其涉及網(wǎng)頁技術(shù)領(lǐng)域，具體涉及一種網(wǎng)頁渲染方法、裝置及電子設(shè)備。

背景技術(shù)

隨著計算機技術(shù)的高速發(fā)展，網(wǎng)頁得到了人們廣泛的使用，用戶可以基于網(wǎng)頁實現(xiàn)各種各樣的設(shè)計。比如，可以基于網(wǎng)頁實現(xiàn)對戰(zhàn)游戲的設(shè)計。

目前，在網(wǎng)頁設(shè)計時，通常是基于即時編譯型的編程語言如JavaScript(JS)來控制網(wǎng)頁上的元素移動，并通過網(wǎng)頁渲染來實現(xiàn)網(wǎng)頁的動畫。

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

本公開提供了一種網(wǎng)頁渲染方法、裝置及電子設(shè)備。

根據(jù)本公開的第一方面，提供了一種網(wǎng)頁渲染方法，包括：

檢測所述網(wǎng)頁的運行信息，所述運行信息包括所述網(wǎng)頁的運行狀態(tài)，所述網(wǎng)頁包括M個元素，M為正整數(shù)；

在檢測到所述網(wǎng)頁的運行狀態(tài)從第一狀態(tài)切換至第二狀態(tài)的情況下，基于所述網(wǎng)頁的層疊樣式表CSS信息，確定所述M個元素在所述第二狀態(tài)下的目標動畫信息，所述CSS信息包括所述M個元素在所述網(wǎng)頁的各個運行狀態(tài)下的動畫信息；

基于所述目標動畫信息，對所述網(wǎng)頁進行渲染。

根據(jù)本公開的第二方面，提供了一種網(wǎng)頁渲染裝置，包括：

檢測模塊，用于檢測所述網(wǎng)頁的運行信息，所述運行信息包括所述網(wǎng)頁的運行狀態(tài)，所述網(wǎng)頁包括M個元素，M為正整數(shù)；

確定模塊，用于在檢測到所述網(wǎng)頁的運行狀態(tài)從第一狀態(tài)切換至第二狀態(tài)的情況下，基于所述網(wǎng)頁的層疊樣式表CSS信息，確定所述M個元素在所述第二狀態(tài)下的目標動畫信息，所述CSS信息包括所述M個元素在所述網(wǎng)頁的各個運行狀態(tài)下的動畫信息；

渲染模塊，用于基于所述目標動畫信息，對所述網(wǎng)頁進行渲染。

根據(jù)本公開的第三方面，提供了一種電子設(shè)備，包括：

至少一個處理器；以及

與至少一個處理器通信連接的存儲器；其中，

存儲器存儲有可被至少一個處理器執(zhí)行的指令，該指令被至少一個處理器執(zhí)行，以使至少一個處理器能夠執(zhí)行第一方面中的任一項方法。

根據(jù)本公開的第四方面，提供了一種存儲有計算機指令的非瞬時計算機可讀存儲介質(zhì)，該計算機指令用于使計算機執(zhí)行第一方面中的任一項方法。

根據(jù)本公開的第五方面，提供了一種計算機程序產(chǎn)品，包括計算機程序，該計算機程序在被處理器執(zhí)行時實現(xiàn)第一方面中的任一項方法。

根據(jù)本公開的技術(shù)解決了網(wǎng)頁渲染而導(dǎo)致的網(wǎng)頁運行卡頓的問題，提高了網(wǎng)頁運行的流暢度。

應(yīng)當(dāng)理解，本部分所描述的內(nèi)容并非旨在標識本公開的實施例的關(guān)鍵或重要特征，也不用于限制本公開的范圍。本公開的其它特征將通過以下的說明書而變得容易理解。

附圖說明

附圖用于更好地理解本方案，不構(gòu)成對本公開的限定。其中：

圖1是根據(jù)本公開第一實施例的網(wǎng)頁渲染方法的流程示意圖；

圖2是根據(jù)本公開第二實施例的網(wǎng)頁渲染裝置的結(jié)構(gòu)示意圖；