[發(fā)明專利]頁(yè)面渲染方法、裝置、電子設(shè)備及計(jì)算機(jī)可讀介質(zhì)

在審

• 申請(qǐng)?zhí)枺?/td>: 201910442054.6
• 申請(qǐng)日: 2019-05-24
• 公開（公告）號(hào): CN111984888A
• 公開（公告）日: 2020-11-24
• 發(fā)明（設(shè)計(jì)）人: 劉森森;龐錦貴;趙金慶;劉翔
• 申請(qǐng)（專利權(quán)）人: 阿里巴巴集團(tuán)控股有限公司
• 主分類號(hào): G06F16/957
• 分類號(hào): G06F16/957
• 代理公司: 北京合智同創(chuàng)知識(shí)產(chǎn)權(quán)代理有限公司 11545
• 代理人: 李杰

本申請(qǐng)實(shí)施例提供了一種頁(yè)面渲染方法、裝置、電子設(shè)備及計(jì)算機(jī)可讀介質(zhì)，涉及互聯(lián)網(wǎng)技術(shù)領(lǐng)域。其中,所述方法包括：在檢測(cè)到針對(duì)移動(dòng)應(yīng)用的頁(yè)面訪問(wèn)入口的第一觸發(fā)操作時(shí)，從服務(wù)器獲取與所述頁(yè)面訪問(wèn)入口對(duì)應(yīng)的第一格式的頁(yè)面內(nèi)容數(shù)據(jù)，其中，所述第一格式為符合頁(yè)面數(shù)據(jù)傳輸協(xié)議的數(shù)據(jù)格式；將所述第一格式的頁(yè)面內(nèi)容數(shù)據(jù)轉(zhuǎn)換為可被渲染的第二格式的頁(yè)面內(nèi)容數(shù)據(jù)；在接收到針對(duì)所述頁(yè)面訪問(wèn)入口的第二觸發(fā)操作時(shí)，基于所述第二格式的頁(yè)面內(nèi)容數(shù)據(jù)渲染所述頁(yè)面訪問(wèn)入口對(duì)應(yīng)的頁(yè)面。通過(guò)本申請(qǐng)實(shí)施例，不僅能夠有效提升用戶打開頁(yè)面的速度，而且還能夠有效降低服務(wù)端的成本。

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

本申請(qǐng)實(shí)施例涉及互聯(lián)網(wǎng)技術(shù)領(lǐng)域，尤其涉及一種頁(yè)面渲染方法、裝置、電子設(shè)備及計(jì)算機(jī)可讀介質(zhì)。

背景技術(shù)

頁(yè)面渲染技術(shù)是將頁(yè)面內(nèi)容數(shù)據(jù)通過(guò)一定規(guī)則轉(zhuǎn)換為HTML(Hyper Text MarkupLanguage，超文本標(biāo)記語(yǔ)言)內(nèi)容數(shù)據(jù)，然后通過(guò)瀏覽器給用戶展示頁(yè)面的技術(shù)。隨著移動(dòng)互聯(lián)網(wǎng)的發(fā)展，用戶對(duì)于頁(yè)面打開速度提出了更高的訴求。

在現(xiàn)有技術(shù)中，常見的頁(yè)面渲染技術(shù)有兩種，即SSR(Server Side Rendering，由服務(wù)端進(jìn)行頁(yè)面渲染的技術(shù))方案和CSR(Client Side Rendering，由瀏覽器通過(guò)打開網(wǎng)頁(yè)執(zhí)行腳本代碼進(jìn)行頁(yè)面渲染的技術(shù))方案。

對(duì)于SSR方案來(lái)說(shuō)，服務(wù)器返回的是結(jié)構(gòu)相對(duì)完整的HTML文件，瀏覽器通過(guò)解析服務(wù)器返回的HTML文件，渲染出頁(yè)面，也就是說(shuō)，不需要瀏覽器執(zhí)行腳本代碼便可渲染頁(yè)面。然而，由于需要在服務(wù)端轉(zhuǎn)換得到結(jié)構(gòu)相對(duì)完整的HTML文件，這就要求服務(wù)端具備更高的數(shù)據(jù)處理能力，并且由于需要下發(fā)結(jié)構(gòu)相對(duì)完整的HTML文件到瀏覽器，網(wǎng)絡(luò)傳輸?shù)臄?shù)據(jù)量會(huì)更大，進(jìn)而給服務(wù)端帶來(lái)較大的計(jì)算和數(shù)據(jù)傳輸成本。

