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