⑴ 已經啟用GZIP壓縮，但是GOOGLE提示沒有壓縮JS和CSS，這是神馬毛病！求高手指點謎徑
js、css要手動壓縮，gzip只是網頁輸出時的一種壓縮。
⑵ gzip壓縮實踐
為提高網頁載入速度，啟用 gzip 縮減資源的大小是非常常見的手段。現代瀏覽器均支持 gzip 壓縮，並會為HTTP請求自動協商此類壓縮。
本文將對 gzip 的實踐和原理做一個簡單的總結。
web伺服器在接收到瀏覽器的請求之後，會檢查瀏覽器可以接受哪些壓縮方法，詳情可見下圖。
瀏覽器在請求頭中會帶上 Accept-Encoding 這個參數來說明自己支持哪些內容編碼方式。
而服務端返回的 Response Headers 中則存在一個 Content-Encoding ，用來說明數據的壓縮方法。
幾乎所有的瀏覽器都已經支持了 gzip ，並且有請求頭的驗證，所以基本不需要擔心兼容相關的問題。
壓縮前後的體積前後差異，可以在控制台中看到。可以說，對於js、css文件的壓縮率還是比較可觀的。
經過這種方式的配置，在服務端響應請求的時候會對文件進行壓縮，之後返回壓縮過後的內容。不過壓縮這一過程多多少少會佔用一些服務端的性能，具體壓縮的程度，也就是 gzip_comp_level 設置的值也會影響到佔用性能的多少，接下來我們來看一些網上搜集到的數據，了解不同值的設置對文件大小和CPU佔用的影響。
可以看到，壓縮級別從0到1時，文件大小明顯減小，CPU消耗略微上漲。而在之後文件減小的速率明顯放緩，在達到了5之後繼續增加壓縮級別，文件的體積也幾乎沒有縮小，但CPU消耗卻有較為明顯的上漲。
根據結論可以看出，如果是在服務端使用 gzip 壓縮的話，考慮到性能和壓縮率的取捨，將壓縮級別設置為一個較低的值，比如2之類的，是比較合理的。
我們也可以選擇在打包構建項目的時候就對文件進行gzip壓縮
這邊以打包一個 webpack 的前端項目為例
運行構建命令後可以看到，在生成 .js 和 .css 的同時還生成了對應的 .gz 文件。
在這種方式的壓縮中，我們完全可以把壓縮等級設置為一個比較高的值(默認)，畢竟只是略微影響打包的時間，卻能獲取一個更小的體積的包，還是比較值得的。
以 nginx 為例，靜態壓縮需要使用 http_gzip_static_mole 這個模塊，這個模塊不是默認的，應使用 --with-http_gzip_static_mole 的配置參數啟用它
之後再配置中添加
這樣便可開啟靜態壓縮。
需要注意以下幾點：
⑶ 如何開啟gzip壓縮方法大全
IIS6.0啟用Gzip壓縮的方法：
1、新建Web服務擴展(如下圖)
dll路徑：「c:windowssystem32inetsrvgzip.dll」，然後啟用。
2、網站服務中開啟HTTP壓縮支持(如下圖)
臨時目錄需要給IIS用戶讀寫許可權。
3、修改IIS配置文件MetaBase.xml
文件路徑：「c:windowssystem32inetsrv」(請先備份至他處)，打開後搜索「HcDynamicCompressionLevel」，並修改(確定已備份)「Compression/deflate」和「Compression/gzip」兩個片段的內容。下面的圖n和圖b所修改的內容用意是將js、css和php加入到壓縮的范疇，數字9代表壓縮等級。
(圖n)
(圖b)
4、重啟IIS服務使之生效
——————————————————分分割割—————————————————
Apache啟用Gzip壓縮的方法：
1、開啟模塊並添加配置項目
a、vi /etc/httpd/conf/httpd.conf
b、查找LoadMole (/LoadMole)，加入「LoadMole deflate_mole moles/mod_deflate.so」這行
c、添加配置項目(下段內容)
復制代碼代碼如下:
<IfMole mod_deflate.c>
# 壓縮等級 9
DeflateCompressionLevel 9
# 壓縮類型 html、xml、php、css、js
SetOutputFilter DEFLATE
AddOutputFilterByType DEFLATE text/html text/plain text/xml application/x-javascript application/x-httpd-php
AddOutputFilter DEFLATE js css
</IfMole>
2、重啟apache使之生效
service httpd start
——————————————————分分割割—————————————————
檢測是否支持Gzip
END
注意事項
1. 在編輯MetaBase.xml前需要停止IIS，可以使用 net stop iisadmin
2. 修改完成後開啟iisadmin服務，並執行iisreset命令
關於SEO的測試
壓縮是否對SEO有影響，經測試，開啟後仍然可以被很好的收錄。
⑷ 用gzip對js文件和css文件進行壓縮，有誰做過，
你直接在伺服器端開啟頁面壓縮就好了啊，這樣傳到瀏覽器的數據時壓縮之後的數據
⑸ 手動壓縮js，css文件和gzip壓縮的區別
所謂的手動/自動壓縮js、css一般是將js的變數名變短，js和css的無關空格刪除等
gzip壓縮是將文件通過壓縮演算法進行的一種無損壓縮
舉個簡單的例子：
手動壓縮相當於把代碼用最精簡的方式寫出來（變數都用一個字母，去掉空格換行，一些寫法換成更短的等價寫法）
而gzip是相當於把文件打包成壓縮文件
⑹ 百度js和css合並壓縮是如何做的
簡單來說是通過插件實現，當然現在淘寶出的伺服器（nginx修改版）自帶有這個功能。 通過一個url地址里寫上每個js或者css 路徑，然後插件通過路徑將js/css 進行gzip形式壓縮，最後組合成一個文件輸出。你能看到的輸出格式是php後綴，但是輸出文件的表頭是js/CSS 這樣瀏覽器也就當是js/css來解析了。
合並代碼工具我推薦minify （PHP），這個比較早，也很簡單。
壓縮的話網上有很多地方都提供在線壓縮
簡單說說 JS壓縮：
1. 長變數變數名 壓縮為短變數名，去空格，去注釋
2. 可以將 new Array() 改寫為 []， new Object 改寫為{} 雲雲
3. 使用eval， 關鍵詞等等 的復雜邏輯 也可以壓縮
這樣處理過後，如果覺得還是太大了，還可以採用服務端的gzip壓縮傳輸
⑺ 如何用PHP實現頁面的GZIP壓縮輸出
第一步，你需要對php的設置如下：
php.ini： output_buffering = Off output_handler = ob_gzhandler zlib.output_compression = Off zlib.output_compression_level = -1
第二步，你需要在apache下增加如下設置：
AddOutputFilter DEFLATE html php js css
這樣就可以對html php js css進行gzip壓縮了。
第三步，你需要使用如下php壓縮html並輸出到客戶端的函數：
function compress_html($string) { return ltrim(rtrim(preg_replace(array("/> *([^ ]*) *</","//","'/\*[^*]*\*/'","/\r\n/","/\n/","/\t/",'/>[ ]+</'), array(">\\1<",'','','','','','><'),$string))); }
上面的這個正則表達式，很強大的哦，經過我本人親自測試可使用。
通過以上方法，你就可以將你的html代碼壓縮然後輸出給客戶端了。不信你可以查看源代碼，就是一行，網頁瞬間壓縮很小。
⑻ 將Js和CSS文件壓縮成min文件
個人建議從幾個方面入手：
1、在伺服器上啟用GZIP壓縮，添加css等靜態文件等。
2、把主頁、內容頁的CSS分開寫，公共部分單獨用一個CSS，這樣就可以減少CSS的大小。
3、優化CSS語法，並可以使用工具壓縮，但要注意用多個瀏覽器測試。
4、將一些JS調用盡量放到網頁底部
⑼ 如何壓縮網站里的css 和js文件 來減少空間的使用率，是網站打開速度加快
你好，個人建議從幾個方面入手：
1、在伺服器上啟用GZIP壓縮，添加css等靜態文件等。
2、把主頁、內容頁的CSS分開寫，公共部分單獨用一個CSS，這樣就可以減少CSS的大小。
3、優化CSS語法，並可以使用工具壓縮，但要注意用多個瀏覽器測試。
4、將一些JS調用盡量放到網頁底部
⑽ 如何對前端性能進行優化
前端開發代碼優化、可維護性、瀏覽器兼容性是非常重要的課題。從實際的工程應用角度出發，最常遇見的前端優化問題。前端性能進行優化規則，基本可以涵蓋現在前端大部分的性能優化原則了，很多更加geek和精細優化方法都是從這些原則裡面延伸出來的。
前端性能進行優化都有哪些規則
減少HTTP請求次數
盡量合並圖片、CSS、JS。比如載入一個頁面有5個css文件的話，把這個5個文件合成一個的話，就只需要發出一次http請求，節省網路請求時間，加快頁面的載入。
2. 使用CDN
網站上靜態資源即css、js全都使用cdn分發，包括圖片
3. 避免空的src和href
當link標簽的href屬性為空、script標簽的src屬性為空的時候，瀏覽器渲染的時候會把當前頁面的URL作為它們的屬性值，從而把頁面的內容載入進來作為它們的值。所以要避免犯這樣的疏忽。
4. 為文件頭指定Expires
Exipres是用來設置文件的過期時間的，一般對css、js、圖片資源有效。 他可以使內容具有緩存性，這樣下回再訪問同樣的資源時就通過瀏覽器緩存區讀取，不需要再發出http請求。如下例子：
新浪微博的這個css文件的Expires時間是2016-5-04 09:14:14.
5. 使用gzip壓縮內容
gzip能夠壓縮任何一個文本類型的響應，包括html，xml，json。大大縮小請求返回的數據量。
6. 把CSS放到頂部
網頁上的資源載入時從上網下順序載入的，所以css放在頁面的頂部能夠優先渲染頁面，讓用戶感覺頁面載入很快。
7. 把JS放到底部
載入js時會對後續的資源造成阻塞，必須得等js載入完才去載入後續的文件 ，所以就把js放在頁面底部最後載入。
8. 避免使用CSS表達式
舉個css表達式的例子
font-color: expression( (new Date()).getHours()%3 ? 「#FFFFFF" : 「#AAAAAA" );
這個表達式會持續的在頁面上計算樣式，影響頁面的性能。並且css表達式只被IE支持。
9. 將CSS和JS放到外部文件中
目的是緩存文件，可以參考原則4。 但有時候為了減少請求，也會直接寫到頁面里，需根據PV和IP的比例權衡。
10. 權衡DNS查找次數
減少主機名可以節省響應時間。但同時，需要注意，減少主機會減少頁面中並行下載的數量。
IE瀏覽器在同一時刻只能從同一域名下載兩個文件。當在一個頁面顯示多張圖片時，IE 用戶的圖片下載速度就會受到影響。所以新浪會搞N個二級域名來放圖片。
下面是新浪微博的圖片域名，我們可以看到他有多個域名，這樣可以保證這些不同域名能夠同時去下載圖片，而不用排隊。不過如果當使用的域名過多時，響應時間就會慢，因為不用響應域名時間不一致。
11. 精簡CSS和JS
這里就涉及到css和js的壓縮了。比如下面的新浪的一個css文件，把空格回車全部去掉，減少文件的大小。現在的壓縮工具有很多，基本主流的前端構建工具都能進行css和js文件的壓縮，如grunt，glup等。
12. 避免跳轉
有種現象會比較坑爹，看起來沒什麼差別，其實多次了一次頁面跳轉。比如當URL本該有斜杠（/）卻被忽略掉時。例如，當我們要訪問http:// .com時，實際上返回的是一個包含301代碼的跳轉，它指向的是http:// .com/（注意末尾的斜杠）。在nginx伺服器可以使用rewrite；Apache伺服器中可以使用Alias 或者 mod_rewrite或者the DirectorySlash來避免。
另一種是不用域名之間的跳轉， 比如訪問http:// .com/bbs跳轉到http:// bbs..com/。那麼可以通過使用Alias或者mod_rewirte建立CNAME（保存一個域名和另外一個域名之間關系的DNS記錄）來替代。
13. 刪除重復的JS和CSS
重復調用腳本，除了增加額外的HTTP請求外，多次運算也會浪費時間。在IE和Firefox中不管腳本是否可緩存，它們都存在重復運算JavaScript的問題。
14. 配置ETags
它用來判斷瀏覽器緩存里的元素是否和原來伺服器上的一致。比last-modified date更具有彈性，例如某個文件在1秒內修改了10次，Etag可以綜合Inode(文件的索引節點(inode)數)，MTime(修改時間)和Size來精準的進行判斷，避開UNIX記錄MTime只能精確到秒的問題。 伺服器集群使用，可取後兩個參數。使用ETags減少Web應用帶寬和負載
15. 可緩存的AJAX
非同步請求同樣的造成用戶等待，所以使用ajax請求時，要主動告訴瀏覽器如果該請求有緩存就去請求緩存內容。如下代碼片段, cache:true就是顯式的要求如果當前請求有緩存的話，直接使用緩存
$.ajax({ url : 'url', dataType : "json", cache: true, success : function(son, status){ }
16. 使用GET來完成AJAX請求
當使用XMLHttpRequest時，瀏覽器中的POST方法是一個「兩步走」的過程：首先發送文件頭，然後才發送數據。因此使用GET獲取數據時更加有意義。
17. 減少DOM元素數量
這是一門大學問，這里可以引申出一堆優化的細節。想要具體研究的可以看後面推薦書籍。總之大原則減少DOM數量，就會減少瀏覽器的解析負擔。
18. 避免404
比如外鏈的css、js文件出現問題返回404時，會破壞瀏覽器的並行載入。
19. 減少Cookie的大小
Cookie裡面別塞那麼多東西，因為每個請求都得帶著他跑。
20. 使用無cookie的域
比如CSS、js、圖片等，客戶端請求靜態文件的時候，減少了 Cookie 的反復傳輸對主域名的影響。
21. 不要使用濾鏡
IE獨有屬性AlphaImageLoader用於修正7.0以下版本中顯示PNG圖片的半透明效果。這個濾鏡的問題在於瀏覽器載入圖片時它會終止內容的呈現並且凍結瀏覽器。在每一個元素（不僅僅是圖片）它都會運算一次，增加了內存開支，因此它的問題是多方面的。
完全避免使用AlphaImageLoader的最好方法就是使用PNG8格式來代替，這種格式能在IE中很好地工作。如果你確實需要使用AlphaImageLoader，請使用下劃線_filter又使之對IE7以上版本的用戶無效。
22. 不要在HTML中縮放圖片
比如你需要的圖片尺寸是50* 50
那就不用用一張500*500的大尺寸圖片，影響載入
23. 縮小favicon.ico並緩存