一種網(wǎng)站頁(yè)面優(yōu)化加載的方法及裝置的制造方法
【專利摘要】本發(fā)明公開(kāi)了一種網(wǎng)站頁(yè)面優(yōu)化加載的方法及裝置，用于提升網(wǎng)站頁(yè)面加載速度。所述方法包括：獲取網(wǎng)站頁(yè)面中的圖片尺寸，并根據(jù)預(yù)設(shè)的尺寸匹配規(guī)則檢測(cè)所述圖片尺寸是否與網(wǎng)站頁(yè)面尺寸匹配，并在所述圖片尺寸與網(wǎng)站頁(yè)面尺寸不匹配時(shí)，重新定義所述圖片尺寸；根據(jù)預(yù)設(shè)的優(yōu)化規(guī)則去除網(wǎng)站頁(yè)面中的CSS文件和/或JS腳本和/或HTML文件中的空格和/或注釋。該方案通過(guò)優(yōu)化網(wǎng)站頁(yè)面的圖片尺寸以及優(yōu)化網(wǎng)站頁(yè)面的文件等方式對(duì)網(wǎng)站頁(yè)面的加載速度進(jìn)行優(yōu)化，提高了網(wǎng)站頁(yè)面加載及訪問(wèn)速度，提升了用戶體驗(yàn)。
【專利說(shuō)明】
一種網(wǎng)站頁(yè)面優(yōu)化加載的方法及裝置
技術(shù)領(lǐng)域
[0001]本發(fā)明涉及互聯(lián)網(wǎng)領(lǐng)域，特別涉及一種網(wǎng)站頁(yè)面優(yōu)化加載的方法及裝置。【背景技術(shù)】
[0002]隨著科學(xué)技術(shù)的發(fā)展及人民生活水平的提高，互聯(lián)網(wǎng)已經(jīng)成為人們工作、學(xué)習(xí)、社交以及休閑娛樂(lè)不可替代的重要方式。隨著用戶使用頻率的增高以及用戶對(duì)信息需求量的增多，互聯(lián)網(wǎng)為各類用戶提供的信息也越來(lái)越廣泛，從而使得網(wǎng)站頁(yè)面在打開(kāi)時(shí)需要加載的內(nèi)容也會(huì)越來(lái)越多；而由于網(wǎng)站頁(yè)面加載內(nèi)容的增多，其加載的速度也會(huì)越來(lái)越慢，顯示網(wǎng)站頁(yè)面的時(shí)長(zhǎng)也會(huì)越長(zhǎng)，進(jìn)而影響用戶體驗(yàn)。
【發(fā)明內(nèi)容】

