網(wǎng)絡(luò)瀏覽器切換歷史網(wǎng)頁的方法及網(wǎng)絡(luò)瀏覽器的制造方法
【專利摘要】本發(fā)明公開了一種網(wǎng)絡(luò)瀏覽器切換歷史網(wǎng)頁的方法及對應(yīng)的網(wǎng)絡(luò)瀏覽器，所述網(wǎng)絡(luò)瀏覽器緩存模塊和網(wǎng)頁切換模塊。緩存模塊用于在網(wǎng)絡(luò)瀏覽器展示當(dāng)前網(wǎng)頁或者離開當(dāng)前網(wǎng)頁時，將當(dāng)前網(wǎng)頁的資源緩存在頁面緩存中，所述緩存的資源至少包括DOM樹、Render樹、和網(wǎng)頁執(zhí)行資源；網(wǎng)頁切換模塊用于在網(wǎng)絡(luò)瀏覽器收到切換目標(biāo)歷史網(wǎng)頁的指令后，載入頁面緩存中的該目標(biāo)歷史網(wǎng)頁的Render樹，根據(jù)該Render樹繪制目標(biāo)歷史網(wǎng)頁，并在瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁；同時或之后，從所述頁面緩存中載入該目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源。利用本發(fā)明，可以提高網(wǎng)絡(luò)瀏覽器切換歷史網(wǎng)頁的切換速度。
【專利說明】網(wǎng)絡(luò)瀏覽器切換歷史網(wǎng)頁的方法及網(wǎng)絡(luò)瀏覽器
【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及網(wǎng)絡(luò)瀏覽器【技術(shù)領(lǐng)域】，尤其涉及一種網(wǎng)絡(luò)瀏覽器切換歷史網(wǎng)頁的方法及網(wǎng)絡(luò)瀏覽器。
【背景技術(shù)】
[0002]網(wǎng)絡(luò)瀏覽器是指萬維網(wǎng)(Web)服務(wù)的客戶端瀏覽程序，網(wǎng)絡(luò)瀏覽器可向Web服務(wù)器發(fā)送各種請求，并對從服務(wù)器發(fā)來的超文本信息和各種多媒體數(shù)據(jù)格式進行解釋、顯示和播放。
[0003]網(wǎng)絡(luò)瀏覽器在瀏覽網(wǎng)頁時，會形成一個所訪問的歷史網(wǎng)頁的列表，其中記錄有用戶曾經(jīng)瀏覽過的歷史網(wǎng)頁地址。當(dāng)用戶點擊網(wǎng)絡(luò)瀏覽器上的后退按鈕時，網(wǎng)絡(luò)瀏覽器在所述列表中記錄當(dāng)前瀏覽的網(wǎng)頁，同時根據(jù)訪問歷史列表的記錄，后退到剛才瀏覽過的前一個歷史網(wǎng)頁；之后，如果用戶點擊網(wǎng)絡(luò)瀏覽器上的前進按鈕，則網(wǎng)絡(luò)瀏覽器可以根據(jù)訪問歷史列表的記錄，前進到當(dāng)前視窗所示網(wǎng)頁的后一個歷史網(wǎng)頁。當(dāng)然，對于用戶來講，期望網(wǎng)絡(luò)瀏覽器能夠快速地顯示歷史網(wǎng)頁。為了滿足這個需求，網(wǎng)絡(luò)瀏覽器的頁面緩存技術(shù)應(yīng)運而生。
[0004]網(wǎng)絡(luò)瀏覽器的頁面緩存技術(shù)的主要方案是:在網(wǎng)絡(luò)瀏覽器對網(wǎng)頁內(nèi)的資源發(fā)生了第一次請求之后，把資源中的一部分?jǐn)?shù)據(jù)存儲在數(shù)據(jù)處理設(shè)備的頁面緩存中，當(dāng)網(wǎng)絡(luò)瀏覽器退回到歷史網(wǎng)頁，再次對該歷史網(wǎng)頁發(fā)出請求的時候，按照特定的策略加載所述頁面緩存的資源，減少HTTP請求次數(shù)與傳輸數(shù)據(jù)量，以此提高展示歷史網(wǎng)頁的速度。
[0005]目前，在與本發(fā)明最接近的現(xiàn)有技術(shù)中，所述利用網(wǎng)絡(luò)瀏覽器頁面緩存技術(shù)進行歷史網(wǎng)頁切換的具體處理方式包括如下步驟Al:
[0006]A、網(wǎng)絡(luò)瀏覽器在展示當(dāng)前網(wǎng)頁或者離開當(dāng)前網(wǎng)頁時，將當(dāng)前網(wǎng)頁的資源緩存在頁面緩存(PageChache)中。所述當(dāng)前網(wǎng)頁的資源包括:文檔對象模型(DOM,Document ObjectModel)樹、以及網(wǎng)頁執(zhí)行資源。例如具體可以調(diào)用javascript (簡稱JS)的unload回調(diào)操作緩存所述內(nèi)容。
[0007]所述DOM用于描述網(wǎng)頁的信息，它將網(wǎng)頁中的各個元素都看作一個個對象，從而使網(wǎng)頁中的元素也可以被計算機語言獲取或者編輯。DOM樹是以層次結(jié)構(gòu)組織的節(jié)點或信息片斷的集合，這個層次結(jié)構(gòu)允許開發(fā)人員在樹中導(dǎo)航尋找特定信息。所述網(wǎng)頁執(zhí)行資源例如是級聯(lián)樣式表(CSS, Cascading Style Sheet)屬性信息、javascript (簡稱JS)執(zhí)行狀態(tài)信息以及其他狀態(tài)信息等，網(wǎng)絡(luò)瀏覽器通過解析DOM樹和網(wǎng)頁執(zhí)行資源，可以獲知網(wǎng)頁的結(jié)構(gòu)和功能，從而對用戶針對網(wǎng)頁的操作指令做出對應(yīng)的響應(yīng)。
[0008]B、當(dāng)網(wǎng)絡(luò)瀏覽器將當(dāng)前視窗重新切換到一個歷史網(wǎng)頁時，如用戶點擊后退按鈕切換到上一個歷史網(wǎng)頁，或者點擊后退按鈕后再點擊前進按鈕切換到下一個歷史網(wǎng)頁，在這里將該切換后的歷史網(wǎng)頁稱為目標(biāo)歷史網(wǎng)頁。在切換到一個目標(biāo)歷史網(wǎng)頁時，首先從所述頁面緩存中讀取該目標(biāo)網(wǎng)頁對應(yīng)的DOM樹和網(wǎng)頁執(zhí)行資源，并載入所述DOM樹和網(wǎng)頁執(zhí)行資源；之后進行重新排版，所述重新排版就是根據(jù)所述DOM樹、CSS屬性信息、JS資源的執(zhí)行狀態(tài)信息等，重新建立具有有效數(shù)據(jù)的Render樹，以備該目標(biāo)網(wǎng)頁顯示到當(dāng)前網(wǎng)絡(luò)瀏覽器視窗之用。所述Render樹用于布局，具體負(fù)責(zé)DOM樹如何顯示在網(wǎng)絡(luò)瀏覽器的視窗內(nèi)，同一個DOM樹,可以對應(yīng)不同的Render樹,從而可以在網(wǎng)絡(luò)瀏覽器視窗內(nèi)顯不出靈活多變的網(wǎng)頁。
[0009]C、對目標(biāo)歷史網(wǎng)頁建立DOM樹節(jié)點與視窗位置的對應(yīng)關(guān)系表。
[0010]D、按照所建立的Render樹在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)繪制目標(biāo)網(wǎng)頁，完成對目標(biāo)網(wǎng)頁的切換。
[0011]所述步驟C是現(xiàn)有網(wǎng)絡(luò)瀏覽器技術(shù)的一種顯示與交互機制。比如，在建立好所述對應(yīng)關(guān)系表后，當(dāng)用戶點擊網(wǎng)絡(luò)瀏覽器視窗內(nèi)的某點時，該機制就會從預(yù)先建立好的所述DOM樹節(jié)點與視窗位置的對應(yīng)關(guān)系表中獲知用戶所點擊的位置是哪個DOM節(jié)點，從而可以對該DOM節(jié)點做出較快速的反應(yīng)處理。
[0012]但是，現(xiàn)有的這種利用網(wǎng)絡(luò)瀏覽器頁面緩存技術(shù)進行歷史網(wǎng)頁切換的方案中，歷史網(wǎng)頁的切換速度還是較慢，尤其是在計算資源和網(wǎng)絡(luò)帶寬資源都很有限的移動互聯(lián)網(wǎng)設(shè)備(如智能手機、掌上電腦、平板電腦等)上使用的網(wǎng)絡(luò)瀏覽器，網(wǎng)頁切換的速度會更慢，嚴(yán)重影響了用戶正常的網(wǎng)頁瀏覽體驗。
【發(fā)明內(nèi)容】
[0013]有鑒于此，本發(fā)明的主要目的在于提供一種網(wǎng)絡(luò)瀏覽器切換歷史網(wǎng)頁的方法和對應(yīng)的網(wǎng)絡(luò)瀏覽器，以提高網(wǎng)絡(luò)瀏覽器切換歷史網(wǎng)頁的切換速度。
[0014]本發(fā)明的技術(shù)方案是這樣實現(xiàn)的:
[0015]一種網(wǎng)絡(luò)瀏覽器切換歷史網(wǎng)頁的方法，包括:
[0016]網(wǎng)絡(luò)瀏覽器在展示當(dāng)前網(wǎng)頁或者離開當(dāng)前網(wǎng)頁時，將當(dāng)前網(wǎng)頁的資源緩存在頁面緩存中，所述緩存的資源至少包括文檔對象模型DOM樹、渲染Render樹、和網(wǎng)頁執(zhí)行資源；
[0017]網(wǎng)絡(luò)瀏覽器在收到切換目標(biāo)歷史網(wǎng)頁的指令后，載入頁面緩存中的該目標(biāo)歷史網(wǎng)頁的Render樹，根據(jù)該Render樹繪制目標(biāo)歷史網(wǎng)頁，并在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁；同時或之后，從所述頁面緩存中載入該目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源。
[0018]一種網(wǎng)絡(luò)瀏覽器，包括:
[0019]緩存模塊，用于在網(wǎng)絡(luò)瀏覽器展示當(dāng)前網(wǎng)頁或者離開當(dāng)前網(wǎng)頁時，將當(dāng)前網(wǎng)頁的資源緩存在頁面緩存中，所述緩存的資源至少包括DOM樹、Render樹、和網(wǎng)頁執(zhí)行資源；
[0020]網(wǎng)頁切換模塊，用于在網(wǎng)絡(luò)瀏覽器收到切換目標(biāo)歷史網(wǎng)頁的指令后，載入頁面緩存中的該目標(biāo)歷史網(wǎng)頁的Render樹，根據(jù)該Render樹繪制目標(biāo)歷史網(wǎng)頁，在瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁；同時或之后，從所述頁面緩存中載入該目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源。
[0021]與現(xiàn)有技術(shù)相比，本發(fā)明改進了對歷史網(wǎng)頁的緩存管理以及切換時的繪制方式，在緩存時需要緩存DOM樹、Render樹和網(wǎng)頁執(zhí)行資源，在收到切換目標(biāo)歷史網(wǎng)頁的指令后，省去了現(xiàn)有技術(shù)中重新排版重建Render樹的步驟，而是根據(jù)頁面緩存中的該目標(biāo)歷史網(wǎng)頁的Render樹繪制目標(biāo)歷史網(wǎng)頁，并在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁，從而使得目標(biāo)歷史網(wǎng)頁在第一時間出現(xiàn)在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)，同時或之后從所述頁面緩存中載入該目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源，用于使網(wǎng)絡(luò)瀏覽器可以對用戶針對網(wǎng)頁的操作指令做出對應(yīng)的響應(yīng)。由于整個切換過程省略了重新排版重建Render樹的步驟，因此本發(fā)明提高了網(wǎng)絡(luò)瀏覽器切換歷史網(wǎng)頁的切換速度。
[0022]同時，由于用戶在發(fā)出切換目標(biāo)歷史網(wǎng)頁的指令后，希望盡快看到目標(biāo)歷史網(wǎng)頁，再對該目標(biāo)歷史網(wǎng)頁進行操作(如點擊其中的鏈接等操作)，有時用戶甚至不會對目標(biāo)歷史網(wǎng)頁進行操作，只希望看到目標(biāo)歷史網(wǎng)頁的內(nèi)容即可，從用戶看到目標(biāo)歷史網(wǎng)頁到對該網(wǎng)頁進行操作之間有一個時間差，本發(fā)明先利用緩存的Render樹繪制目標(biāo)歷史網(wǎng)頁供用戶在第一時間查看網(wǎng)頁內(nèi)容，同時或之后利用所述時間差載入該目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源以響應(yīng)用戶遲后的操作，因此本發(fā)明不但提高了網(wǎng)絡(luò)瀏覽器切換歷史網(wǎng)頁的實際處理速度，而且從用戶感知的角度也進一步提升了歷史網(wǎng)頁的切換速度，使得用戶在發(fā)出切換指令后快速地查看到目標(biāo)歷史網(wǎng)頁。
【專利附圖】
【附圖說明】
[0023]圖1為本發(fā)明所述網(wǎng)絡(luò)瀏覽器切換歷史網(wǎng)頁的方法的一種流程圖；
[0024]圖2為本發(fā)明所述網(wǎng)絡(luò)瀏覽器采用動畫方式切換歷史網(wǎng)頁的一種具體實施流程圖；
[0025]圖3為本發(fā)明所述網(wǎng)絡(luò)瀏覽器的一種組成示意圖；
[0026]圖4為所述網(wǎng)頁切換模塊的一種組成示意圖。
【具體實施方式】
[0027]下面結(jié)合附圖及具體實施例對本發(fā)明再作進一步詳細(xì)的說明。
[0028]圖1為本發(fā)明所述網(wǎng)絡(luò)瀏覽器切換歷史網(wǎng)頁的方法的一種流程圖。參見圖1，該方法主要包括:
[0029]101、網(wǎng)絡(luò)瀏覽器在展示當(dāng)前網(wǎng)頁或者離開當(dāng)前網(wǎng)頁時，將當(dāng)前網(wǎng)頁的資源緩存在頁面緩存中，所述緩存的資源至少包括DOM樹、Render樹、和網(wǎng)頁執(zhí)行資源；
[0030]102、網(wǎng)絡(luò)瀏覽器在收到切換目標(biāo)歷史網(wǎng)頁的指令后，載入頁面緩存中的該目標(biāo)歷史網(wǎng)頁的Render樹，根據(jù)該Render樹繪制目標(biāo)歷史網(wǎng)頁，并在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁；同時或之后，從所述頁面緩存中載入該目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源。
[0031]本發(fā)明所述的網(wǎng)絡(luò)瀏覽器并不僅僅是指僅具有瀏覽網(wǎng)頁功能的常規(guī)的網(wǎng)絡(luò)瀏覽器，而且還可以是指具有瀏覽網(wǎng)頁功能的任何客戶端。所述頁面緩存是在網(wǎng)絡(luò)瀏覽器所在設(shè)備的內(nèi)存中所劃分出的緩存區(qū)域。
[0032]本發(fā)明中，所述將當(dāng)前網(wǎng)頁的資源緩存在頁面緩存中的操作可以在網(wǎng)絡(luò)瀏覽器展示當(dāng)前網(wǎng)頁時進行，也可以是在收到切換指令而離開當(dāng)前網(wǎng)頁時進行。所述切換指令例如可以是用戶點擊后退按鈕切換到上一個歷史網(wǎng)頁，或者點擊后退按鈕后再點擊前進按鈕切換到下一個歷史網(wǎng)頁。本文中將該切換后的歷史網(wǎng)頁稱為目標(biāo)歷史網(wǎng)頁，將切換前的網(wǎng)頁稱為當(dāng)前網(wǎng)頁。所述網(wǎng)頁執(zhí)行資源例如是級聯(lián)樣式表(CSS,Cascading Style Sheet)屬性信息、javascript (簡稱JS)執(zhí)行狀態(tài)信息以及其他狀態(tài)信息等。所述CSS是用來進行網(wǎng)頁風(fēng)格設(shè)計的。比如，如果想讓鏈接字未點擊時是藍色的，當(dāng)鼠標(biāo)移上去后字變成紅色的且有下劃線，這就是一種風(fēng)格。通過CSS屬性信息,可以統(tǒng)一地控制HTML中各標(biāo)志的顯不屬性，可以使網(wǎng)絡(luò)瀏覽器更能有效地控制網(wǎng)頁外觀。所述JS執(zhí)行狀態(tài)信息是JS對網(wǎng)頁的操作執(zhí)行信息，例如JS的定時操作規(guī)定在指定的時間(如30秒)之后執(zhí)行某個特定的網(wǎng)頁效果等。網(wǎng)絡(luò)瀏覽器通過解析DOM樹和網(wǎng)頁執(zhí)行資源，可以獲知網(wǎng)頁的結(jié)構(gòu)和功能，從而對用戶針對網(wǎng)頁的操作指令做出對應(yīng)的響應(yīng)。
[0033]本發(fā)明在緩存時需要緩存DOM樹、Render樹和網(wǎng)頁執(zhí)行資源，在收到切換目標(biāo)歷史網(wǎng)頁的指令后，省去了現(xiàn)有技術(shù)中重新排版重建Render樹的步驟，而是先載入頁面緩存中的該目標(biāo)歷史網(wǎng)頁的Render樹，根據(jù)該Render樹繪制目標(biāo)歷史網(wǎng)頁，并在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁，從而使得目標(biāo)歷史網(wǎng)頁在第一時間出現(xiàn)在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)，由于Render樹是用于布局顯示網(wǎng)頁的，因此此時網(wǎng)絡(luò)瀏覽器的視窗內(nèi)所顯示的是該目標(biāo)歷史網(wǎng)頁的一張圖像，用戶還無法對該圖像進行操作，但是對于用戶來講，能夠在切換網(wǎng)頁后的極短時間內(nèi)看到目標(biāo)歷史網(wǎng)頁的圖像已經(jīng)足夠，用戶可以瀏覽目標(biāo)歷史網(wǎng)頁中的內(nèi)容。在用戶瀏覽目標(biāo)歷史網(wǎng)頁內(nèi)容的同時，網(wǎng)絡(luò)瀏覽器再從所述頁面緩存中載入該目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源，通過DOM樹和網(wǎng)頁執(zhí)行資源，網(wǎng)絡(luò)瀏覽器可以獲知網(wǎng)頁的結(jié)構(gòu)和功能，從而可以對用戶針對網(wǎng)頁的操作指令做出對應(yīng)的響應(yīng)。由于整個切換過程省略了重新排版重建Render樹的步驟，因此本發(fā)明提高了網(wǎng)絡(luò)瀏覽器切換歷史網(wǎng)頁的切換速度。
[0034]由于對于那些當(dāng)初未加載完就存入歷史緩存的網(wǎng)頁，在載入該頁面緩存的資源時，網(wǎng)絡(luò)瀏覽器的資源加載器會啟動繼續(xù)完成未加載的資源(如圖片或者JS資源等)，這些新加載進來的資源可能會影響所緩存的Render樹的某些屏幕區(qū)域的有效性，導(dǎo)致這些屏幕區(qū)域的數(shù)據(jù)無效，這個無效的屏幕區(qū)域需要被重新繪制，這個需要被重新繪制的區(qū)域稱為臟區(qū)域。
[0035]現(xiàn)有技術(shù)中，為了使切換后的目標(biāo)歷史網(wǎng)頁的Render樹的數(shù)據(jù)都為有效數(shù)據(jù)，采用了完全重新排版重建Render樹的操作，導(dǎo)致了切換速度的緩慢。然而，在本發(fā)明的一種實施例中，為了在加快切換速度的同時保持目標(biāo)歷史網(wǎng)頁Render樹的有效性，可以在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)繪制網(wǎng)頁后，進一步包括臟區(qū)域的判斷重構(gòu)操作，即:判斷頁面緩存中的所述目標(biāo)歷史網(wǎng)頁的Render樹中對應(yīng)當(dāng)前視窗的區(qū)域(即當(dāng)前終端屏幕上顯示的網(wǎng)頁區(qū)域)是否存在臟區(qū)域，如果存在則重新構(gòu)建該Render樹中的該臟區(qū)域，并依照重新構(gòu)建后的Render樹在當(dāng)前視窗內(nèi)繪制網(wǎng)頁。
[0036]一個網(wǎng)頁的Render樹中的某個區(qū)域的數(shù)據(jù)變化通常是通過JS代碼從服務(wù)器獲取的，本實施例中，在所述臟區(qū)域的判斷重構(gòu)操作中，所述網(wǎng)絡(luò)瀏覽器通常通過執(zhí)行當(dāng)前視窗區(qū)域所示網(wǎng)頁的JS代碼從服務(wù)器獲取最新的數(shù)據(jù)，并判斷Render樹中對應(yīng)當(dāng)前視窗的區(qū)域中的數(shù)據(jù)是否與最新獲取的數(shù)據(jù)相同，如果不同，則確定該不同數(shù)據(jù)所在的區(qū)域為臟區(qū)域，并依照從服務(wù)器獲取的最新數(shù)據(jù)重新構(gòu)建該Render樹中的該臟區(qū)域，并依照重新構(gòu)建后的Render樹在當(dāng)前視窗內(nèi)繪制網(wǎng)頁。在此之后，用戶每調(diào)整(例如通過滾動、拖拽操作當(dāng)前視窗內(nèi)的目標(biāo)歷史網(wǎng)頁來調(diào)整)一次目標(biāo)歷史網(wǎng)頁在當(dāng)前視窗的顯示區(qū)域，則都會執(zhí)行一次所述臟區(qū)域的判斷重構(gòu)操作，從而使得當(dāng)前視窗的顯示區(qū)域中所顯示的目標(biāo)歷史網(wǎng)頁的數(shù)據(jù)為最新數(shù)據(jù)。
[0037]由于上述臟區(qū)域的判斷重構(gòu)操作只涉及到整個Render樹中的一部分區(qū)域，因此所耗費的時間比起重構(gòu)整個Render樹來說要少的多，這樣既加快了歷史網(wǎng)頁的切換速度，又保證了切換后的目標(biāo)歷史網(wǎng)頁的數(shù)據(jù)有效性。
[0038]另外，本發(fā)明還省略了現(xiàn)有技術(shù)中在切換目標(biāo)歷史網(wǎng)頁過程中的建立DOM樹節(jié)點與視窗位置的對應(yīng)關(guān)系表的步驟，改為待切換好目標(biāo)歷史網(wǎng)頁后，即在從所述頁面緩存中載入目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源后，進一步包括:在收到用戶的點擊指令后，實時響應(yīng)計算所點擊位置對應(yīng)的DOM樹節(jié)點，并對該DOM樹節(jié)點做出對應(yīng)的處理。從而在不影響現(xiàn)有技術(shù)切換目標(biāo)歷史網(wǎng)頁所具有的功能的前提下，進一步提升了歷史網(wǎng)頁的切換速度。
[0039]在一種實施例中，所述計算所點擊位置對應(yīng)的DOM樹節(jié)點的具體方法包括一下步驟(a廣步驟(C):
[0040](a)確定所點擊位置在當(dāng)前視窗內(nèi)的坐標(biāo)。
[0041](b)根據(jù)Render樹中框架(frame)的區(qū)域位置信息,確定所述坐標(biāo)所屬的frame。所述frame是網(wǎng)頁中一個特定的子窗口，在網(wǎng)頁的Render樹中會包括該網(wǎng)頁所有的frame的區(qū)域位置信息(例如每個frame的四角的坐標(biāo)位置)，在本步驟中，本發(fā)明可以遍歷所述Render樹中的frame區(qū)域位置信息,從而查找到所述坐標(biāo)所屬的frame。
[0042](c)在所確定的frame內(nèi)，確定所述坐標(biāo)對應(yīng)的Render節(jié)點，并依照所述Render樹與DOM樹的關(guān)系確定最終對應(yīng)的DOM節(jié)點。所述Render樹中的Render節(jié)點都具有坐標(biāo)信息，在本步驟中，具體可以是遍歷所確定的frame內(nèi)的所有Render節(jié)點，從而確定所述坐標(biāo)對應(yīng)的Render節(jié)點。所述依照所述Render樹與DOM樹的關(guān)系確定最終對應(yīng)的DOM節(jié)點，具體可以根據(jù)現(xiàn)有的換算方法，根據(jù)所述Render節(jié)點換算出對應(yīng)的DOM節(jié)點。
[0043]上述實施例中，在收到切換指令后，所述在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁的具體方式為:在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)直接顯示所繪制的目標(biāo)歷史網(wǎng)頁。在另外的實施例中，為了能夠提高目標(biāo)歷史網(wǎng)頁切換過程中的流暢度，本發(fā)明還進一步采用了切換動畫的方案，即:在網(wǎng)絡(luò)瀏覽器收到切換目標(biāo)歷史網(wǎng)頁的指令后，進一步包括:根據(jù)切換前網(wǎng)頁的Render樹繪制切換前網(wǎng)頁；所述在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁的具體方式為:在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)以動畫方式漸進地退出所繪制的切換前網(wǎng)頁直至該切換前網(wǎng)頁從當(dāng)前視窗內(nèi)消失，同時以動畫方式漸進地顯示所繪制的目標(biāo)歷史網(wǎng)頁直至當(dāng)前視窗只顯示該目標(biāo)歷史網(wǎng)頁。所述漸進地退出和顯示的具體方式可以有多種形式，例如可以是目標(biāo)歷史網(wǎng)頁漸入，切換前網(wǎng)頁被擠出屏幕的效果形式。
[0044]目前現(xiàn)有技術(shù)中的網(wǎng)絡(luò)瀏覽器(比如開源的安卓系統(tǒng)網(wǎng)絡(luò)瀏覽器)在切換歷史網(wǎng)頁時是沒有采用動畫切換方式的。當(dāng)用戶瀏覽網(wǎng)頁，執(zhí)行前進或者后退的操作時，屏幕顯示內(nèi)容直接由原網(wǎng)頁轉(zhuǎn)換為前進或者后退的目標(biāo)歷史網(wǎng)頁，這種方式使的用戶瀏覽網(wǎng)頁時不流暢，因此，本發(fā)明上述實施例在進行歷史網(wǎng)頁切換如前進或者后退時增加動畫切換效果，不但能夠提高目標(biāo)歷史網(wǎng)頁切換過程中的流暢度，還可以提高用戶的舒暢感，增進用戶體驗。
[0045]圖2為本發(fā)明所述網(wǎng)絡(luò)瀏覽器采用動畫方式切換歷史網(wǎng)頁的一種具體實施流程圖。假設(shè)該實施例中，每當(dāng)網(wǎng)絡(luò)瀏覽器離開當(dāng)前網(wǎng)頁時，則將當(dāng)前網(wǎng)頁的DOM樹、Render樹、和網(wǎng)頁執(zhí)行資源緩存在頁面緩存中，當(dāng)切換歷史網(wǎng)頁時，參見圖2，網(wǎng)絡(luò)瀏覽器執(zhí)行的具體步驟包括:[0046]步驟201、監(jiān)測到切換目標(biāo)歷史網(wǎng)頁的指令。如用戶發(fā)出的指示瀏覽器前進或后退的指令。
[0047]步驟202、載入頁面緩存中的該目標(biāo)歷史網(wǎng)頁的Render樹,并根據(jù)該Render樹繪制目標(biāo)歷史網(wǎng)頁Pl ;同時根據(jù)切換前網(wǎng)頁(即當(dāng)前網(wǎng)頁)的Render樹繪制切換前網(wǎng)頁P2，本領(lǐng)域技術(shù)人員知道，在切換網(wǎng)頁時，切換前網(wǎng)頁的Render樹對于網(wǎng)絡(luò)瀏覽器是已知的，因此可以直接根據(jù)該Render樹繪制切換前網(wǎng)頁。
[0048]之后，本實施例中同時執(zhí)行切換動畫過程、和緩存及目標(biāo)歷史網(wǎng)頁載入過程。參見圖2，所述切換動畫過程參見步驟203a?步驟203b，所述緩存及目標(biāo)歷史網(wǎng)頁載入過程參見步驟203A?步驟203B。
[0049]步驟203a、倉Il建動畫對象,設(shè)置動畫持續(xù)時長。所述動畫持續(xù)時長可以為預(yù)先指定的值。
[0050]步驟203b、網(wǎng)絡(luò)瀏覽器調(diào)用繪制函數(shù)(例如手機操作系統(tǒng)中的WebView的onDraw回調(diào)函數(shù))繪制動畫。在繪制每幀動畫時，需要判斷動畫持續(xù)時長是否結(jié)束，如果沒有結(jié)束，則判斷到目前為止動畫執(zhí)行的時長占動畫總時長的比例，然后計算出所述網(wǎng)頁Pl與P2要顯示的相對偏移，然后根據(jù)所述相對偏移分別以漸漸式的動畫方式將所述兩個頁面Pl和P2繪制顯示到網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗上，所述兩個網(wǎng)頁Pl和P2可以是局部地顯示，目標(biāo)歷史網(wǎng)頁Pl逐漸進入當(dāng)前視窗，切換前網(wǎng)頁P2逐漸退出當(dāng)前視窗，直到動畫結(jié)束，則只繪制顯示目標(biāo)歷史網(wǎng)頁Pl。
[0051]上述動畫的繪制過程是由手機操作系統(tǒng)中自帶的WebView的onDraw回調(diào)函數(shù)實現(xiàn)的，所述動畫方式還可以通過自繪控件來實現(xiàn)，達到比系統(tǒng)自有的動畫有更好的效率，以及流暢度，至于采用何種自繪控件，本領(lǐng)域的技術(shù)人員可以任意選擇公知的自繪控件，本文不再贅述。另外，所述動畫還可以通過手機操作系統(tǒng)(如Andriod操作系統(tǒng))的公共類(public class)如surface_view類來實施,通過單獨線程來完成對屏幕動畫的繪制,優(yōu)勢在于surface-view在繪制時可以規(guī)定繪制的層級關(guān)系、遮蓋關(guān)系，使得動畫可以在最上面執(zhí)行，而下面依然可以執(zhí)行網(wǎng)絡(luò)瀏覽器原來的繪制動作，這樣就不需要改變、屏蔽原來的代碼邏輯，對網(wǎng)絡(luò)瀏覽器的改造成本較低。
[0052]步驟203A、將當(dāng)前網(wǎng)頁即切換前網(wǎng)頁的資源緩存在頁面緩存中，所述緩存的資源至少包括DOM樹、Render樹、和網(wǎng)頁執(zhí)行資源，例如CSS屬性信息、JS執(zhí)行狀態(tài)信息以及其他狀態(tài)信息等。
[0053]步驟203B、從所述頁面緩存中載入所述目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源。通過DOM樹和網(wǎng)頁執(zhí)行資源，網(wǎng)絡(luò)瀏覽器可以獲知網(wǎng)頁的結(jié)構(gòu)和功能，從而可以對用戶針對網(wǎng)頁的操作指令做出對應(yīng)的響應(yīng)。
[0054]步驟204、所述切換動畫結(jié)束，所述目標(biāo)歷史網(wǎng)頁載入也完成，此時網(wǎng)頁切換過程完成。
[0055]在上述實施例中，省略了現(xiàn)有技術(shù)中在切換目標(biāo)歷史網(wǎng)頁過程中的建立DOM樹節(jié)點與視窗位置的對應(yīng)關(guān)系表的步驟，改為待切換好目標(biāo)歷史網(wǎng)頁后，在收到用戶的點擊指令后，實時響應(yīng)計算所點擊位置對應(yīng)的DOM樹節(jié)點，并對該DOM樹節(jié)點做出對應(yīng)的處理。從而在不影響現(xiàn)有技術(shù)切換目標(biāo)歷史網(wǎng)頁所具有的功能的前提下，進一步提升了歷史網(wǎng)頁的切換速度。之后，[0056]圖3為本發(fā)明所述網(wǎng)絡(luò)瀏覽器的一種組成示意圖。該網(wǎng)絡(luò)瀏覽器用于執(zhí)行本發(fā)明所述的方法，該網(wǎng)絡(luò)瀏覽器是對現(xiàn)有網(wǎng)絡(luò)瀏覽器的改進，除了包括現(xiàn)有網(wǎng)絡(luò)瀏覽器的結(jié)構(gòu)功能外，還具體包括:
[0057]緩存模塊301，用于在網(wǎng)絡(luò)瀏覽器展示當(dāng)前網(wǎng)頁或者離開當(dāng)前網(wǎng)頁時，將當(dāng)前網(wǎng)頁的資源緩存在頁面緩存中，所述緩存的資源至少包括DOM樹、Render樹、和網(wǎng)頁執(zhí)行資源。
[0058]網(wǎng)頁切換模塊302，用于在網(wǎng)絡(luò)瀏覽器收到切換目標(biāo)歷史網(wǎng)頁的指令后，載入頁面緩存中的該目標(biāo)歷史網(wǎng)頁的Render樹，根據(jù)該Render樹繪制目標(biāo)歷史網(wǎng)頁，并在瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁；同時或之后，從所述頁面緩存中載入該目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源。
[0059]圖4為所述網(wǎng)頁切換模塊的一種組成示意圖。參見圖4，該網(wǎng)頁切換模塊302具體包括:第一載入子模塊401、網(wǎng)頁繪制子模塊402、顯示子模塊403和第二載入子模塊404 ；
[0060]所述第一載入子模塊401用于在網(wǎng)絡(luò)瀏覽器收到切換目標(biāo)歷史網(wǎng)頁的指令后，首先載入頁面緩存中的該目標(biāo)歷史網(wǎng)頁的Render樹；
[0061]所述網(wǎng)頁繪制子模塊402用于根據(jù)所載入的Render樹繪制目標(biāo)歷史網(wǎng)頁；
[0062]所述顯示子模塊403用于在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁；
[0063]所述第二載入子模塊404用于從所述頁面緩存中載入該目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源。
[0064]如圖4中的虛線所示，在一種實施例中，所述網(wǎng)頁切換模塊302中進一步包括臟區(qū)域重構(gòu)子模塊405，用于在所述第一載入子模塊401載入頁面緩存中的目標(biāo)歷史網(wǎng)頁的Render樹后，判斷該Render樹中對應(yīng)當(dāng)前網(wǎng)絡(luò)瀏覽器視窗的區(qū)域是否存在臟區(qū)域，如果存在則重新構(gòu)建該Render樹中的該臟區(qū)域，并觸發(fā)所述網(wǎng)頁繪制子模塊402依照重新構(gòu)建后的Render樹繪制目標(biāo)歷史網(wǎng)頁，之后觸發(fā)顯示子模塊403在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁。
[0065]如圖4中的虛線所示，在另一種實施例中，所述網(wǎng)頁切換模塊302中還可進一步包括DOM節(jié)點實時計算子模塊406，用于在所述第二載入子模塊404從所述頁面緩存中載入目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源后，判斷是否收到用戶的點擊指令，一旦收到，則實時計算所點擊位置對應(yīng)的DOM樹節(jié)點，并觸發(fā)瀏覽器對該DOM樹節(jié)點做出對應(yīng)的處理。
[0066]在另一種實施例中，為了實現(xiàn)切換歷史網(wǎng)頁時的動畫切換效果，所述網(wǎng)頁繪制子模塊402進一步用于根據(jù)切換前網(wǎng)頁的Render樹繪制切換前網(wǎng)頁；所述顯示子模塊403中進一步用于:在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)以動畫方式漸進地退出所繪制的切換前網(wǎng)頁直至該切換前網(wǎng)頁從當(dāng)前視窗內(nèi)消失，同時以動畫方式漸進地顯示所繪制的目標(biāo)歷史網(wǎng)頁直至當(dāng)前視窗只顯示該目標(biāo)歷史網(wǎng)頁。
[0067]以上所述僅為本發(fā)明的較佳實施例而已，并不用以限制本發(fā)明，凡在本發(fā)明的精神和原則之內(nèi)，所做的任何修改、等同替換、改進等，均應(yīng)包含在本發(fā)明保護的范圍之內(nèi)。
【權(quán)利要求】
1.一種網(wǎng)絡(luò)瀏覽器切換歷史網(wǎng)頁的方法，其特征在于， 網(wǎng)絡(luò)瀏覽器在展示當(dāng)前網(wǎng)頁或者離開當(dāng)前網(wǎng)頁時，將當(dāng)前網(wǎng)頁的資源緩存在頁面緩存中，所述緩存的資源至少包括文檔對象模型DOM樹、渲染Render樹、和網(wǎng)頁執(zhí)行資源； 網(wǎng)絡(luò)瀏覽器在收到切換目標(biāo)歷史網(wǎng)頁的指令后，載入頁面緩存中的該目標(biāo)歷史網(wǎng)頁的Render樹，根據(jù)該Render樹繪制目標(biāo)歷史網(wǎng)頁，并在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁；同時或之后，從所述頁面緩存中載入該目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源。
2.根據(jù)權(quán)利要求1所述的方法，其特征在于，該方法在載入頁面緩存中的目標(biāo)歷史網(wǎng)頁的Render樹后，進一步包括:判斷該Render樹中對應(yīng)當(dāng)前網(wǎng)絡(luò)瀏覽器視窗的區(qū)域是否存在臟區(qū)域，如果存在則重新構(gòu)建該Render樹中的該臟區(qū)域，依照重新構(gòu)建后的Render樹繪 制目標(biāo)歷史網(wǎng)頁，并在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁。
3.根據(jù)權(quán)利要求1所述的方法，其特征在于，該方法在從所述頁面緩存中載入目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源后，進一步包括:在收到用戶的點擊指令后，實時計算所點擊位置對應(yīng)的DOM樹節(jié)點，并對該DOM樹節(jié)點做出對應(yīng)的處理。
4.根據(jù)權(quán)利要求3所述的方法，其特征在于，所述計算所點擊位置對應(yīng)的DOM樹節(jié)點的具體方法包括: 確定所點擊位置在當(dāng)前視窗內(nèi)的坐標(biāo)； 根據(jù)所述Render樹中框架frame的區(qū)域位置信息,確定所述坐標(biāo)所屬的frame ； 在所確定的frame內(nèi)，確定所述坐標(biāo)對應(yīng)的Render節(jié)點，并依照所述Render樹與DOM樹的關(guān)系確定最終對應(yīng)的DOM節(jié)點。
5.根據(jù)權(quán)利要求1所述的方法，其特征在于，所述網(wǎng)絡(luò)瀏覽器在收到切換目標(biāo)歷史網(wǎng)頁的指令后，進一步包括:根據(jù)切換前網(wǎng)頁的Render樹繪制切換前網(wǎng)頁； 所述在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁的具體方式為:在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)以動畫方式漸進地退出所繪制的切換前網(wǎng)頁直至該切換前網(wǎng)頁從當(dāng)前視窗內(nèi)消失，同時以動畫方式漸進地顯示所繪制的目標(biāo)歷史網(wǎng)頁直至當(dāng)前視窗只顯示該目標(biāo)歷史網(wǎng)頁。
6.一種網(wǎng)絡(luò)瀏覽器，其特征在于，包括: 緩存模塊，用于在網(wǎng)絡(luò)瀏覽器展示當(dāng)前網(wǎng)頁或者離開當(dāng)前網(wǎng)頁時，將當(dāng)前網(wǎng)頁的資源緩存在頁面緩存中，所述緩存的資源至少包括DOM樹、Render樹、和網(wǎng)頁執(zhí)行資源； 網(wǎng)頁切換模塊，用于在網(wǎng)絡(luò)瀏覽器收到切換目標(biāo)歷史網(wǎng)頁的指令后，載入頁面緩存中的該目標(biāo)歷史網(wǎng)頁的Render樹，根據(jù)該Render樹繪制目標(biāo)歷史網(wǎng)頁，在瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁；同時或之后，從所述頁面緩存中載入該目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源。
7.根據(jù)權(quán)利要求6所述的網(wǎng)絡(luò)瀏覽器，其特征在于，所述網(wǎng)頁切換模塊包括第一載入子模塊、網(wǎng)頁繪制子模塊、顯示子模塊和第二載入子模塊； 所述第一載入子模塊用于在網(wǎng)絡(luò)瀏覽器收到切換目標(biāo)歷史網(wǎng)頁的指令后，首先載入頁面緩存中的該目標(biāo)歷史網(wǎng)頁的Render樹； 所述網(wǎng)頁繪制子模塊用于根據(jù)所載入的Render樹繪制目標(biāo)歷史網(wǎng)頁； 所述顯示子模塊用于在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁；所述第二載入子模塊用于從所述頁面緩存中載入該目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源。
8.根據(jù)權(quán)利要求7所述的網(wǎng)絡(luò)瀏覽器，其特征在于，所述網(wǎng)頁切換模塊中進一步包括臟區(qū)域重構(gòu)子模塊，用于在所述第一載入子模塊載入頁面緩存中的目標(biāo)歷史網(wǎng)頁的Render樹后，判斷該Render樹中對應(yīng)當(dāng)前網(wǎng)絡(luò)瀏覽器視窗的區(qū)域是否存在臟區(qū)域，如果存在則重新構(gòu)建該Render樹中的該臟區(qū)域，并觸發(fā)所述網(wǎng)頁繪制子模塊依照重新構(gòu)建后的Render樹繪制目標(biāo)歷史網(wǎng)頁，之后觸發(fā)顯示子模塊在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)顯示所繪制的目標(biāo)歷史網(wǎng)頁。
9.根據(jù)權(quán)利要求7所述的網(wǎng)絡(luò)瀏覽器，其特征在于，所述網(wǎng)頁切換模塊中進一步包括DOM節(jié)點實時計算子模塊，用于在所述第二載入子模塊從所述頁面緩存中載入目標(biāo)歷史網(wǎng)頁的DOM樹和網(wǎng)頁執(zhí)行資源后，判斷是否收到用戶的點擊指令，一旦收到，則實時計算所點擊位置對應(yīng)的DOM樹節(jié)點，并觸發(fā)網(wǎng)絡(luò)瀏覽器對該DOM樹節(jié)點做出對應(yīng)的處理。
10.根據(jù)權(quán)利要求7所述的網(wǎng)絡(luò)瀏覽器，其特征在于，所述網(wǎng)頁繪制子模塊進一步用于根據(jù)切換前網(wǎng)頁的Render樹繪制切換前網(wǎng)頁； 所述顯示子模塊中進一步用于:在網(wǎng)絡(luò)瀏覽器的當(dāng)前視窗內(nèi)以動畫方式漸進地退出所繪制的切換前網(wǎng)頁直至該切換前網(wǎng)頁從當(dāng)前視窗內(nèi)消失，同時以動畫方式漸進地顯示所繪制的目標(biāo)歷史網(wǎng)頁直至當(dāng)前視窗只顯`示該目標(biāo)歷史網(wǎng)頁。
【文檔編號】G06F17/30GK103514179SQ201210207102
【公開日】2014年1月15日 申請日期:2012年6月21日 優(yōu)先權(quán)日:2012年6月21日
【發(fā)明者】蘇可, 孔利, 劉凡超, 馬瑞林 申請人:騰訊科技（深圳）有限公司