網(wǎng)頁內(nèi)容的延遲加載方法及系統(tǒng)的制作方法
【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及無線網(wǎng)絡(luò)通信技術(shù)領(lǐng)域,尤其涉及一種網(wǎng)頁內(nèi)容的延遲加載方法及系統(tǒng)。
【背景技術(shù)】
[0002]隨著互聯(lián)網(wǎng)技術(shù)、特別是無線移動互聯(lián)網(wǎng)技術(shù)的普及和發(fā)展,越來越多的用戶開始使用無線移動終端(包括但不限于:手機、個人數(shù)字助理PDA、平板電腦等)上網(wǎng)獲取信息。
[0003]同時,由于提供網(wǎng)頁服務(wù)的技術(shù)相對成熟,具有開發(fā)周期短、技術(shù)門檻低、維護成本低、用戶獲取方便且有利于移動終端的隱私和安全保護等特點,因此,大多數(shù)互聯(lián)網(wǎng)信息提供商均青睞于提供網(wǎng)頁服務(wù),其中網(wǎng)頁內(nèi)容一般包括文本、圖片、視頻、音頻等。
[0004]通常,用戶在使用無線移動終端的瀏覽器上網(wǎng)時,除了需要通過無線網(wǎng)絡(luò)加載內(nèi)容數(shù)據(jù)之外,還需要加載網(wǎng)頁的樣式信息,使得網(wǎng)頁具有一定的格式以及排版,從而能夠符合用戶的閱讀使用習慣。但是無線網(wǎng)絡(luò)傳輸速度相對緩慢并且運營商單位流量的價格更貴,目前的互聯(lián)網(wǎng)網(wǎng)站更多是針對個人電腦的訪問而設(shè)計,在移動終端上體驗不佳,這些因素都影響了用戶使用無線終端上網(wǎng)瀏覽的用戶體驗。
[0005]以下簡單介紹利用無線移動終端的瀏覽器訪問互聯(lián)網(wǎng)網(wǎng)頁的相關(guān)術(shù)語和相關(guān)技術(shù)。
[0006]DOM:即文檔對象模型(Document Object Model),是萬維網(wǎng)聯(lián)盟W3C推薦的處理可擴展標志語言的標準編程接口。DOM可以以一種獨立于平臺和語言的方式訪問和修改一個文檔的內(nèi)容和結(jié)構(gòu)。DOM實際上是以面向?qū)ο蠓绞矫枋龅奈臋n模型。DOM定義了表示和修改文檔所需的對象、這些對象的行為和屬性以及這些對象之間的關(guān)系??梢园袲OM認為是頁面上數(shù)據(jù)和結(jié)構(gòu)的一個樹形表示,不過頁面當然可能并不是以這種樹的方式具體實現(xiàn)。根據(jù)W3C DOM規(guī)范,DOM是HTML與XML的應(yīng)用編程接口(API),DOM將整個頁面映射為一個由層次節(jié)點組成的文件。根據(jù)DOM,HTML文檔中的每個成分都是一個節(jié)點。節(jié)點彼此都有等級和包含關(guān)系。HTML文檔中的所有節(jié)點組成了一個文檔樹(或節(jié)點樹)。HTML文檔中的每個元素、屬性、文本等都代表著樹中的一個節(jié)點。樹起始于文檔節(jié)點,并由此繼續(xù)伸出枝條,直到處于這棵樹最低級別的所有文本節(jié)點為止。
[0007]CSS:即層疊樣式表(Cascading Style Sheets)。級聯(lián)樣式表是一種用來表現(xiàn)HTML(標準通用標記語言的一個應(yīng)用)或XML(標準通用標記語言)等內(nèi)容樣式的計算機語言。CSS是能夠真正做到網(wǎng)頁表現(xiàn)與內(nèi)容分離的一種樣式設(shè)計語言。相對于傳統(tǒng)HTML的表現(xiàn)而言,CSS能夠?qū)W(wǎng)頁中的對象的位置排版進行像素級的精確控制,支持幾乎所有的字體字號樣式,擁有對網(wǎng)頁對象和模型樣式編輯的能力,并能夠進行初步交互設(shè)計,是目前基于文本展示最優(yōu)秀的表現(xiàn)設(shè)計語言。CSS能夠根據(jù)不同使用者的理解能力,簡化或者優(yōu)化寫法,針對各類人群,有較強的易讀性。
[0008]JavaScript(JS):一種直譯式腳本語言,是一種動態(tài)類型、弱類型、基于原型的語言,內(nèi)置支持類型。它的解釋器被稱為JavaScript引擎,為瀏覽器的一部分,廣泛用于客戶端的腳本語言,最早是在HTML(標準通用標記語言下的一個應(yīng)用)網(wǎng)頁上使用,用來給HTML網(wǎng)頁增加動態(tài)功能。
[0009]另外,利用無線移動終端的瀏覽器打開互聯(lián)網(wǎng)網(wǎng)頁的過程大體上包括以下步驟:
[0010]加載網(wǎng)頁文件、解析DOM樹、JavaScript運行、CSS解析和網(wǎng)頁渲染、網(wǎng)頁的展現(xiàn)和交互。
[0011]具體而言,在利用無線移動終端的瀏覽器打開互聯(lián)網(wǎng)網(wǎng)頁時,瀏覽器向WEB服務(wù)器發(fā)出一個請求(即發(fā)送一個網(wǎng)頁文件)。然后,WEB服務(wù)器向無線移動終端返回一個網(wǎng)頁文件,在返回的網(wǎng)頁文件中包括頁面加載的初始內(nèi)容的HTML描述。
[0012]無線移動終端的瀏覽器在收到返回的網(wǎng)頁文件后將會使用HTML規(guī)范,將該網(wǎng)頁文件解析為DOM樹。在DOM樹中包含一些特別的DOM節(jié)點,它們描述為一些特定類別的內(nèi)容外鏈,比如描述網(wǎng)頁需要的JavaScript文件外鏈,描述網(wǎng)頁中嵌入顯示的圖片、視頻文件外鏈,描述網(wǎng)頁內(nèi)容展現(xiàn)樣式描述的CSS文件外鏈等。瀏覽器會在DOM樹解析中立即發(fā)起對這些內(nèi)容的網(wǎng)絡(luò)請求。
[0013]當DOM樹的解析中遇到JavaScript節(jié)點,瀏覽器會立即執(zhí)行其中所描述的JavaScript程序代碼段。這些程序同樣可能對已有的DOM樹進行修改,從而影響網(wǎng)頁的內(nèi)容展現(xiàn)。
[0014]在DOM樹構(gòu)造完成后,瀏覽器會使用網(wǎng)頁內(nèi)描述的CSS信息,對DOM樹上所有的內(nèi)容進行排版和樣式的處理。這些內(nèi)容和樣式最終通過瀏覽器的圖形界面得以描繪展現(xiàn)。
[0015]在網(wǎng)頁加載完成后,網(wǎng)頁內(nèi)容不僅可讀,而且包含一定的用戶交互。網(wǎng)頁瀏覽用戶可以通過鼠標、鍵盤、屏幕觸摸等向網(wǎng)頁輸入信息,網(wǎng)頁中的一些DOM節(jié)點或JavaScript程序會響應(yīng)這些輸入,并修改網(wǎng)頁的內(nèi)容展現(xiàn)和網(wǎng)頁的運行狀態(tài)。網(wǎng)頁的狀態(tài)得以持續(xù),直至網(wǎng)頁被瀏覽器關(guān)閉。
[0016]目前使用無線移動終端(例如,手機)訪問互聯(lián)網(wǎng)網(wǎng)頁至少存在以下問題。
[0017]1、屏幕尺寸的限制問題;
[0018]目前互聯(lián)網(wǎng)上針對普通個人電腦設(shè)計的PC站點相對于針對手機設(shè)計的移動站點而言,優(yōu)勢在于信息價值更大。這種優(yōu)勢體現(xiàn)在PC站點的用戶習慣、內(nèi)容數(shù)量、內(nèi)容質(zhì)量和更新速度等方面。但是針對個人電腦設(shè)計的PC站點的網(wǎng)頁排版版式往往不適合手機瀏覽。由于頁面寬度固定且寬度過大、字體偏小等原因,在手機上閱讀PC站點的網(wǎng)頁非常不方便。
[0019]2、網(wǎng)速和單位流量成本問題;
[0020]對于針對個人電腦設(shè)計的PC站點,其接入網(wǎng)絡(luò)一般為固定網(wǎng)絡(luò)。相比于移動網(wǎng)絡(luò),固定網(wǎng)絡(luò)在網(wǎng)絡(luò)帶寬、網(wǎng)絡(luò)傳輸時延、單位數(shù)據(jù)流量成本和價格方面具有明顯優(yōu)勢。因此,PC站點網(wǎng)頁設(shè)計通常在頁面中包括大量的非網(wǎng)頁主體內(nèi)容,訪問時普遍需要消耗較大的數(shù)據(jù)流量。
[0021]3、電池續(xù)航問題。
[0022]考慮到個人電腦處理能力一般比手機更強,同時個人電腦一般具有固定電源或大功率移動電源,因此PC站點的網(wǎng)頁運行時比手機網(wǎng)站網(wǎng)頁需要更多的CPU消耗以及更多的電量消耗。
[0023]在使用手機訪問PC站點網(wǎng)頁時,可以通過瀏覽加速服務(wù)器來解決上述問題或減小上述問題的不利影響。通過瀏覽加速服務(wù)器加速可以提升手機訪問互聯(lián)網(wǎng)網(wǎng)頁的速度并且減少網(wǎng)頁訪問中電池電量消耗。同時為了便于用戶閱讀,瀏覽加速服務(wù)器可以針對手機的屏幕尺寸,進行內(nèi)容的重新排版。
[0024]現(xiàn)有瀏覽加速服務(wù)器加速技術(shù)從兩個層次進行優(yōu)化。
[0025]1.網(wǎng)頁加載相關(guān)資源文件的過濾、合并和壓縮。
[0026]在瀏覽器所進行的網(wǎng)頁加載過程中,瀏覽器需要首先獲取網(wǎng)頁地址所對應(yīng)的頁面文件(簡稱為:主鏈)。在所獲取的頁面文件中包含眾多的鏈接用于頁面內(nèi)容的處理和頁面渲染(簡稱為:外鏈),比如常見的CSS外鏈、JS外鏈、圖片資源等。一個復雜的網(wǎng)頁所需要加載的外鏈很多,通過對這些外鏈的合并、過濾和壓縮,可以提升頁面加載速度,并能在一定程度上達到降低網(wǎng)絡(luò)流量消耗的目的。
[0027]2.頁面內(nèi)容的過濾和排版適配。
[0028]通過對頁面內(nèi)容的分析,過濾掉部分不常使用的網(wǎng)頁內(nèi)容。比如常見的廣告、過多的站點閱讀引導等。通過對頁面內(nèi)容的重排,可以讓處理后的頁面寬度適應(yīng)當前終端屏幕,讓內(nèi)容便于在小尺寸屏幕的設(shè)備上閱讀。
[0029]但是,現(xiàn)有技術(shù)往往基于整頁的加載。被瀏覽網(wǎng)頁針對PC而設(shè)計,頁面非常可能很大,過大的網(wǎng)頁在服務(wù)器優(yōu)化后一次性下載到手機客戶端,所需要加載的網(wǎng)頁內(nèi)容同樣會很大,因此加速效果受限。同時由于頁面過大,大部分的內(nèi)容可能在網(wǎng)頁關(guān)閉前不會被閱讀到,因此會造成很大比例的數(shù)據(jù)流量的浪費。
[0030]公開于本【背景技術(shù)】部分的信息僅僅旨在加深對本發(fā)明的一般【背景技術(shù)】的理解,而不應(yīng)當被視為承認或以任何形式暗示該信息構(gòu)成已經(jīng)為本領(lǐng)域技術(shù)人員所公知的現(xiàn)有技術(shù)。
【發(fā)明內(nèi)容】
[0031]本發(fā)明旨在至少解決上述技術(shù)問題之一。
[0032]本發(fā)明提供一種網(wǎng)頁內(nèi)容的延遲加載方法,包括以下步驟:
[0033]發(fā)起步驟:通過無線移動終端的瀏覽器向瀏覽加速服務(wù)器發(fā)起瀏覽加速請求;
[0034]獲取和分析步驟:在接收到所述瀏覽加速請求之后,通過所述瀏覽加速服務(wù)器從互聯(lián)網(wǎng)服務(wù)器獲取網(wǎng)頁內(nèi)容并對所述網(wǎng)頁內(nèi)容進行分析,生成返回信息;