[發(fā)明專利]頁(yè)面骨架展示方法、裝置、電子設(shè)備及存儲(chǔ)介質(zhì)

在審

• 申請(qǐng)?zhí)枺?/td>: 202210111787.3
• 申請(qǐng)日: 2022-01-29
• 公開(kāi)（公告）號(hào): CN114443033A
• 公開(kāi)（公告）日: 2022-05-06
• 發(fā)明（設(shè)計(jì)）人: 彭志國(guó);張舜宇
• 申請(qǐng)（專利權(quán)）人: 北京字節(jié)跳動(dòng)網(wǎng)絡(luò)技術(shù)有限公司
• 主分類號(hào): G06F8/38
• 分類號(hào): G06F8/38;G06F8/41;G06F16/958
• 代理公司: 北京中知法苑知識(shí)產(chǎn)權(quán)代理有限公司 11226
• 代理人: 李明

本公開(kāi)提供了一種頁(yè)面骨架展示方法、裝置、電子設(shè)備及存儲(chǔ)介質(zhì)，該方法包括：基于領(lǐng)域特定語(yǔ)言解析工具，確定目標(biāo)頁(yè)面中的至少一個(gè)頁(yè)面元素的第一屬性信息；所述第一屬性信息包括元素路徑信息、元素尺寸信息以及元素樣式信息中的至少一種；基于所述目標(biāo)頁(yè)面的源碼文件，確定所述至少一個(gè)頁(yè)面元素的第二屬性信息；所述第二屬性信息包括元素位置信息；基于所述第一屬性信息以及所述第二屬性信息，生成骨架代碼文件；基于所述骨架代碼文件，展示骨架頁(yè)面。本公開(kāi)實(shí)施例，可以自動(dòng)生成元素級(jí)的骨架代碼文件，可以提高頁(yè)面骨架的場(chǎng)景適配能力，進(jìn)而提高骨架代碼文件的生成效率。

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

本公開(kāi)涉及計(jì)算機(jī)技術(shù)領(lǐng)域，具體而言，涉及一種頁(yè)面骨架展示方法、頁(yè)面骨架展示裝置、電子設(shè)備以及計(jì)算機(jī)可讀存儲(chǔ)介質(zhì)。

背景技術(shù)

骨架屏(Skeleton Screen)，也被稱為加載占位圖，它可以在頁(yè)面數(shù)據(jù)加載完成前先給用戶展示出頁(yè)面的大致結(jié)構(gòu)，在頁(yè)面數(shù)據(jù)加載完成后再顯示頁(yè)面的數(shù)據(jù)內(nèi)容。

在相關(guān)技術(shù)中，生成頁(yè)面骨架的方式包括通過(guò)預(yù)渲染插件實(shí)現(xiàn)，在使用該方法生成骨架屏?xí)r，其頁(yè)面骨架代碼的生成邏輯為頁(yè)面級(jí)別，因此在生成骨架代碼的過(guò)程中具有組裝不夠靈活、適用場(chǎng)景單一等缺點(diǎn)。

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

本公開(kāi)實(shí)施例至少提供一種頁(yè)面骨架展示方法、裝置、電子設(shè)備以及存儲(chǔ)介質(zhì)。

本公開(kāi)實(shí)施例提供了一種頁(yè)面骨架展示方法，包括：

基于領(lǐng)域特定語(yǔ)言解析工具，確定目標(biāo)頁(yè)面中的至少一個(gè)頁(yè)面元素的第一屬性信息；所述第一屬性信息包括元素路徑信息、元素尺寸信息以及元素樣式信息中的至少一種；

基于所述目標(biāo)頁(yè)面的源碼文件，確定所述至少一個(gè)頁(yè)面元素的第二屬性信息；所述第二屬性信息包括元素位置信息；

基于所述第一屬性信息以及所述第二屬性信息，生成骨架代碼文件；

基于所述骨架代碼文件，展示骨架頁(yè)面。

本公開(kāi)實(shí)施例，通過(guò)確定至少一個(gè)頁(yè)面元素的第一屬性信息以及第二屬性信息生成骨架代碼文件，也即基于頁(yè)面元素(即組件級(jí))生成骨架代碼文件，相對(duì)于通常使用的頁(yè)面級(jí)的頁(yè)面骨架生成方法，可以根據(jù)需求對(duì)元素骨架進(jìn)行靈活組裝，有利于提高頁(yè)面骨架的場(chǎng)景適配能力，進(jìn)而提高骨架代碼文件的生成效率。

一種可選的實(shí)施方式中，所述基于所述源碼文件，確定所述目標(biāo)頁(yè)面元素的第二屬性信息，包括：

基于所述源碼文件，生成抽象語(yǔ)法樹(shù)；

基于所述抽象語(yǔ)法樹(shù)，確定所述第二屬性信息。

本公開(kāi)實(shí)施例中，通過(guò)將所述源碼文件解析為抽象語(yǔ)法樹(shù)的文件格式，可以提高確定所述目標(biāo)頁(yè)面元素的第二屬性信息的效率，進(jìn)而可以提高骨架代碼文件的生成效率。

一種可選的實(shí)施方式中，所述基于所述第一屬性信息以及所述第二屬性信息，生成骨架代碼文件，包括：

將屬于同一目標(biāo)頁(yè)面元素的所述第一屬性信息與所述第二屬性信息進(jìn)行匹配；

基于所述第一屬性信息，對(duì)所述目標(biāo)頁(yè)面元素進(jìn)行數(shù)據(jù)處理，生成所述骨架代碼文件。

本公開(kāi)實(shí)施例中，通過(guò)將屬于同一目標(biāo)頁(yè)面元素的第一屬性信息與第二屬性信息進(jìn)行匹配，并基于第一屬性信息對(duì)目標(biāo)頁(yè)面元素進(jìn)行處理，如此，可以生成具有源碼文件邏輯的與之匹配的骨架代碼文件，即可以確保骨架代碼文件的邏輯性。

一種可選的實(shí)施方式中，所述第二屬性信息還包括元素內(nèi)容信息，所述基于所述第一屬性信息，對(duì)所述目標(biāo)頁(yè)面元素進(jìn)行數(shù)據(jù)處理，包括：

刪除所述目標(biāo)頁(yè)面元素中的元素內(nèi)容信息；

基于所述第一屬性信息，確定所述目標(biāo)頁(yè)面元素的元素尺寸信息和骨架標(biāo)識(shí)信息。