[發明專利]頁面預渲染方法、裝置、電子設備及存儲介質

有效

• 申請號: 202010136181.6
• 申請日: 2020-03-02
• 公開（公告）號: CN111506387B
• 公開（公告）日: 2023-09-22
• 發明（設計）人: 王寧
• 申請（專利權）人: 百度在線網絡技術（北京）有限公司
• 主分類號: G06F9/455
• 分類號: G06F9/455;G06F16/957;G06F16/958;G06F9/445
• 代理公司: 北京鴻德海業知識產權代理有限公司 11412
• 代理人: 田宏賓

1.一種頁面預渲染方法，其特征在于，包括：

針對待處理的頁面，獲取所述頁面的靜態資源，所述靜態資源中包括：層疊樣式表及JavaScript腳本；

獲取編譯后的所述頁面的超文本標記語言結構信息；

根據所述靜態資源及所述超文本標記語言結構信息，結合網頁框架原生的服務端渲染能力，生成所述頁面的靜態超文本標記語言文件，包括：在eval環境下執行所述JavaScript腳本，通過JavaScript文檔對象模型JSDOM模擬所需的瀏覽器宿主環境，結合所述網頁框架原生的服務端渲染能力，生成所述頁面的靜態超文本標記語言文件，所述eval為可在無界面圖形環境下執行JavaScript代碼的庫，模擬瀏覽器的執行過程，驅動頁面從初始狀態過渡到中間狀態。

2.根據權利要求1所述的方法，其特征在于，

所述獲取所述頁面的靜態資源包括：通過監聽超文本標記語言網頁包插件html-webpack-plugin的第一預定鉤子，獲取所述靜態資源；

所述獲取編譯后的所述頁面的超文本標記語言結構信息包括：通過監聽所述html-webpack-plugin的第二預定鉤子，獲取所述超文本標記語言結構信息。

3.根據權利要求2所述的方法，其特征在于，

所述第一預定鉤子包括：資源標簽生成前鉤子beforeAssetTagGeneration?hook；

所述第二預定鉤子包括：模板執行后鉤子afterTemplateExecution?hook。

4.一種頁面預渲染裝置，其特征在于，包括：獲取單元以及生成單元；

所述獲取單元，用于針對待處理的頁面，獲取所述頁面的靜態資源，并獲取編譯后的所述頁面的超文本標記語言結構信息，所述靜態資源中包括：層疊樣式表及JavaScript腳本；

所述生成單元，用于根據所述靜態資源及所述超文本標記語言結構信息，結合網頁框架原生的服務端渲染能力，生成所述頁面的靜態超文本標記語言文件，包括：在eval環境下執行所述JavaScript腳本，通過JavaScript文檔對象模型JSDOM模擬所需的瀏覽器宿主環境，結合所述網頁框架原生的服務端渲染能力，生成所述頁面的靜態超文本標記語言文件，所述eval為可在無界面圖形環境下執行JavaScript代碼的庫，模擬瀏覽器的執行過程，驅動頁面從初始狀態過渡到中間狀態。

5.根據權利要求4所述的裝置，其特征在于，

所述獲取單元通過監聽超文本標記語言網頁包插件html-webpack-plugin的第一預定鉤子，獲取所述靜態資源；

所述獲取單元通過監聽所述html-webpack-plugin的第二預定鉤子，獲取所述超文本標記語言結構信息。

6.根據權利要求5所述的裝置，其特征在于，

所述第一預定鉤子包括：資源標簽生成前鉤子beforeAssetTagGeneration?hook；

所述第二預定鉤子包括：模板執行后鉤子afterTemplateExecution?hook。

7.一種電子設備，其特征在于，包括：

至少一個處理器；以及

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

所述存儲器存儲有可被所述至少一個處理器執行的指令，所述指令被所述至少一個處理器執行，以使所述至少一個處理器能夠執行權利要求1-3中任一項所述的方法。

8.一種存儲有計算機指令的非瞬時計算機可讀存儲介質，其特征在于，所述計算機指令用于使所述計算機執行權利要求1-3中任一項所述的方法。