[發明專利]一種基于CMSPWEB的頁面監聽滾動渲染方法在審

申請號：	201910915077.4	申請日：	2019-09-26
公開（公告）號：	CN110609729A	公開（公告）日：	2019-12-24
發明（設計）人：	陳警衛;葛東遙;李朝銘	申請（專利權）人：	浪潮軟件股份有限公司
主分類號：	G06F9/451	分類號：	G06F9/451
代理公司：	37100 濟南信達專利事務所有限公司	代理人：	郗艷榮
地址：	250100 山東***	國省代碼：	山東;37
權利要求書：	查看更多	說明書：	查看更多
摘要：
搜索關鍵詞：	渲染頁面監聽服務器壓力滾動操作加載數據請求服務自動監聽瀏覽器滾動控制臺數據更新數據加載頁面渲染用戶等待用戶體驗
鉆瓜網技術展會專利詞庫專利權人專利榜在售專利公布日期熱門專利

【說明書】：

本發明特別涉及一種基于CMSPWEB的頁面監聽滾動渲染方法。該基于CMSPWEB的頁面監聽滾動渲染方法，通過CMSPWEB控制臺自動監聽用戶對頁面的滾動操作，分批次請求服務加載數據，生成多個DOM節點實現異步渲染頁面，進而減輕瀏覽器和服務器壓力。該基于CMSPWEB的頁面監聽滾動渲染方法，能夠自動監聽用戶對頁面的滾動操作分批次請求服務加載數據，然后渲染HTLMDOM，減輕了瀏覽器和服務器壓力，解決了大量數據更新或頻繁刷新頁面時渲染時間過長，頁面渲染遲緩的問題，有效縮減了用戶等待數據加載渲染頁面的時間，提高了用戶體驗。

技術領域

本發明涉及頁面渲染技術領域，特別涉及一種基于CMSPWEB的頁面監聽滾動渲染方法。

背景技術

CMSP(浪潮云消息服務引擎)是云和大數據時代的一種高性能消息中間件，以云服務和集群方式對外提供高性能和高可靠的消息隊列服務，支撐大數據采集、匯聚、交換，大數據實時處理和微服務處理架構。

目前CMSPWEB控制臺做數據監控頁面時，需要前端頁面渲染顯示后臺返回的數據，第一次渲染頁面時，需要生成HTML DOM渲染頁面信息。

常用的HTML頁面渲染過程，包括HTML構建DOM樹，構建渲染樹，布局渲染樹和繪制渲染樹幾個部分。具體來說，包括以下步驟：

第一步，解析HTML文件，創建DOM樹，所述DOM樹由HTML文件中的標簽排列組成；

第二步，解析CSS，生成CSSOM，CSS對象模型；

第三步，DOM和CSS合并，構建渲染樹(render tree)；

其中，渲染樹(render tree)是在DOM樹中加入CSS或HTML中的style樣式而形成的，而且渲染樹(render tree)只包含需要顯示在頁面中的DOM元素，像<head>元素或display屬性值為none的元素都不在渲染樹中。

第四步，布局(layout)和繪制(paint)，重繪(repaint)和重排(reflow/回流)。

在瀏覽器還沒接收到完整的HTML文件時，頁面渲染就開始了，在遇到外部鏈入的腳本標簽或樣式標簽或圖片時，會再次發送HTTP請求重復上述的步驟。在收到CSS文件后會對已經渲染的頁面重新渲染，加入它們應有的樣式，圖片文件加載完立刻顯示在相應位置。在這一過程中可能會觸發頁面的重繪或重排。