對(duì)于CSR方案來(lái)說(shuō)，瀏覽器獲取到的是只包含腳本代碼的HTML文件。在瀏覽器渲染出頁(yè)面之前，需要執(zhí)行腳本代碼，以創(chuàng)建動(dòng)態(tài)HTML標(biāo)簽。然而，這會(huì)導(dǎo)致用戶首先看到的是空白頁(yè)面，等待腳本代碼執(zhí)行完成以后，用戶才能看到完整的頁(yè)面，進(jìn)而給用戶帶來(lái)不良的用戶體驗(yàn)。

由此可見，如何有效提升用戶打開頁(yè)面的速度，并降低服務(wù)端的成本成為當(dāng)前亟待解決的技術(shù)問(wèn)題。

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

本申請(qǐng)的目的在于提出一種頁(yè)面渲染方法、裝置、電子設(shè)備及計(jì)算機(jī)可讀介質(zhì)，用于解決現(xiàn)有技術(shù)中存在的如何有效提升用戶打開頁(yè)面的速度，并降低服務(wù)端的成本的問(wèn)題。

根據(jù)本申請(qǐng)實(shí)施例的第一方面，提供了一種頁(yè)面渲染方法。所述方法包括：在檢測(cè)到針對(duì)移動(dòng)應(yīng)用的頁(yè)面訪問(wèn)入口的第一觸發(fā)操作時(shí)，從服務(wù)器獲取與所述頁(yè)面訪問(wèn)入口對(duì)應(yīng)的第一格式的頁(yè)面內(nèi)容數(shù)據(jù)，其中，所述第一格式為符合頁(yè)面數(shù)據(jù)傳輸協(xié)議的數(shù)據(jù)格式；將所述第一格式的頁(yè)面內(nèi)容數(shù)據(jù)轉(zhuǎn)換為可被渲染的第二格式的頁(yè)面內(nèi)容數(shù)據(jù)；在接收到針對(duì)所述頁(yè)面訪問(wèn)入口的第二觸發(fā)操作時(shí)，基于所述第二格式的頁(yè)面內(nèi)容數(shù)據(jù)渲染所述頁(yè)面訪問(wèn)入口對(duì)應(yīng)的頁(yè)面。

根據(jù)本申請(qǐng)實(shí)施例的第二方面，提供了一種頁(yè)面渲染裝置。所述裝置包括：獲取模塊，用于在檢測(cè)到針對(duì)移動(dòng)應(yīng)用的頁(yè)面訪問(wèn)入口的第一觸發(fā)操作時(shí)，從服務(wù)器獲取與所述頁(yè)面訪問(wèn)入口對(duì)應(yīng)的第一格式的頁(yè)面內(nèi)容數(shù)據(jù)，其中，所述第一格式為符合頁(yè)面數(shù)據(jù)傳輸協(xié)議的數(shù)據(jù)格式；第一轉(zhuǎn)換模塊，用于將所述第一格式的頁(yè)面內(nèi)容數(shù)據(jù)轉(zhuǎn)換為可被渲染的第二格式的頁(yè)面內(nèi)容數(shù)據(jù)；第一渲染模塊，用于在接收到針對(duì)所述頁(yè)面訪問(wèn)入口的第二觸發(fā)操作時(shí)，基于所述第二格式的頁(yè)面內(nèi)容數(shù)據(jù)渲染所述頁(yè)面訪問(wèn)入口對(duì)應(yīng)的頁(yè)面。

根據(jù)本申請(qǐng)實(shí)施例的第三方面，提供了一種電子設(shè)備，包括：一個(gè)或多個(gè)處理器；計(jì)算機(jī)可讀介質(zhì)，配置為存儲(chǔ)一個(gè)或多個(gè)程序，當(dāng)所述一個(gè)或多個(gè)程序被所述一個(gè)或多個(gè)處理器執(zhí)行，使得所述一個(gè)或多個(gè)處理器實(shí)現(xiàn)如上述實(shí)施例的第一方面所述的頁(yè)面渲染方法。

根據(jù)本申請(qǐng)實(shí)施例的第四方面，提供了一種計(jì)算機(jī)可讀介質(zhì)，其上存儲(chǔ)有計(jì)算機(jī)程序，該程序被處理器執(zhí)行時(shí)實(shí)現(xiàn)如上述實(shí)施例的第一方面所述的頁(yè)面渲染方法。