10個助您提高網站訪問速度的技巧
阿新 • • 發佈:2019-01-30
-
1、如果可能的話,延遲載入一些內容
可以使用Ajax來按需載入部分內容。比如一個相簿,可以在使用者瀏覽頁面時先出縮圖,當用戶點選了,然後非同步請求原圖並展示,這樣使用者如果只需要看幾張圖片,就不需要等待所有圖片都載入下來。這種開發模式叫做延遲載入。
Ajax/Web開發類庫如jQuery,Prototype,與及MooTools可以使得延遲載入更容易實現。 2、使用外部JS和CSS檔案
當用戶第一次載入網頁時,瀏覽器會快取住外部的CSS和JavaScript檔案,所以將javascript和CSS放到外部檔案比內聯的會好。
使用內聯CSS還會增加網頁的渲染時間,讓所有樣式都定義在你的主CSS檔案中使得瀏覽器渲染頁面時少做一些工作,因為它一開始就知道所有需要應用的樣式規則。另外使用外部javascript和css檔案也有助於維護程式碼。 3、使用快取系統
如果你發現網站總是連線資料庫來查詢產生出同樣的結果,可能就需要使用快取系統了。使用快取的話,只需要生成一次特定的內容而不需要使用者每次訪問的時候都去生成。快取系統也會根據配置週期性的重新整理快取。你可以生成靜態HTML頁,以減小伺服器指令碼執行的開消,或者使用資料庫和服務端指令碼快取系統,比如PHP的加速器,memcached等。
4、避免在html中改變圖片大小
如果一張圖片原本是1280*900px的,但是你需要它顯示為400*280px的,你應該用圖片編輯器,如Photoshop來改變它的大小,而不是使用HTML的width和height屬性。 5、不要使用圖片來展示文字
圖片中的文字不但對使用者不友好(無法複製等),對SEO也沒有好處,而且使用圖片來顯示文字會增加頁面載入時間。如果你需要在網站中使用很多自定義的字型,可以考慮使用CSS的@font-face特性去更有效率地展現特定字型。 6、使用正確的檔案格式來優化圖片大小
通過選擇正確的力圖片格式,你可以在不損失圖片質量的情況下優化圖片大小。例如,除非你需要PNG提供的圖片透明,否則JPG一般來說可以在較小的檔案情況下逼真地顯示圖片。
7、優化寫程式碼的方式
檢視你的原始碼,看看是否所有標籤都是需要的,或是可不可以用CSS來代替。有效的書寫程式碼不但減小HTML和CSS檔案的大小,也能方便維護。 8、在文件的最後載入javascript
所有scripts都在頁面最後載入會比一開始就載入好,它可以讓瀏覽器在載入javascript前渲染所有東西。瀏覽器在javascript下載完之前阻塞下面的內容的載入。如果可以的話,儘量將javascript放在緊挨著body結束標籤的地方。 9、使用內容分發網路(Content Delivery Network,CDN)
網站的速度和使用者相對於伺服器的位置有很大的關係。將內容分發到不同的地理位置可能可以緩解這個問題。使用CDN可能會增加費用,但是收益也是很明顯的。
1、如果可能的話,延遲載入一些內容
可以使用Ajax來按需載入部分內容。比如一個相簿,可以在使用者瀏覽頁面時先出縮圖,當用戶點選了,然後非同步請求原圖並展示,這樣使用者如果只需要看幾張圖片,就不需要等待所有圖片都載入下來。這種開發模式叫做延遲載入。
Ajax/Web開發類庫如jQuery,Prototype,與及MooTools可以使得延遲載入更容易實現。 2、使用外部JS和CSS檔案
當用戶第一次載入網頁時,瀏覽器會快取住外部的CSS和JavaScript檔案,所以將javascript和CSS放到外部檔案比內聯的會好。
使用內聯CSS還會增加網頁的渲染時間,讓所有樣式都定義在你的主CSS檔案中使得瀏覽器渲染頁面時少做一些工作,因為它一開始就知道所有需要應用的樣式規則。另外使用外部javascript和css檔案也有助於維護程式碼。 3、使用快取系統
如果一張圖片原本是1280*900px的,但是你需要它顯示為400*280px的,你應該用圖片編輯器,如Photoshop來改變它的大小,而不是使用HTML的width和height屬性。 5、不要使用圖片來展示文字
圖片中的文字不但對使用者不友好(無法複製等),對SEO也沒有好處,而且使用圖片來顯示文字會增加頁面載入時間。如果你需要在網站中使用很多自定義的字型,可以考慮使用CSS的@font-face特性去更有效率地展現特定字型。 6、使用正確的檔案格式來優化圖片大小
檢視你的原始碼,看看是否所有標籤都是需要的,或是可不可以用CSS來代替。有效的書寫程式碼不但減小HTML和CSS檔案的大小,也能方便維護。 8、在文件的最後載入javascript
所有scripts都在頁面最後載入會比一開始就載入好,它可以讓瀏覽器在載入javascript前渲染所有東西。瀏覽器在javascript下載完之前阻塞下面的內容的載入。如果可以的話,儘量將javascript放在緊挨著body結束標籤的地方。 9、使用內容分發網路(Content Delivery Network,CDN)
10、優化網頁快取
既然使用了快取系統,你應該使用盡可能多的快取技術。網頁快取是瀏覽器端對檔案做的快取,然後供使用者之後的訪問。瀏覽器可以快取的內容包括CSS檔案,javascript檔案和圖片。
除了把多個頁面都用到的CSS和javascript放在一個外部檔案以外,還有很多方法來保證檔案快取起到最大的作用。例如你可以設定HTTP響應頭為Expires和Last-Modified來減少使用者重新訪問你網站時特定檔案重新下載的次數。