轉自:
Saturn's Weblog
一些泛WEB 2.0網站為了追求用戶體驗,可能會大量使用CSS和JS文件。這就導致在服務器帶寬一定的情況下,多用戶并發訪問速度變慢。如何加快網頁響應速度?解決辦法之一就是:依照 Yahoo性能優化小組提出的N條性能優化建議 對前端程序進行優化和重構,關于此文的討論很多,在這里不再贅述。 這篇文章主要分享一下我個人在實際項目中,對于 使用PHP對JS和CSS進行壓縮的經驗 ,在這里假設服務器 僅支持GZIP壓縮 ,不支持.htaccess(符合很多站長的租用的虛擬主機實際情況)。 首先說說對CSS和JS文件進行性能優化的幾個小技巧:
這里提到的方法對系統來說是無侵入式的,也就是說不管你的程序是新編寫的,還是已經上線了很久,均適用。 先看我對 圖標吾愛 進行優化的實例截圖(YSlow):
在這個例子中,我分別對服務器輸出的HTML文檔、JS文檔和CSS文檔使用了GZIP壓縮,可以看到壓縮效果非常明顯,文件體積減小了70%以上。頁面加載速度明顯加快。 實際上,用PHP使用GZIP壓縮非常簡單,其核心是使用ob_gzhandler,不過需要注意的一點是,并不是所有瀏覽器都支持GZIP傳送到客戶端的數據,所以要進行一定的容錯處理。 下面是使用PHP通過GZIP壓縮CSS的實例。 在存放CSS的文件夾中新建一個style.php文件,在此文件中加入以下代碼:
如果你處理的是JavaScript文件,你需要將上面代碼中的第5行的Content-type修改成以下: ? header ("content-type:application/x-javascript; charset: gb2312"); 同樣需要注意的是文件的編碼,這里我用的是gb2312,如果你采用的是UTF-8或其他編碼,修改成對應的即可。 修改完成之后,在原引入CSS和JS文件的地方,將.css后綴/.js后綴的文件更換成這個style.php文件即可,如: < script type = "text/javascript" src =" http://www.icon52.net/scripts/autoSuggest.js. php ?v=121 " > Live Demo請使用Firefox,并安裝YSlow插件查看 圖標吾愛 這個網站。 2009-8-30 Update: 由于上面代碼中使用到了HTTP的Expires(過期)屬性用于在客戶端緩存CSS/JS代碼,所以,如果過期時間設置的太長(比如2020 年),當你在服務器端修改了JS/CSS代碼時,客戶端可能不會立即生效。解決辦法是:在php文件后面添加一個隨機參數,如上面例子中的 v=121 ,當下次修改了文件時,記得相應修改此隨機參數即可。 |
更多文章、技術交流、商務合作、聯系博主
微信掃碼或搜索:z360901061

微信掃一掃加我為好友
QQ號聯系: 360901061
您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點擊下面給點支持吧,站長非常感激您!手機微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點擊微信右上角掃一掃功能,選擇支付二維碼完成支付。
【本文對您有幫助就好】元
