回覆列表
  • 1 # 做網站的彭先生

    下面我將介紹幾個最佳化網站載入網頁速度的簡單方法,一起來看一下。

    1.伺服器響應時間

    即使網站已經格外最佳化,但是除非伺服器響應時間非常快,否則就不會有什麼大的效果。當涉及到提高網站的速度,伺服器響應時間起著重要的作用。下面是一些提高伺服器響應時間的小貼士。

    ●有獨立的伺服器,而不是選擇共享/託管伺服器。

    ●提高Web伺服器的質量。

    ●移除不必要的外掛,只有那些必要的外掛,才需要一直保持啟用狀態。

    2.瀏覽器快取

    瀏覽器快取可以減少HTTP請求,從而反過來提高網站的載入速度。下面就是如何利用瀏覽器快取的程式碼示例:

    <IfModule mod_expires.c>

    ExpiresActive On

    ExpiresByType image/jpg "access 1 year"

    ExpiresByType image/jpeg "access 1 year"

    ExpiresByType image/gif "access 1 year"

    ExpiresByType image/png "access 1 year"

    ExpiresByType text/css "access 1 month"

    ExpiresByType text/html "access 1 month"

    ExpiresByType application/pdf "access 1 month"

    ExpiresByType text/x-javascript "access 1 month"

    ExpiresByType application/x-shockwave-flash "access 1 month"

    ExpiresByType image/x-icon "access 1 year"

    ExpiresDefault "access 1 month"

    </IfModule>

    注意:如果過期時間與檔案掛鉤,而此時檔案中的內容需要更改的話,那必須先重新命名檔案,以便瀏覽器可以獲取新新增的程式碼。

    3.gzip壓縮

    gzip壓縮是一個壓縮實用程式,我們可以用它來快速載入網站。它的工作原理是在傳送HTML和CSS檔案到網際網路瀏覽器之前,先壓縮檔案大小。允許mod_defalte模組啟用Gzip壓縮,下面是如何使用它的程式碼示例:

    <IfModule mod_deflate.c>

    # Compress HTML, CSS, JavaScript, Text, XML

    AddOutputFilterByType DEFLATE application/javascript

    AddOutputFilterByType DEFLATE application/xhtml+xml

    AddOutputFilterByType DEFLATE application/xml

    AddOutputFilterByType DEFLATE text/css

    AddOutputFilterByType DEFLATE text/html

    AddOutputFilterByType DEFLATE text/javascript

    AddOutputFilterByType DEFLATE text/plain

    AddOutputFilterByType DEFLATE text/xml

    # Remove browser bugs (only needed for really old browsers)

    BrowserMatch ^Mozilla/4 gzip-only-text/html

    BrowserMatch ^Mozilla/4\.0[678] no-gzip

    BrowserMatch \bMSIE !no-gzip !gzip-only-text/html

    Header append Vary User-Agent

    </IfModule>

    4.非同步指令碼

    還有一個可以提高網站頁面速度的超棒選擇就是非同步載入指令碼。如此一來網頁負載就並不必依賴於這些非同步指令碼,網站訪問者也不再需要不得不按捺下性子,等待所有的指令碼載入完之後才能呈現頁面。在非同步模式中,指令碼是在後臺下載的。通常,我們會將第三方指令碼作為非同步指令碼,因為下載這些指令碼時常會讓網站速度變得非常慢。

    <script async src="http://www.yoursite.com/script.js"></script>

    5.內容分發網路(CDN)

    內容分發網路(CDN)是位於不同地理位置的伺服器組成的網路。每個伺服器都擁有所有網站的檔案副本。要是有網站訪問者請求檔案和網頁時,就可以直接從就近的網站伺服器傳送過來(也可以是從負載最小的伺服器)。

    6.最佳化JavaScript、HTML和CSS

    最佳化JavaScript和CSS也可以提高一個網站的網頁速度,而且這個方法非常簡單。最佳化JavaScript、HTML和CSS就是刪除所有不必要的空格和註釋,從而減小檔案大小。下面是一些最小化JavaScript和CSS的流行工具,非常有用。

    ●CSS Minifier

    ●Avivo

    ●HTML Compressor

    7.置於頂部的樣式表和底部的指令碼

    將樣式表放在頂部有助網站的迅速載入,因為這樣可以使得網頁漸進式呈現。一般地,所有的網際網路瀏覽器都支援在給定時間內並行下載兩個元件(影象、樣式和指令碼)。但是通常而言,霸道的指令碼會在並行下載時會阻止其他的下載,直到指令碼下載完畢。

    8.避免阻塞型的JavaScript和CSS

    在瀏覽器呈現網頁之前,它首先需要透過解析HTML標記語言來構建一個DOM樹。在此過程中,如果遇到了指令碼,此過程就會中止,轉而先執行指令碼,完了才會繼續原先的活動。因此建議避免阻塞型的JavaScript,尤其是外部指令碼。

    阻塞型JavaScript還會導致網站的延遲。所以不妨推遲載入那些不重要的JavaScript,或者採用非同步載入的方式。另一種選擇是將這些HTML程式碼內嵌到網站上,同時需要確保CSS的最佳化。

    9.JavaScript的延遲解析

    為了載入網頁,瀏覽器必須解析所有的<script>標記內容,從而增加了網站的載入時間。透過延遲解析指令碼,那麼就可以減少初始網站的載入時間了。

    10.啟用Keep Alive

    當用戶透過瀏覽器請求網頁時,瀏覽器首先需要訪問HTML檔案。然後它才能讀取這些檔案,並請求與其他資料相關聯(此處的資料可以是CSS,JavaScript,也可以是任何相關的影象)。

    如果“Keep Alive”選項被禁止,那麼下載網站的程序通常就會增加,從而拖累了網站速度。啟用KeepAlive的另一個好處是,它可以減少CPU的使用。

    語法: KeepAlive On

    11.影象和檔案格式

    影象對於任何網站都非常有價值,因為它能傳達一些強有力的資訊給網站的訪問者。最常見的影象格式是GIF、JPEG、PNG等。每種格式都有其長處和侷限。建議使用JPEG格式,而不是GIF和PNG影象,除非影象包含Alpha因子或者是透明的。

    12.最佳化程式碼:不使用內聯CSS

    內聯了樣式就不能清清楚楚地將內容從設計中剝離開來。同時可能還會需要大量的維護工作,給網站管理員帶來各種不便,還會進一步增加網頁的大小。

    13.檔案分離

    網站的檔案可以分為CSS、JavaScripts和影象。檔案分離雖然並不能直接改善網站的載入時間。但是,這麼做可以提高伺服器的穩定性,特別是當網站流量突然出現了尖峰的時候。子域也可以用於託管檔案,這樣可以增加並行下載的數量。

    14.儘量減少HTTP請求

    還有一種簡單的最佳化網頁速度的方法是,減少HTTP請求。當一個網站一下子收到太多的HTTP請求,它的訪客就會有響應時間延遲的體驗,這不僅增加了CPU使用率也增加了頁面的載入時間。那麼,又該如何減少HTTP請求?請見以下步驟。

    ●減少網站上的物件數量。

    ●最小化網站上的重定向數量。

    ●使用CSS Sprites技術(只要你需要的那部分圖片內容)。

    ●結合JavaScripts和CSS。

    上述建議已被證明在最佳化網站的頁面載入速度上非常有效。總之,炫彩奪目的圖形,有趣的內容和更好的導航可以幫助你獲得更多的網站訪問者,但更快的網頁載入速度則能幫助你留住他們。

  • 2 # 可樂土豆

    最佳化網站程式碼。作為瀏覽網站時必須讀取的檔案之一,必定要重視對它的最佳化,所謂的程式碼最佳化。

    壓縮圖片檔案。通常多媒體形式的網站內容佔據頁面的空間較大,隨著多媒體內容的增加,若不做有最佳化處理,佔據的資源將會是成倍地增加,導致開啟速度變慢。

    使用響應式設計。當然網站也涉及到在不同裝置中被開啟,有些網站建設時會採用重定向的方法對網站進行不同裝置的交替變換,但這種方法使得網站在瀏覽器上的請求就會延長載入的時間。

    巧用瀏覽器。這一點則是站在使用者自身角度來說的,不排除有時候使用者開啟網站的頁面數量過多而導致瀏覽的載入速度變慢的情況

  • 中秋節和大豐收的關聯?
  • 奧地利女外長8月18日結婚,普京決定去參加婚禮,為什麼?