[發明專利]骨架屏的渲染方法、裝置、設備及存儲介質

在審

• 申請號: 202010582591.3
• 申請日: 2020-06-23
• 公開（公告）號: CN111708962A
• 公開（公告）日: 2020-09-25
• 發明（設計）人: 周麗霞;王超;鐘志清
• 申請（專利權）人: 中國平安財產保險股份有限公司
• 主分類號: G06F16/957
• 分類號: G06F16/957;G06F16/954;G06F16/955
• 代理公司: 北京市京大律師事務所 11321
• 代理人: 劉挽瀾

本發明涉及計算機網絡技術領域，公開了一種骨架屏的渲染方法、裝置、設備及存儲介質，用于減少白屏顯示時間，提升頁面切換的響應效率。骨架屏的渲染方法包括：獲取目標終端的頁面加載請求，其中，目標終端的頁面加載請求為網絡加載請求；根據目標終端的頁面加載請求在多個預置的骨架屏中確定初始骨架屏，并在目標項目入口中對初始骨架屏進行渲染，得到首屏骨架屏；通過哈希路由對首屏骨架屏進行路由轉場渲染，得到目標骨架屏；將目標骨架屏傳輸至目標終端進行顯示。此外，本發明還涉及區塊鏈技術，預置的骨架屏可存儲于區塊鏈中。

技術領域

本發明涉及計算機網絡技術領域，尤其涉及一種骨架屏的渲染方法、裝置、設備及存儲介質。

背景技術

隨著計算機網絡的發展，人們越依賴于網絡獲取信息和服務，可以通過網絡瀏覽文字信息、查看圖片、播放影音等。上述這些信息和服務都是通過頁面形式呈現給用戶的。當用戶過瀏覽器等客戶端向服務器發起統一資源定位符(uniform resource locator，URL)請求時，對應的服務器會根據URL請求，將相應的信息數據呈現出來，由于從網絡上獲取目標信息數據，所以頁面完全加載目標信息數據之前會出現一定的延遲時間。

本申請發明人在研究中發現，現有的技術中，很多前端開發方采用骨架屏來填補這段空白時間，目前骨架屏的加載方式主要是利用頁面模板添加首頁骨架對骨架屏進行渲染，這種加載方式只能在第一次進入系統時有骨架屏的效果。

發明內容

本發明的主要目的在于解決加載目標頁面前只能在第一次進入系統時有骨架屏的效果的問題。

本發明第一方面提供了一種骨架屏的渲染方法，包括：獲取目標終端的頁面加載請求，其中，所述目標終端的頁面加載請求為網絡加載請求；根據所述目標終端的頁面加載請求在多個預置的骨架屏中確定初始骨架屏，并在目標項目入口中對所述初始骨架屏進行渲染，得到首屏骨架屏；通過哈希路由對首屏骨架屏進行路由轉場渲染，得到目標骨架屏；將所述目標骨架屏傳輸至目標終端進行顯示。

可選的，在本發明第一方面的第一種實現方式中，所述根據所述目標終端的頁面加載請求在多個預置的骨架屏中確定初始骨架屏，并在目標項目入口中對所述初始骨架屏進行渲染，得到首屏骨架屏包括：根據所述目標終端的頁面加載請求在多個預置的骨架屏中確定初始骨架屏；判斷所述初始骨架屏是否與目標終端的頁面相匹配；若所述初始骨架屏與所述目標終端的頁面相匹配，則在目標項目入口中通過預置的內聯標簽將所述初始骨架屏嵌入至所述目標項目入口對應的項目入口文件中進行渲染，得到首屏骨架屏。

可選的，在本發明第一方面的第二種實現方式中，所述判斷所述初始骨架屏是否與目標終端的頁面相匹配包括：從所述初始骨架屏中讀取初始骨架屏路由路徑，并從目標終端的頁面讀取目標終端的頁面路由路徑；判斷所述目標終端的頁面路由路徑是否與所述初始骨架屏路由路徑匹配；若所述目標終端的頁面路由路徑與所述初始骨架屏路由路徑匹配，則判定所述初始骨架屏與目標終端的頁面相匹配。

可選的，在本發明第一方面的第三種實現方式中，所述若所述初始骨架屏與所述目標終端的頁面相匹配，則在目標項目入口中通過預置的內聯標簽將所述初始骨架屏嵌入至所述目標項目入口對應的項目入口文件中進行渲染，得到首屏骨架屏包括：若所述初始骨架屏與所述目標終端的頁面相匹配，則在所述目標項目入口對應的項目入口文件中掛載預置的內聯標簽，得到初始項目內聯標簽；將所述初始骨架屏路由路徑寫入所述初始項目內聯標簽中，得到第一目標項目內聯標簽；對所述第一目標項目內聯標簽添加層疊樣式表和顯示尺寸，得到首屏骨架屏，其中，所述顯示尺寸與所述目標終端的顯示尺寸相同。

可選的，在本發明第一方面的第四種實現方式中，所述通過哈希路由對首屏骨架屏進行路由轉場渲染，得到目標骨架屏包括：通過預置的監聽函數監聽哈希路由的哈希值；當通過所述監聽函數監聽到哈希值發生變化時，基于預置的導航鉤子和所述哈希路由對所述首屏骨架屏進行渲染，得到目標骨架屏。