「seo后臺優化」程序從那些方面配合SEO的行動?

  • 發布時間:2019-05-12 18:22 | 作者: | 來源: | 瀏覽:1200 次
  •       【seo后臺優化】程序從那些方面配合SEO的行動?
      瀏覽器訪問優化

      瀏覽器請求處理流程如下

      1、減少http請求,合理設置 HTTP緩存

      http協議是無狀態的應用層協議,意味著每次http請求都需要建立通信鏈路、進行數據傳輸,而在服務器端,每個http都需要啟動獨立的線程去處理。這些通信和服務的開銷都很昂貴,減少http請求的數目可有效提高訪問性能。

      【seo后臺優化】程序從那些方面配合SEO的行動?

    timg.jpg

     

      減少http的主要手段是合并CSS、合并javascript、合并圖片。將瀏覽器一次訪問需要的javascript和CSS合并成一個文件,這樣瀏覽器就只需要一次請求。圖片也可以合并,多張圖片合并成一張,如果每張圖片都有不同的超鏈接,可通過CSS偏移響應鼠標點擊操作,構造不同的URL。

      緩存的力量是強大的,恰當的緩存設置可以大大的減少 HTTP請求。假設某網站首頁,當瀏覽器沒有緩存的時候訪問一共會發出 78個請求,共 600多 K數據,而當第二次訪問即瀏覽器已緩存之后訪問則僅有 10個請求,共 20多 K數據。 (這里需要說明的是,如果直接 F5刷新頁面的話效果是不一樣的,這種情況下請求數還是一樣,不過被緩存資源的請求服務器是 304響應,只有 Header沒有Body ,可以節省帶寬 )

      怎樣才算合理設置 ?原則很簡單,能緩存越多越好,能緩存越久越好。例如,很少變化的圖片資源可以直接通過HTTP Header中的Expires設置一個很長的過期頭 ;變化不頻繁而又可能會變的資源可以使用 Last-Modifed來做請求驗證。盡可能的讓資源能夠在緩存中待得更久。關于 HTTP緩存的具體設置和原理此處就不再詳述了。

      2、使用瀏覽器緩存

      對一個網站而言,CSS、javascript、logo、圖標這些靜態資源文件更新的頻率都比較低,而這些文件又幾乎是每次http請求都需要的,如果將這些文件緩存在瀏覽器中,可以極好的改善性能。通過設置http頭中的cache-control和expires的屬性,可設定瀏覽器緩存,緩存時間可以是數天,甚至是幾個月。

      在某些時候,靜態資源文件變化需要及時應用到客戶端瀏覽器,這種情況,可通過改變文件名實現,即更新javascript文件并不是更新javascript文件內容,而是生成一個新的JS文件并更新HTML文件中的引用。

      使用瀏覽器緩存策略的網站在更新靜態資源時,應采用逐量更新的方法,比如需要更新10個圖標文件,不宜把10個文件一次全部更新,而是應該一個文件一個文件逐步更新,并有一定的間隔時間,以免用戶瀏覽器忽然大量緩存失效,集中更新緩存,造成服務器負載驟增、網絡堵塞的情況。

      3、啟用壓縮

      在服務器端對文件進行壓縮,在瀏覽器端對文件解壓縮,可有效減少通信傳輸的數據量。如果可以的話,盡可能的將外部的腳本、樣式進行合并,多個合為一個。文本文件的壓縮效率可達到80%以上,因此HTML、CSS、javascript文件啟用GZip壓縮可達到較好的效果。但是壓縮對服務器和瀏覽器產生一定的壓力,在通信帶寬良好,而服務器資源不足的情況下要權衡考慮。

      4、 CSS Sprites

      合并 CSS圖片,減少請求數的又一個好辦法。

      5、Lazy Load Images(自己對這一塊的內容還是不了解)

      這條策略實際上并不一定能減少 HTTP請求數,但是卻能在某些條件下或者頁面剛加載時減少 HTTP請求數。對于圖片而言,在頁面剛加載的時候可以只加載第一屏,當用戶繼續往后滾屏的時候才加載后續的圖片。這樣一來,假如用戶只對第一屏的內容感興趣時,那剩余的圖片請求就都節省了。

      6、CSS放在頁面最上部,javascript放在頁面最下面

      瀏覽器會在下載完成全部CSS之后才對整個頁面進行渲染,因此最好的做法是將CSS放在頁面最上面,讓瀏覽器盡快下載CSS。如果將 CSS放在其他地方比如 BODY中,則瀏覽器有可能還未下載和解析到 CSS就已經開始渲染頁面了,這就導致頁面由無 CSS狀態跳轉到 CSS狀態,用戶體驗比較糟糕,所以可以考慮將CSS放在HEAD中。

      Javascript則相反,瀏覽器在加載javascript后立即執行,有可能會阻塞整個頁面,造成頁面顯示緩慢,因此javascript最好放在頁面最下面。但如果頁面解析時就需要用到javascript,這時放到底部就不合適了。

      Lazy Load Javascript(只有在需要加載的時候加載,在一般情況下并不加載信息內容。)隨著 Javascript框架的流行,越來越多的站點也使用起了框架。不過,一個框架往往包括了很多的功能實現,這些功能并不是每一個頁面都需要的,如果下載了不需要的腳本則算得上是一種資源浪費 -既浪費了帶寬又浪費了執行花費的時間。目前的做法大概有兩種,一種是為那些流量特別大的頁面專門定制一個專用的 mini版框架,另一種則是 Lazy Load。

      7、異步請求 Callback(就是將一些行為樣式提取出來,慢慢的加載信息的內容)

      8、減少cookie傳輸

      一方面,cookie包含在每次請求和響應中,太大的cookie會嚴重影響數據傳輸,因此哪些數據需要寫入cookie需要慎重考慮,盡量減少cookie中傳輸的數據量。另一方面,對于某些靜態資源的訪問,如CSS、script等,發送cookie沒有意義,可以考慮靜態資源使用獨立域名訪問,避免請求靜態資源時發送cookie,減少cookie傳輸次數。

      9、Javascript代碼優化

      (1). DOM

      a. HTML Collection(HTML收集器,返回的是一個數組內容信息)

      在腳本中 document.images、document.forms 、getElementsByTagName()返回的都是 HTMLCollection類型的集合,在平時使用的時候大多將它作為數組來使用,因為它有 length屬性,也可以使用索引訪問每一個元素。不過在訪問性能上則比數組要差很多,原因是這個集合并不是一個靜態的結果,它表示的僅僅是一個特定的查詢,每次訪問該集合時都會重新執行這個查詢從而更新查詢結果。所謂的 “訪問集合” 包括讀取集合的 length屬性、訪問集合中的元素。

      因此,當你需要遍歷 HTML Collection的時候,盡量將它轉為數組后再訪問,以提高性能。即使不轉換為數組,也請盡可能少的訪問它,例如在遍歷的時候可以將 length屬性、成員保存到局部變量后再使用局部變量。

      b. Reflow & Repaint

      除了上面一點之外, DOM操作還需要考慮瀏覽器的 Reflow和Repaint ,因為這些都是需要消耗資源的。

      (2). 慎用 with

      with(obj){ p = 1}; 代碼塊的行為實際上是修改了代碼塊中的 執行環境 ,將obj放在了其作用域鏈的最前端,在 with代碼塊中訪問非局部變量是都是先從 obj上開始查找,如果沒有再依次按作用域鏈向上查找,因此使用 with相當于增加了作用域鏈長度。而每次查找作用域鏈都是要消耗時間的,過長的作用域鏈會導致查找性能下降。

      因此,除非你能肯定在 with代碼中只訪問 obj中的屬性,否則慎用 with,替代的可以使用局部變量緩存需要訪問的屬性。

      (3). 避免使用 eval和 Function

      每次 eval 或 Function 構造函數作用于字符串表示的源代碼時,腳本引擎都需要將源代碼轉換成可執行代碼。這是很消耗資源的操作 —— 通常比簡單的函數調用慢 100倍以上。

      eval 函數效率特別低,由于事先無法知曉傳給 eval 的字符串中的內容,eval在其上下文中解釋要處理的代碼,也就是說編譯器無法優化上下文,因此只能有瀏覽器在運行時解釋代碼。這對性能影響很大。

      Function 構造函數比 eval略好,因為使用此代碼不會影響周圍代碼 ;但其速度仍很慢。

      此外,使用 eval和 Function也不利于Javascript 壓縮工具執行壓縮。

      (4). 減少作用域鏈查找

      前文談到了作用域鏈查找問題,這一點在循環中是尤其需要注意的問題。如果在循環中需要訪問非本作用域下的變量時請在遍歷之前用局部變量緩存該變量,并在遍歷結束后再重寫那個變量,這一點對全局變量尤其重要,因為全局變量處于作用域鏈的最頂端,訪問時的查找次數是最多的。

      在函數中只需要將 globalVar中內容的值賦給localVar 中

      此外,要減少作用域鏈查找還應該減少閉包的使用。

      (5). 數據訪問

      Javascript中的數據訪問包括直接量 (字符串、正則表達式 )、變量、對象屬性以及數組,其中對直接量和局部變量的訪問是最快的,對對象屬性以及數組的訪問需要更大的開銷。當出現以下情況時,建議將數據放入局部變量:

      a. 對任何對象屬性的訪問超過 1次

      b. 對任何數組成員的訪問次數超過 1次

      另外,還應當盡可能的減少對對象以及數組深度查找。

      (6). 字符串拼接

      在 Javascript中使用”+” 號來拼接字符串效率是比較低的,因為每次運行都會開辟新的內存并生成新的字符串變量,然后將拼接結果賦值給新變量。與之相比更為高效的做法是使用數組的 join方法,即將需要拼接的字符串放在數組中最后調用其 join方法得到結果。不過由于使用數組也有一定的開銷,因此當需要拼接的字符串較多的時候可以考慮用此方法。

      10、CSS選擇符優化

      在大多數人的觀念中,都覺得瀏覽器對 CSS選擇符的解析式從左往右進行的,例如

      #toc A { color: #444; }這樣一個選擇符,如果是從右往左解析則效率會很高,因為第一個 ID選擇基本上就把查找的范圍限定了,但實際上瀏覽器對選擇符的解析是從右往左進行的。如上面的選擇符,瀏覽器必須遍歷查找每一個 A標簽的祖先節點,效率并不像之前想象的那樣高。根據瀏覽器的這一行為特點,在寫選擇符的時候需要注意很多事項,有興趣的童鞋可以去了解一下。

      CDN加速

      CDN(content distribute network,內容分發網絡)的本質仍然是一個緩存,而且將數據緩存在離用戶最近的地方,使用戶以最快速度獲取數據,即所謂網絡訪問第一跳,反向代理 ,如下圖。

      2

      傳統代理服務器位于瀏覽器一側,代理瀏覽器將http請求發送到互聯網上,而反向代理服務器位于網站機房一側,代理網站web服務器接收http請求。如下圖所示:

      3

      網站安全的作用,來自互聯網的訪問請求必須經過代理服務器,相當于web服務器和可能的網絡攻擊之間建立了一個屏障。

      除了安全功能代理服務器也可以通過配置緩存功能加速web請求。當用戶第一次訪問靜態內容的時候,靜態內容就被緩存在反向代理服務器上,這樣當其他用戶訪問該靜態內容的時候,就可以直接從反向代理服務器返回,加速web請求響應速度,減輕web服務器負載壓力。事實上,有些網站會把動態內容也緩存在代理服務器上,比如維基百科及某些博客論壇網站,把熱門詞條、帖子、博客緩存在反向代理服務器上加速用戶訪問速度,當這些動態內容有變化時,通過內部通知機制通知反向代理緩存失效,反向代理會重新加載最新的動態內容再次緩存起來。

  • (本文"「seo后臺優化」程序從那些方面配合SEO的行動?"的責任編輯:SEO優化)
  • 相關內容
  • 2010-2013 版權所有 樓主SEO
  • 『樓主SEO』致力于最新SEO技術,分享各種SEO優化干貨,專注為中小企業提供網站SEO優化顧問、網絡營銷推廣服務。優化網站關鍵詞排名請加qq:3052979547

15361814538


信用卡

99公關

北京公關

廣州公關

深圳負面

上海負面

紅警公關

一本道高清无码AV