[0003]本發(fā)明提供一種網(wǎng)站頁(yè)面優(yōu)化加載的方法及裝置，通過(guò)多種網(wǎng)站頁(yè)面的優(yōu)化方式對(duì)網(wǎng)站頁(yè)面的加載速度進(jìn)行優(yōu)化，提高了網(wǎng)站頁(yè)面加載及訪問(wèn)速度，提升了用戶體驗(yàn)。
[0004]根據(jù)本發(fā)明實(shí)施例的第一方面，提供一種網(wǎng)站頁(yè)面優(yōu)化加載的方法，包括:
[0005]獲取網(wǎng)站頁(yè)面中的圖片尺寸，并根據(jù)預(yù)設(shè)的尺寸匹配規(guī)則檢測(cè)所述圖片尺寸是否與網(wǎng)站頁(yè)面尺寸匹配，并在所述圖片尺寸與網(wǎng)站頁(yè)面尺寸不匹配時(shí)，重新定義所述圖片尺寸；
[0006]根據(jù)預(yù)設(shè)的優(yōu)化規(guī)則去除網(wǎng)站頁(yè)面中的CSS文件和/或JS腳本和/或HTML文件中的空格和/或注釋。
[0007]在一個(gè)實(shí)施例中，所述方法還包括:
[0008]在網(wǎng)站頁(yè)面中導(dǎo)入CSS文件時(shí)，僅使用LINK標(biāo)簽以減少加載時(shí)間；和/或
[0009]將不同的CSS文件和/或?qū)⒉煌腏S腳本和/或?qū)⒉煌膱D片放置入同一文件中以減少HTTP請(qǐng)求次數(shù)。
[0010]在一個(gè)實(shí)施例中，所述方法還包括:
[0011]將預(yù)設(shè)的JS腳本作為異步腳本進(jìn)行網(wǎng)站頁(yè)面的加載，其中，所述預(yù)設(shè)的JS腳本包括第三方腳本;和/或
[0012]通過(guò)內(nèi)容分發(fā)網(wǎng)絡(luò)響應(yīng)網(wǎng)站頁(yè)面訪問(wèn)者的訪問(wèn)請(qǐng)求。
[0013]在一個(gè)實(shí)施例中，所述方法還包括:
[0014]將CSS文件放置于頂部和/或?qū)S腳本放置于底部進(jìn)行網(wǎng)站頁(yè)面的加載;和/或
[0015]在通過(guò)解析HTML文件構(gòu)建D0M樹(shù)進(jìn)行網(wǎng)站頁(yè)面的加載時(shí)，將預(yù)設(shè)范圍內(nèi)的JS腳本設(shè)定為異步加載或延遲加載;和/或
[0016]在網(wǎng)站頁(yè)面初始加載時(shí)，將瀏覽器對(duì)JS腳本的解析過(guò)程延遲。
[0017]在一個(gè)實(shí)施例中，所述方法還包括:
[0018]在網(wǎng)站頁(yè)面的加載過(guò)程中啟用KEEP ALIVE選項(xiàng);和/或[〇〇19]在發(fā)送HTML文件以及CSS文件時(shí)，允許啟用GZIP程序進(jìn)行文件壓縮。
[0020]根據(jù)本發(fā)明實(shí)施例的第二方面，還提供一種網(wǎng)站頁(yè)面優(yōu)化加載的裝置，包括網(wǎng)站頁(yè)面優(yōu)化模塊，且所述網(wǎng)站頁(yè)面優(yōu)化模塊包括:
[0021]圖片尺寸優(yōu)化子模塊，用于獲取網(wǎng)站頁(yè)面中的圖片尺寸，并根據(jù)預(yù)設(shè)的尺寸匹配規(guī)則檢測(cè)所述圖片尺寸是否與網(wǎng)站頁(yè)面尺寸匹配，并在所述圖片尺寸與網(wǎng)站頁(yè)面尺寸不匹配時(shí)，重新定義所述圖片尺寸；[〇〇22]文件優(yōu)化子模塊，用于根據(jù)預(yù)設(shè)的優(yōu)化規(guī)則去除網(wǎng)站頁(yè)面中的CSS文件和/或JS腳本和/或HTML文件中的空格和/或注釋。
[0023]在一個(gè)實(shí)施例中，所述網(wǎng)站頁(yè)面優(yōu)化模塊還包括:[〇〇24] CSS文件導(dǎo)入優(yōu)化子模塊，用于在網(wǎng)站頁(yè)面中導(dǎo)入CSS文件時(shí)，僅使用LINK標(biāo)簽以減少加載時(shí)間；和/或
[0025]文件合并子模塊，用于將不同的CSS文件和/或?qū)⒉煌腏S腳本和/或?qū)⒉煌膱D片放置入同一文件中以減少HTTP請(qǐng)求次數(shù)。
[0026]在一個(gè)實(shí)施例中，所述網(wǎng)站頁(yè)面優(yōu)化模塊還包括:
[0027]異步腳本子模塊，用于將預(yù)設(shè)的JS腳本作為異步腳本進(jìn)行網(wǎng)站頁(yè)面的加載，其中， 所述預(yù)設(shè)的JS腳本包括第三方腳本;和/或
[0028]訪問(wèn)請(qǐng)求響應(yīng)子模塊，用于通過(guò)內(nèi)容分發(fā)網(wǎng)絡(luò)響應(yīng)網(wǎng)站頁(yè)面訪問(wèn)者的訪問(wèn)請(qǐng)求。
[0029]在一個(gè)實(shí)施例中，所述網(wǎng)站頁(yè)面優(yōu)化模塊還包括:
[0030]文件布局子模塊，用于將CSS文件放置于頂部和/或?qū)S腳本放置于底部進(jìn)行網(wǎng)站頁(yè)面的加載;和/或
[0031]JS腳本加載設(shè)定子模塊，用于在通過(guò)解析HTML文件構(gòu)建D0M樹(shù)進(jìn)行網(wǎng)站頁(yè)面的加載時(shí)，將預(yù)設(shè)范圍內(nèi)的JS腳本設(shè)定為異步加載或延遲加載;和/或
[0032]JS腳本解析延遲子模塊，用于在網(wǎng)站頁(yè)面初始加載時(shí)，將瀏覽器對(duì)JS腳本的解析過(guò)程延遲。
[0033]在一個(gè)實(shí)施例中，所述網(wǎng)站頁(yè)面優(yōu)化模塊還包括:[〇〇34] 選項(xiàng)啟用子模塊，用于在網(wǎng)站頁(yè)面的加載過(guò)程中啟用KEEP ALIVE選項(xiàng);和/或
[0035]文件壓縮子模塊，用于在發(fā)送HTML文件以及CSS文件時(shí)，允許啟用GZIP程序進(jìn)行文件壓縮。
[0036]本發(fā)明實(shí)施例提供的技術(shù)方案可產(chǎn)生以下有益效果:獲取網(wǎng)站頁(yè)面中的圖片尺寸，并根據(jù)預(yù)設(shè)的尺寸匹配規(guī)則檢測(cè)所述圖片尺寸是否與網(wǎng)站頁(yè)面尺寸匹配，并在所述圖片尺寸與網(wǎng)站頁(yè)面尺寸不匹配時(shí)，重新定義所述圖片尺寸;根據(jù)預(yù)設(shè)的優(yōu)化規(guī)則去除網(wǎng)站頁(yè)面中的CSS文件和/或JS腳本和/或HTML文件中的空格和/或注釋。該方案通過(guò)優(yōu)化網(wǎng)站頁(yè)面的圖片尺寸以及優(yōu)化網(wǎng)站頁(yè)面的文件等方式對(duì)網(wǎng)站頁(yè)面的加載速度進(jìn)行優(yōu)化，提高了網(wǎng)站頁(yè)面加載及訪問(wèn)速度，提升了用戶體驗(yàn)。
[0037]本發(fā)明的其它特征和優(yōu)點(diǎn)將在隨后的說(shuō)明書(shū)中闡述，并且，部分地從說(shuō)明書(shū)中變得顯而易見(jiàn)，或者通過(guò)實(shí)施本發(fā)明而了解。本發(fā)明的目的和其他優(yōu)點(diǎn)可通過(guò)在所寫的說(shuō)明書(shū)、權(quán)利要求書(shū)、以及附圖中所特別指出的結(jié)構(gòu)來(lái)實(shí)現(xiàn)和獲得。
[0038]下面通過(guò)附圖和實(shí)施例，對(duì)本發(fā)明的技術(shù)方案做進(jìn)一步的詳細(xì)描述?！靖綀D說(shuō)明】[〇〇39]附圖用來(lái)提供對(duì)本發(fā)明的進(jìn)一步理解，并且構(gòu)成說(shuō)明書(shū)的一部分，與本發(fā)明的實(shí)施例一起用于解釋本發(fā)明，并不構(gòu)成對(duì)本發(fā)明的限制。
[0040]在附圖中:
[0041]圖1為本發(fā)明根據(jù)一示例性實(shí)施例示出的一種網(wǎng)站頁(yè)面優(yōu)化加載的方法的流程圖。[〇〇42]圖2為本發(fā)明根據(jù)一示例性實(shí)施例示出的另一種網(wǎng)站頁(yè)面優(yōu)化加載的方法的流程圖。
[0043]圖3為本發(fā)明根據(jù)一示例性實(shí)施例示出的又一種網(wǎng)站頁(yè)面優(yōu)化加載的方法的流程圖。
[0044]圖4為本發(fā)明根據(jù)一示例性實(shí)施例示出的再一種網(wǎng)站頁(yè)面優(yōu)化加載的方法的流程圖。
[0045]圖5為本發(fā)明根據(jù)一示例性實(shí)施例示出的又一種網(wǎng)站頁(yè)面優(yōu)化加載的方法的流程圖。
[0046]圖6為本發(fā)明根據(jù)一示例性實(shí)施例示出的一種網(wǎng)站頁(yè)面優(yōu)化加載的裝置的框圖。
[0047]圖7為本發(fā)明根據(jù)一示例性實(shí)施例示出的另一種網(wǎng)站頁(yè)面優(yōu)化加載的裝置的框圖。
[0048]圖8為本發(fā)明根據(jù)一示例性實(shí)施例示出的又一種網(wǎng)站頁(yè)面優(yōu)化加載的裝置的框圖。
[0049]圖9為本發(fā)明根據(jù)一示例性實(shí)施例示出的再一種網(wǎng)站頁(yè)面優(yōu)化加載的裝置的框圖。
[0050]圖10為本發(fā)明根據(jù)一示例性實(shí)施例示出的又一種網(wǎng)站頁(yè)面優(yōu)化加載的裝置的框圖?！揪唧w實(shí)施方式】
[0051]以下結(jié)合附圖對(duì)本發(fā)明的優(yōu)選實(shí)施例進(jìn)行說(shuō)明，應(yīng)當(dāng)理解，此處所描述的優(yōu)選實(shí)施例僅用于說(shuō)明和解釋本發(fā)明，并不用于限定本發(fā)明。
[0052]本公開(kāi)實(shí)施例提供了一種網(wǎng)站頁(yè)面優(yōu)化加載的方法，用于通過(guò)多種優(yōu)化方式對(duì)網(wǎng)站頁(yè)面的加載速度進(jìn)行優(yōu)化，提高了網(wǎng)站頁(yè)面加載及訪問(wèn)速度，提升了用戶體驗(yàn)。如圖1所示，該方法包括步驟S10-S20:
[0053]在步驟S10中，獲取網(wǎng)站頁(yè)面中的圖片尺寸，并根據(jù)預(yù)設(shè)的尺寸匹配規(guī)則檢測(cè)所述圖片尺寸是否與網(wǎng)站頁(yè)面尺寸匹配，并在所述圖片尺寸與網(wǎng)站頁(yè)面尺寸不匹配時(shí)，重新定義所述圖片尺寸;其中，所述尺寸匹配規(guī)則可以根據(jù)用戶需求進(jìn)行設(shè)定，在該步驟S10中主要進(jìn)行網(wǎng)站頁(yè)面圖片的優(yōu)化，也即，在網(wǎng)站頁(yè)面的圖片超出了預(yù)設(shè)的尺寸匹配規(guī)則的時(shí)候 (比如圖片過(guò)大時(shí))參照網(wǎng)站頁(yè)面的大小重新定義圖片大小，這能夠有效地提升網(wǎng)站頁(yè)面的加載速度。[〇〇54]在步驟S20中，根據(jù)預(yù)設(shè)的優(yōu)化規(guī)則去除網(wǎng)站頁(yè)面中的CSS文件(擴(kuò)展名為css)和/ 或JS腳本(后綴名為jsp)和/或HTML文件(*.1^111，*.1^1111)中的空格和/或注釋。在該步驟 S10中主要進(jìn)行CSS文件、JS腳本和HTML文件的優(yōu)化，也即，刪除所有CSS文件、JS腳本和HTML 文件中不必要的空格和注釋，從而減小文件大小，進(jìn)而提高網(wǎng)站頁(yè)面的加載速度。其中，所述優(yōu)化規(guī)則為去除CSS文件、JS腳本和HTML文件中不必要的空格和注釋的規(guī)則和方法(比如設(shè)定刪除特定位置的空格或注釋)，該優(yōu)化規(guī)則可以根據(jù)需要進(jìn)行設(shè)定。
[0055]可以理解的，所述步驟S20在圖1所示的實(shí)施例中其順序在所述步驟S10之后，但在一些實(shí)施例中，兩者的順序可以根據(jù)需要進(jìn)行調(diào)換。
[0056]在一個(gè)實(shí)施例中，如圖2所示，所述方法還包括步驟S30:在網(wǎng)站頁(yè)面中導(dǎo)入CSS文件時(shí)，僅使用LINK標(biāo)簽以減少加載時(shí)間；在該步驟中，主要是在網(wǎng)站頁(yè)面加載CSS文件時(shí)使用LINK標(biāo)簽而避免使用Oimport(導(dǎo)入CSS文件的一種方式)，因?yàn)镺import在嵌套入不同的 CSS文件中或者和LINK標(biāo)簽聯(lián)合使用時(shí)，明顯會(huì)增加頁(yè)面加載時(shí)間，而這樣的使用情況很難避免，因此可以通過(guò)僅使用LINK標(biāo)簽減少加載時(shí)間。[〇〇57] 如圖2所示，所述方法還包括步驟S40:將不同的CSS文件和/或?qū)⒉煌腏S腳本和/ 或?qū)⒉煌膱D片放置入同一文件中以減少HTTP(Hyper Text Transfer Protocol:超文本傳輸協(xié)議)請(qǐng)求次數(shù);而減少HTTP請(qǐng)求次數(shù)可以有效的增加網(wǎng)站頁(yè)面的加載速度。具體地， 可以將不同的CSS文件合成一個(gè)文件來(lái)減少HTTP請(qǐng)求次數(shù)；同理，也可以將不同的JS腳本合成一個(gè)文件來(lái)減少HTTP請(qǐng)求次數(shù)；另外，也可以使用CSS sprites把多個(gè)圖片文件放置到一個(gè)文件里，從而減少圖片下載的次數(shù)，進(jìn)而減少HTTP請(qǐng)求次數(shù)。[〇〇58]可理解的，圖2中所示的實(shí)施例包括步驟S30與步驟S40,但在一些實(shí)施例中，所述方法只包括其中的一個(gè)步驟。[〇〇59]在一個(gè)實(shí)施例中，如圖3所示，所述方法還包括步驟S50:將預(yù)設(shè)的JS腳本作為異步腳本進(jìn)行網(wǎng)站頁(yè)面的加載，其中，所述預(yù)設(shè)的JS腳本包括第三方腳本;在該步驟中，通過(guò)異步加載JS腳本來(lái)提高網(wǎng)站頁(yè)面加載速度，由于在異步模式中，JS腳本是在后臺(tái)下載的，因此網(wǎng)站頁(yè)面的負(fù)載并不依賴于這些異步加載的JS腳本，從而使得網(wǎng)站訪問(wèn)者不再需要等待所有的JS腳本加載完之后才能呈現(xiàn)網(wǎng)站頁(yè)面。其中，所述JS腳本可以根據(jù)需要進(jìn)行設(shè)定，可以選擇將第三方腳本作為異步腳本，因?yàn)橄螺d這些第三方腳本時(shí)常會(huì)讓網(wǎng)站頁(yè)面的加載速度變得非常慢。
[0060] 如圖3所示，所述方法還包括步驟S60:通過(guò)內(nèi)容分發(fā)網(wǎng)絡(luò)響應(yīng)網(wǎng)站頁(yè)面訪問(wèn)者的訪問(wèn)請(qǐng)求。內(nèi)容分發(fā)網(wǎng)絡(luò)是位于不同地理位置的服務(wù)器組成的網(wǎng)絡(luò)，每個(gè)服務(wù)器都擁有所有網(wǎng)站的文件副本。要是有網(wǎng)站訪問(wèn)者請(qǐng)求文件和網(wǎng)站頁(yè)面時(shí)，就可以直接從就近的網(wǎng)站服務(wù)器發(fā)送過(guò)來(lái)，因此通過(guò)內(nèi)容分發(fā)網(wǎng)絡(luò)響應(yīng)網(wǎng)站頁(yè)面訪問(wèn)者的訪問(wèn)請(qǐng)求可以有效提升網(wǎng)站頁(yè)面加載速度。[0061 ]可理解的，圖3中所示的實(shí)施例包括步驟S50與步驟S60,但在一些實(shí)施例中，所述方法只包括其中的一個(gè)步驟。
[0062]在一個(gè)實(shí)施例中，如圖4所示，所述方法還包括步驟S70:將CSS文件放置于頂部和/ 或?qū)S腳本放置于底部進(jìn)行網(wǎng)站頁(yè)面的加載;將CSS文件放在頂部有助網(wǎng)站頁(yè)面的迅速加載，因?yàn)檫@樣可以使得網(wǎng)站頁(yè)面漸進(jìn)式呈現(xiàn)。而在圖片和/或CSS文件與JS腳本并行下載時(shí)， JS腳本會(huì)阻止其他的下載，直到其下載完畢，因此將JS腳本放置于底部有助于提升網(wǎng)站頁(yè)面的加載速度。[〇〇63] 如圖4所示，所述方法還包括步驟S80:在通過(guò)解析HTML文件構(gòu)建D0M(Document Object Model:文檔對(duì)象模型)樹(shù)進(jìn)行網(wǎng)站頁(yè)面的加載時(shí)，將預(yù)設(shè)范圍內(nèi)的JS腳本設(shè)定為異步加載或延遲加載;在通過(guò)解析HTML標(biāo)記語(yǔ)言來(lái)構(gòu)建D0M樹(shù)的過(guò)程中，如果遇到了 JS腳本， 該過(guò)程就會(huì)中止，轉(zhuǎn)而先執(zhí)行腳本，待室息感腳本完成之后才會(huì)繼續(xù)原先的活動(dòng)，因此可以延遲加載那些不重要的JS腳本(可以根據(jù)需要將其加入所述預(yù)設(shè)范圍中)，或者令其采用異步加載的方式。
[0064] 如圖4所示，所述方法還包括步驟S90:在網(wǎng)站頁(yè)面初始加載時(shí)，將瀏覽器對(duì)JS腳本的解析過(guò)程延遲。在加載網(wǎng)站頁(yè)面，瀏覽器必須解析JS腳本的所有的〈script〉標(biāo)記內(nèi)容，從而增加了網(wǎng)站的加載時(shí)間，將瀏覽器對(duì)JS腳本的解析過(guò)程延遲，可以減少初始網(wǎng)站的加載時(shí)間。[〇〇65] 可理解的，圖4中所示的實(shí)施例包括步驟S70、步驟S80以及步驟S90,但在一些實(shí)施例中所述方法包括其中的一個(gè)或多個(gè)步驟。
[0066]在一個(gè)實(shí)施例中，如圖5所示，所述方法還包括步驟S100:在網(wǎng)站頁(yè)面的加載過(guò)程中啟用KEEP ALIVE選項(xiàng)；如果KEEP ALIVE選項(xiàng)被禁止，那么網(wǎng)站頁(yè)面的進(jìn)程通常就會(huì)增加， 從而拖累了網(wǎng)站的加載速度，因此可以在網(wǎng)站頁(yè)面的加載過(guò)程中啟用KEEP ALIVE選項(xiàng)，可理解的，啟用KEEP ALIVE選項(xiàng)還可以減少CPU的使用。
[0067]如圖5所示，所述方法還包括步驟S110:在發(fā)送HTML文件以及CSS文件時(shí)，允許mod_ defalte模塊啟用GZIP程序進(jìn)行文件壓縮，從而提升網(wǎng)站頁(yè)面的加載速度。[〇〇68]可理解的，圖5中所示的實(shí)施例包括步驟S110與步驟S100,但在一些實(shí)施例中，所述方法只包括其中的一個(gè)步驟。
[0069]本發(fā)明實(shí)施例提供的上述方法，獲取網(wǎng)站頁(yè)面中的圖片尺寸，并根據(jù)預(yù)設(shè)的尺寸匹配規(guī)則檢測(cè)所述圖片尺寸是否與網(wǎng)站頁(yè)面尺寸匹配，并在所述圖片尺寸與網(wǎng)站頁(yè)面尺寸不匹配時(shí)，重新定義所述圖片尺寸;根據(jù)預(yù)設(shè)的優(yōu)化規(guī)則去除網(wǎng)站頁(yè)面中的CSS文件和/或 JS腳本和/或HTML文件中的空格和/或注釋。該方案通過(guò)多種網(wǎng)站頁(yè)面的優(yōu)化方式對(duì)網(wǎng)站頁(yè)面的加載速度進(jìn)行優(yōu)化，提高了網(wǎng)站頁(yè)面加載及訪問(wèn)速度，提升了用戶體驗(yàn)。
[0070]對(duì)應(yīng)本發(fā)明實(shí)施例提供的網(wǎng)站頁(yè)面優(yōu)化加載的方法，本發(fā)明還提供網(wǎng)站頁(yè)面優(yōu)化加載的裝置，如圖6所示，該裝置包括網(wǎng)站頁(yè)面優(yōu)化模塊600，且所述網(wǎng)站頁(yè)面優(yōu)化模塊600 包括:
[0071]圖片尺寸優(yōu)化子模塊601，用于獲取網(wǎng)站頁(yè)面中的圖片尺寸，并根據(jù)預(yù)設(shè)的尺寸匹配規(guī)則檢測(cè)所述圖片尺寸是否與網(wǎng)站頁(yè)面尺寸匹配，并在所述圖片尺寸與網(wǎng)站頁(yè)面尺寸不匹配時(shí)，重新定義所述圖片尺寸；
[0072]文件優(yōu)化子模塊602,用于根據(jù)預(yù)設(shè)的優(yōu)化規(guī)則去除網(wǎng)站頁(yè)面中的CSS文件和/或 JS腳本和/或HTML文件中的空格和/或注釋。
[0073]在一個(gè)實(shí)施例中，如圖7所示，所述網(wǎng)站頁(yè)面優(yōu)化模塊600還包括:[〇〇74] CSS文件導(dǎo)入優(yōu)化子模塊603,用于在網(wǎng)站頁(yè)面中導(dǎo)入CSS文件時(shí)，僅使用LINK標(biāo)簽以減少加載時(shí)間；和/或
[0075]文件合并子模塊604,用于將不同的CSS文件和/或?qū)⒉煌腏S腳本和/或?qū)⒉煌膱D片放置入同一文件中以減少HTTP請(qǐng)求次數(shù)。
[0076]可以理解的，在圖7所示實(shí)施例中，所述網(wǎng)站頁(yè)面優(yōu)化模塊600包括所述CSS文件導(dǎo)入優(yōu)化子模塊603以及所述文件合并子模塊604,但在另一些實(shí)施例中，所述網(wǎng)站頁(yè)面優(yōu)化模塊600中可能只包括其中的一個(gè)。
[0077]在一個(gè)實(shí)施例中，如圖8所示，所述網(wǎng)站頁(yè)面優(yōu)化模塊600還包括:[〇〇78]異步腳本子模塊605,用于將預(yù)設(shè)的JS腳本作為異步腳本進(jìn)行網(wǎng)站頁(yè)面的加載，其中，所述預(yù)設(shè)的JS腳本包括第三方腳本;和/或
[0079]訪問(wèn)請(qǐng)求響應(yīng)子模塊606,用于通過(guò)內(nèi)容分發(fā)網(wǎng)絡(luò)響應(yīng)網(wǎng)站頁(yè)面訪問(wèn)者的訪問(wèn)請(qǐng)求。
[0080]可以理解的，在圖8所示實(shí)施例中，所述網(wǎng)站頁(yè)面優(yōu)化模塊600包括所述異步腳本子模塊605以及所述訪問(wèn)請(qǐng)求響應(yīng)子模塊606,但在另一些實(shí)施例中，所述網(wǎng)站頁(yè)面優(yōu)化模塊600中可能只包括其中的一個(gè)。
[0081]在一個(gè)實(shí)施例中，如圖9所示，所述網(wǎng)站頁(yè)面優(yōu)化模塊600還包括:[〇〇82]文件布局子模塊607，用于將CSS文件放置于頂部和/或?qū)S腳本放置于底部進(jìn)行網(wǎng)站頁(yè)面的加載;和/或[〇〇83] JS腳本加載設(shè)定子模塊608，用于在通過(guò)解析HTML文件構(gòu)建D0M樹(shù)進(jìn)行網(wǎng)站頁(yè)面的加載時(shí)，將預(yù)設(shè)范圍內(nèi)的JS腳本設(shè)定為異步加載或延遲加載;和/或 [〇〇84] JS腳本解析延遲子模塊609,用于在網(wǎng)站頁(yè)面初始加載時(shí)，將瀏覽器對(duì)JS腳本的解析過(guò)程延遲。[〇〇85]可以理解的，在圖9所示實(shí)施例中，所述網(wǎng)站頁(yè)面優(yōu)化模塊600包括所述文件布局子模塊607、所述JS腳本加載設(shè)定子模塊608以及所述JS腳本解析延遲子模塊609,但在另一些實(shí)施例中，所述網(wǎng)站頁(yè)面優(yōu)化模塊600中包括其中的一個(gè)或多個(gè)。
[0086]在一個(gè)實(shí)施例中，如圖10所示，所述網(wǎng)站頁(yè)面優(yōu)化模塊600還包括:[〇〇87] 選項(xiàng)啟用子模塊610,用于在網(wǎng)站頁(yè)面的加載過(guò)程中啟用KEEP ALIVE選項(xiàng);和/或 [〇〇88]文件壓縮子模塊611，用于在發(fā)送HTML文件以及CSS文件時(shí)，允許啟用GZIP程序進(jìn)行文件壓縮。
[0089]可以理解的，在圖10所示實(shí)施例中，所述網(wǎng)站頁(yè)面優(yōu)化模塊600包括所述選項(xiàng)啟用子模塊610以及所述文件壓縮子模塊611，但在另一些實(shí)施例中，所述網(wǎng)站頁(yè)面優(yōu)化模塊600 中可能只包括其中的一個(gè)。
[0090]以上，本發(fā)明各實(shí)施例所述的網(wǎng)站頁(yè)面優(yōu)化模塊中的各子模塊可以根據(jù)需要令其中的一個(gè)或多個(gè)設(shè)置在相同的設(shè)備中。[〇〇91]本領(lǐng)域內(nèi)的技術(shù)人員應(yīng)明白，本發(fā)明的實(shí)施例可提供為方法、系統(tǒng)、或計(jì)算機(jī)程序產(chǎn)品。因此，本發(fā)明可采用完全硬件實(shí)施例、完全軟件實(shí)施例、或結(jié)合軟件和硬件方面的實(shí)施例的形式。而且，本發(fā)明可采用在一個(gè)或多個(gè)其中包含有計(jì)算機(jī)可用程序代碼的計(jì)算機(jī)可用存儲(chǔ)介質(zhì)(包括但不限于磁盤存儲(chǔ)器和光學(xué)存儲(chǔ)器等)上實(shí)施的計(jì)算機(jī)程序產(chǎn)品的形式。
[0092]本發(fā)明是參照根據(jù)本發(fā)明實(shí)施例的方法、設(shè)備(系統(tǒng))、和計(jì)算機(jī)程序產(chǎn)品的流程圖和/或方框圖來(lái)描述的。應(yīng)理解可由計(jì)算機(jī)程序請(qǐng)求實(shí)現(xiàn)流程圖和/或方框圖中的每一流程和/或方框、以及流程圖和/或方框圖中的流程和/或方框的結(jié)合?？商峁┻@些計(jì)算機(jī)程序請(qǐng)求到通用計(jì)算機(jī)、專用計(jì)算機(jī)、嵌入式處理機(jī)或其他可編程信息處理設(shè)備的處理器以產(chǎn)生一個(gè)機(jī)器，使得通過(guò)計(jì)算機(jī)或其他可編程信息處理設(shè)備的處理器執(zhí)行的請(qǐng)求產(chǎn)生用于實(shí)現(xiàn)在流程圖一個(gè)流程或多個(gè)流程和/或方框圖一個(gè)方框或多個(gè)方框中指定的功能的裝置。
[0093]這些計(jì)算機(jī)程序請(qǐng)求也可存儲(chǔ)在能引導(dǎo)計(jì)算機(jī)或其他可編程信息處理設(shè)備以特定方式工作的計(jì)算機(jī)可讀存儲(chǔ)器中，使得存儲(chǔ)在該計(jì)算機(jī)可讀存儲(chǔ)器中的請(qǐng)求產(chǎn)生包括請(qǐng)求裝置的制造品，該請(qǐng)求裝置實(shí)現(xiàn)在流程圖一個(gè)流程或多個(gè)流程和/或方框圖一個(gè)方框或多個(gè)方框中指定的功能。
[0094]這些計(jì)算機(jī)程序請(qǐng)求也可裝載到計(jì)算機(jī)或其他可編程信息處理設(shè)備上，使得在計(jì)算機(jī)或其他可編程設(shè)備上執(zhí)行一系列操作步驟以產(chǎn)生計(jì)算機(jī)實(shí)現(xiàn)的處理，從而在計(jì)算機(jī)或其他可編程設(shè)備上執(zhí)行的請(qǐng)求提供用于實(shí)現(xiàn)在流程圖一個(gè)流程或多個(gè)流程和/或方框圖一個(gè)方框或多個(gè)方框中指定的功能的步驟。
[0095]顯然，本領(lǐng)域的技術(shù)人員可以對(duì)本發(fā)明進(jìn)行各種改動(dòng)和變型而不脫離本發(fā)明的精神和范圍。這樣，倘若本發(fā)明的這些修改和變型屬于本發(fā)明權(quán)利要求及其等同技術(shù)的范圍之內(nèi)，則本發(fā)明也意圖包含這些改動(dòng)和變型在內(nèi)。
【主權(quán)項(xiàng)】
1.一種網(wǎng)站頁(yè)面優(yōu)化加載的方法，其特征在于，包括:獲取網(wǎng)站頁(yè)面中的圖片尺寸，并根據(jù)預(yù)設(shè)的尺寸匹配規(guī)則檢測(cè)所述圖片尺寸是否與網(wǎng) 站頁(yè)面尺寸匹配，并在所述圖片尺寸與網(wǎng)站頁(yè)面尺寸不匹配時(shí)，重新定義所述圖片尺寸；根據(jù)預(yù)設(shè)的優(yōu)化規(guī)則去除網(wǎng)站頁(yè)面中的CSS文件和/或JS腳本和/或HTML文件中的空格 和/或注釋。2.如權(quán)利要求1所述的方法，其特征在于，所述方法還包括:在網(wǎng)站頁(yè)面中導(dǎo)入CSS文件時(shí)，僅使用LINK標(biāo)簽以減少加載時(shí)間;和/或?qū)⒉煌腃SS文件和/或?qū)⒉煌腏S腳本和/或?qū)⒉煌膱D片放置入同一文件中以減少 HTTP請(qǐng)求次數(shù)。3.如權(quán)利要求1所述的方法，其特征在于，所述方法還包括:將預(yù)設(shè)的JS腳本作為異步腳本進(jìn)行網(wǎng)站頁(yè)面的加載，其中，所述預(yù)設(shè)的JS腳本包括第 三方腳本;和/或通過(guò)內(nèi)容分發(fā)網(wǎng)絡(luò)響應(yīng)網(wǎng)站頁(yè)面訪問(wèn)者的訪問(wèn)請(qǐng)求。4.如權(quán)利要求1所述的方法，其特征在于，所述方法還包括:將CSS文件放置于頂部和/或?qū)S腳本放置于底部進(jìn)行網(wǎng)站頁(yè)面的加載;和/或在通過(guò)解析HTML文件構(gòu)建DOM樹(shù)進(jìn)行網(wǎng)站頁(yè)面的加載時(shí)，將預(yù)設(shè)范圍內(nèi)的JS腳本設(shè)定 為異步加載或延遲加載;和/或在網(wǎng)站頁(yè)面初始加載時(shí)，將瀏覽器對(duì)JS腳本的解析過(guò)程延遲。5.如權(quán)利要求1所述的方法，其特征在于，所述方法還包括:在網(wǎng)站頁(yè)面的加載過(guò)程中啟用KEEP ALIVE選項(xiàng);和/或在發(fā)送HTML文件以及CSS文件時(shí)，允許啟用GZIP程序進(jìn)行文件壓縮。6.—種網(wǎng)站頁(yè)面優(yōu)化加載的裝置，其特征在于，包括網(wǎng)站頁(yè)面優(yōu)化模塊，且所述網(wǎng)站頁(yè) 面優(yōu)化模塊包括:圖片尺寸優(yōu)化子模塊，用于獲取網(wǎng)站頁(yè)面中的圖片尺寸，并根據(jù)預(yù)設(shè)的尺寸匹配規(guī)則 檢測(cè)所述圖片尺寸是否與網(wǎng)站頁(yè)面尺寸匹配，并在所述圖片尺寸與網(wǎng)站頁(yè)面尺寸不匹配 時(shí)，重新定義所述圖片尺寸；文件優(yōu)化子模塊，用于根據(jù)預(yù)設(shè)的優(yōu)化規(guī)則去除網(wǎng)站頁(yè)面中的CSS文件和/或JS腳本 和/或HTML文件中的空格和/或注釋。7.如權(quán)利要求6所述的裝置，其特征在于，所述網(wǎng)站頁(yè)面優(yōu)化模塊還包括:CSS文件導(dǎo)入優(yōu)化子模塊，用于在網(wǎng)站頁(yè)面中導(dǎo)入CSS文件時(shí)，僅使用LINK標(biāo)簽以減少 加載時(shí)間；和/或文件合并子模塊，用于將不同的CSS文件和/或?qū)⒉煌腏S腳本和/或?qū)⒉煌膱D片放 置入同一文件中以減少HTTP請(qǐng)求次數(shù)。8.如權(quán)利要求6所述的裝置，其特征在于，所述網(wǎng)站頁(yè)面優(yōu)化模塊還包括:異步腳本子模塊，用于將預(yù)設(shè)的JS腳本作為異步腳本進(jìn)行網(wǎng)站頁(yè)面的加載，其中，所述 預(yù)設(shè)的JS腳本包括第三方腳本;和/或訪問(wèn)請(qǐng)求響應(yīng)子模塊，用于通過(guò)內(nèi)容分發(fā)網(wǎng)絡(luò)響應(yīng)網(wǎng)站頁(yè)面訪問(wèn)者的訪問(wèn)請(qǐng)求。9.如權(quán)利要求6所述的裝置，其特征在于，所述網(wǎng)站頁(yè)面優(yōu)化模塊還包括:文件布局子模塊，用于將CSS文件放置于頂部和/或?qū)S腳本放置于底部進(jìn)行網(wǎng)站頁(yè)面的加載;和/或JS腳本加載設(shè)定子模塊，用于在通過(guò)解析HTML文件構(gòu)建DOM樹(shù)進(jìn)行網(wǎng)站頁(yè)面的加載時(shí)， 將預(yù)設(shè)范圍內(nèi)的JS腳本設(shè)定為異步加載或延遲加載;和/或JS腳本解析延遲子模塊，用于在網(wǎng)站頁(yè)面初始加載時(shí)，將瀏覽器對(duì)JS腳本的解析過(guò)程 延遲。10.如權(quán)利要求6所述的裝置，其特征在于，所述網(wǎng)站頁(yè)面優(yōu)化模塊還包括:選項(xiàng)啟用子模塊，用于在網(wǎng)站頁(yè)面的加載過(guò)程中啟用KEEP ALIVE選項(xiàng);和/或 文件壓縮子模塊，用于在發(fā)送HTML文件以及CSS文件時(shí)，允許啟用GZIP程序進(jìn)行文件壓縮。
【文檔編號(hào)】G06F17/30GK106055575SQ201610340834
【公開(kāi)日】2016年10月26日
【申請(qǐng)日】2016年5月19日
【發(fā)明人】張新亮
【申請(qǐng)人】天脈聚源(北京)傳媒科技有限公司