<em id="l4gxk"><noframes id="l4gxk">

<em id="l4gxk"></em>
      
      

         手機版 微信公眾號 新浪微博 友情鏈接
        當前位置: 網站首頁 > 建站設計 > 設計文章 > 文章 當前位置: 設計文章 > 文章

        大型網站:前端性能優化和規范

        時間:2013-11-13    點擊: 次    來源:網絡    作者:佚名 - 小 + 大

        (文/scott )Web性能涉及的范圍太廣,但一般web開發者在程序上線以后很多都曾遇到過性能的問題。普遍表現為頁面速度開始急劇變慢,正常訪問時間變的很長,或則干脆給你拋出異常錯誤頁面。這里會涉及到很多可能發生的情況,舉例幾個最主要發生的情況:

         * 數據庫連接超過最大限制,一般表現為程序的連接池滿,拒絕了與數據庫的連接。
         * 數據庫死鎖
         * Web Server 超過最大連接數(一般在虛擬主機上才會限制)
         * 內存泄漏
         * Http連接數太多,即訪問量超過了機器和軟件設計正常所能提供的服務 
         
        而今天分享的主要是比較偏向前端

        瀏覽器請求和響應的過程

        瀏覽器請求加載前過程
         

        第一步、瀏覽器預處理

        查詢Cache:讀取Cache 或者發送304請求

        第二步、查詢DNS

        優化規則--減少DNS查找

        DNS緩存

        瀏覽器DNS緩存 計算機DNS緩存 服務器DNS緩存(TTL)

        使用Keep-Alive特性 
        減少DNS查找

        當客戶端的DNS緩存為空時,DNS查找的數量與Web頁面中唯一主機名的數量相等。減少唯一主機名的數量就可以減少DNS查找的數量。

        較少的域名來減少DNS查找(2-4個主機)

        第三步、建立連接

        優化規則-- 使用內容分發網絡

        美國十大Internet網站和CDN服務提供商

        頁面靜態化,取決于發布系統

        Ctrip使用的China-Cache和網宿

        優化規則--用域名劃分頁面內容 

        按頁面內容劃分域名,在合適的資源服務器上存放文件

        第四步、發送請求

        優化規則-- 減少HTTP請求

         HTTP請求30-40,合并文件,圖片地圖,內聯圖像

        a)js文件(不超過7個)

        1.tuna_090501_base.js和tuna_090501_module.js(拆分tuna_090501.js)
        2.數據文件js(1-2個)
        3.頻道公用js(1個)和頁面私有js(1-2個)

        不含ga.js、uiscript.asp和外鏈其他網站的js

        b) css文件不超過4個,各頻道首頁和全站首頁不超過3個。

        c) 目前無法解決的是allyes廣告的請求數。

        • 大量的廣告和產品圖片可能會造成,圖片請求數很大,可能造成總請求數指標吃緊,

            這個只能從設計上搞定,需要權衡

        • 目前老頁面可能css和js文件請求數可能會超標

         

        優化規則- – 優化CSS Spirite

          圖片地圖   Ctrip首頁例子 

        優化規則– 避免404錯誤

        避免內部無效的鏈接
         

        規則優化 –不要使用frameset,少使用iframe

        搜索引擎不友好、 

        即時內容為空,加載也需要時間、會阻止頁面加載

        禁止使用iframe引入外部資源,不包括allyes廣告,不包括about:blank的空頁面。
         

        第五步、等待響應

        優化規則 --避免重定向

        在重定向完畢并且HTML下載完畢之前,是沒有任何東西顯示給用戶的
        涉及服務器負載、數據查詢、服務器端緩存等
         

        第七步、接收數據

        優化規則 -- 壓縮組件

        HTML文檔、腳本和樣式表、XML和JSON的文本響應 壓縮如何工作
        壓縮通常能將響應的數據量減少將近70%

        優化規則 -- 精簡Javascript和Css

        從代碼中移除不必要的字符以減少其大小,減少加載時間。

        規則規則– 盡量縮減頁面大小

        頁面必須小于150K(不含圖片)
        a) 靜態文件是否gzip
        b) 圖片是否壓縮優化過

        第八步、讀取Cache

        優化規則-- 添加Expire或Cache-Control

        應用于不經常變化的組件,包括腳本、樣式表、Flash組件、圖片
        Expires和Cache-Control

        規則規則 -- 使用外部的Js和Css文件

        盡可能使用外部Js和Css,因為我們目前大部分Js和Css都做了Gzip和緩存技術,可以充分利用。

        第九步、處理元素

        不要對image和pdf等二進制文件進行gzip壓縮

         第十步、渲染元素

        優化規則 -- 將樣式表放在頂部

         界面原型頁面必須將樣式表置于頁面頂部,開發人員如無特殊原因也必須將樣式表置于頂部。 

        以往多數是因為masterpage原因無法將所有樣式表置頂,在改版修改masterpage時,盡可能按照此原則進行設計。 

        優化規則 – 建議將腳本放在底部

         一般瀏覽器可以允許并行下載,取決于主機個數、帶寬等

        (默認情況下,IE是2個而FF是8個)

        下載腳本時并行下載實際上是被禁用的。
         

        優化規則-- 移除重復腳本

         必須為0 

        優化規則 -- 避免CSS表達式

        影響瀏覽器渲染時間

        優化規則 – 優化圖像

        盡量使用GIF和PNG

        盡量使用png/gif格式的圖片,png的圖片優先,但是必須注意如要兼容IE6,則png使用一定要注意透明問題。

        圖片在上次前一定要先用工具壓縮優化(png、jpg)

         Javascript開發規范

        大型的項目在前端 JS 方面有幾個需要達成的目標: 

        1. 代碼邏輯分層
        2. 避免全局變量
        3. 便于多人協作開發
        4. 各部分代碼模塊化,可以按需加載
        5. 保持全局變量的清潔
        6. 可進行單元測試

        上一篇:Godaddy主機快速安裝Zen Cart程序建立網站教程

        下一篇:謹防網絡支付常見七大騙局

         推薦閱讀
      1. Copyright © 2009—2025 ,www.julong-ads.com,All Rights Reserved. |  黔ICP備2023009491號-1  |  貴公網安備52010302003427號
      2. 關于本站  |  網站聲明  |  網站導航  |  留言交流  |  友情鏈接  |  祝福頻道  |  微信公眾號  |  新浪微博  |  我的大學  |  我的高中  |  簡歷2009
      3. 版權聲明:凡注明本站原創文章、作品,未經本人許可,任何人或機構不得以任何形式對本站內容進行復制作商業用途.
      4. 本站部分文章、資源來自互聯網,版權歸原作者及網站所有,如果侵犯了您的權利,請及時致信告知我站.
      5. 地址:中國·貴州·貴陽  郵編:550018   微信公眾號:WEBZZQ  郵箱:admin@zouzhiqiang.com
      6. QQ:470870191 歡迎各位站長加入個人網站交流討論QQ群: 15410235
      7. 訪問統計:
      8. 亚洲国产高清精品线久久 | 免费精品久久天干天干| 久久人人爽人人爽人人片AV东京热 | 国产综合免费精品久久久| 亚洲国产精品成人AV无码久久综合影院 | 狼狼综合久久久久综合网| 久久99精品综合国产首页| 久久青青草原精品国产不卡| 狠狠色综合网站久久久久久久高清| 国产三级久久久精品麻豆三级| 国产伊人久久| 麻豆AV一区二区三区久久| 久久久综合香蕉尹人综合网| 无码人妻久久一区二区三区| 色欲久久久天天天综合网精品| 国产精品久久久久久影院| 久久精品国产WWW456C0M| 久久国产精品无码一区二区三区 | 久久精品中文闷骚内射| 久久久精品人妻无码专区不卡| 天天爽天天狠久久久综合麻豆| 久久久久亚洲AV成人网人人网站| 久久这里只有精品18| 奇米影视7777久久精品人人爽| 精品午夜久久福利大片| 少妇内射兰兰久久| 中文字幕久久精品 | 久久久久亚洲?V成人无码| 久久国产亚洲高清观看| 国内精品人妻无码久久久影院导航| 久久伊人精品青青草原日本| 国产日产久久高清欧美一区| 人人狠狠综合久久88成人| 久久大香萑太香蕉av| 日韩欧美亚洲综合久久影院Ds| 久久综合欧美成人| 99久久夜色精品国产网站| 国产精品99久久久久久人| 久久精品国产半推半就| 免费观看成人久久网免费观看| 久久精品人人做人人爽电影|