1、如何防止js和css緩存
解決辦法一:每次修改js或css文件後,都要手工修改那個版本號,注意:是每修改一次(哪怕僅僅是改了一個字元)都要修改版本號;
解決辦法二:如果嫌手工修改太麻煩,那可以通過程序來自動修改(用隨機數做版本號)。如果你的網站是動態的,那可以通過後台程序來改,比如ASP的:
<link rel="stylesheet" href="static/mimi/css/main.css?v=<%=rnd()%>" type="text/css"/>
PHP的:
<link rel="stylesheet" href="static/mimi/css/main.css?v=<?php echo mt_rand(); ?>" type="text/css"/>
如果是靜態網站那就要js腳本來實現了,這個稍微麻煩點,這里就不說了。
其實上述方法一和方法二的目的都是為了使每次打開的js或css的url不同,這樣瀏覽器就不會去緩存區取數據,而是直接到網站下載。
如果上述方法仍然無效,那就是你的瀏覽器的緩存機制存在問題,比如「從不檢查網頁的新版本,除非手動刷新」,這個就要你自己去設置了。
2、如何給html網頁設置緩存
在Apache環境下,可以通過在.htaccess文件中添加下面的代碼,設置圖片的HTTP緩存和有效期(需要開啟apache的headers模塊支持):
# Image and Flash content Caching for ONE Year blog.gimhoy.com<FilesMatch ".(flv|gif|jpg|jpeg|png|ico|swf)$"> Header set Cache-Control "max-age=3156000"
其中max-age後面這個數字就是設置的緩存有效期(以秒為單位),比如上面的代碼設置了網站的圖片使用為期一年(3156000秒)的HTTP緩存。
在Nginx下,可以通過修改nginx.conf配置文件,來修改緩存設置:
location ~* \.(flv|gif|jpg|jpeg|png|ico|swf)$ { expires 1y; access_log off; break; }
同樣的方法,你也可以給js和css文件設置緩存。
3、如何通過優化JS代碼來適合網站優化
一、 讓代碼簡潔:一些簡略的表達方式也會產生很好的優化
eg:x=x+1;在不影響功能的情況下可以簡寫為x++;
二、 變數名方法名盡量在不影響語意的情況下簡單。(可以選擇首字母命名)
eg:定義數組的長度可以取名為:ArrLen而不需要取為ArrayLength。
三、 關於JS的循環,循環是一種常用的流程式控制制。
JS提供了三種循環:for(;;)、while()、for(in)。在這三種循環中for(in)的效率最差,因為它需要查詢Hash鍵,因此應盡量少用for(in)循環,for(;;)、while()循環的性能基本持平。當然,推薦使用for循環,如果循環變數遞增或遞減,不要單獨對循環變數賦值,而應該使用嵌套的++或–運算符。
四、 如果需要遍歷數組,應該先緩存數組長度,將數組長度放入局部變數中,避免多次查詢數組長度。
因為我們常常要根據字元串、數組的長度進行循環,而通常這個長度是不變的,比如每次查詢a.length,就要額外進行一個操作,而預先把var len=a.length,則就少了一次查詢。
五、 盡量選用局部變數而不是全局變數。
局部變數的訪問速度要比全局變數的訪問速度更快,因為全局變數其實是window對象的成員,而局部變數是放在函數的棧里的。
六、 盡量少使用eval。
每次使用eval需要消耗大量時間,這時候使用JS所支持的閉包可以實現函數模板。
七、 減少對象查找
因為JavaScript的解釋性,所以a.b.c.d.e,需要進行至少4次查詢操作,先檢查a再檢查a中的b,再檢查b中的c,如此往下。所以如果這樣的表達式重復出現,只要可能,應該盡量少出現這樣的表達式,可以利用局部變數,把它放入一個臨時的地方進行查詢。
八、 字元串連接。
如果是追加字元串,最好使用s+=anotherStr操作,而不是要使用s=s+anotherStr。
如果要連接多個字元串,應該少使用+=,如s+=a;s+=b;s+=c;應該寫成s+=a + b + c;
而如果是收集字元串,比如多次對同一個字元串進行+=操作的話,最好使用一個緩存。怎麼用呢?使用JavaScript數組來收集,最後使用join方法連接起來,如下
var buf = new Array();for(var i = 0; i < 100; i++){ buf.push(i.toString());}var all = buf.join("");
九、 類型轉換
1. 把數字轉換成字元串,應用"" + 1,雖然看起來比較丑一點,但事實上這個效率是最高的,性能上來說:("" +) > String() > .toString() > new String()
盡量使用編譯時就能使用的內部操作要比運行時使用的用戶操作要快。
String()屬於內部函數,所以速度很快,而.toString()要查詢原型中的函數,所以速度遜色一些,new String()用於返回一個精確的副本。
2. 浮點數轉換成整型,這個更容易出錯,很多人喜歡使用parseInt(),其實parseInt()是用於將字元串轉換成數字,而不是浮點數和整型之間的轉換,我們應該使用Math.floor()或者Math.round()。Math是內部對象,所以Math.floor()其實並沒有多少查詢方法和調用的時間,速度是最快的。
3. 對於自定義的對象,如果定義了toString()方法來進行類型轉換的話,推薦顯式調用toString(),因為內部的操作在嘗試所有可能性之後,會嘗試對象的toString()方法嘗試能否轉化為String,所以直接調用這個方法效率會更高
十、 盡量作用JSON格式來創建對象,而不是var obj=new Object()方法。
因為前者是直接復制,而後者需要調用構造器,因而前者的性能更好。
十一、 當需要使用數組時,也盡量使用JSON格式的語法,
使用JSON格式的語法即直接使用如下語法定義數組:[parrm,param,param...],而不是採用new Array(parrm,param,param...)這種語法。因為使用JSON格式的語法是引擎直接解釋的。而後者則需要調用Array的構造器。
十二、 對字元串進行循環操作,例如替換、查找,就使用正則表達式。
因為JS的循環速度比較慢,而正則表達式的操作是用C寫成的API,性能比較好。
十三、 插入HTML
很多人喜歡在JavaScript中使用document.write來給頁面生成內容。事實上這樣的效率較低,如果需要直接插入HTML,可以找一個容器元素,比如指定一個div或者span,並設置他們的innerHTML來將自己的HTML代碼插入到頁面中。
十四、 對象查詢
使用[「」]查詢要比.items()更快
十五、 定時器
如果針對的是不斷運行的代碼,不應該使用setTimeout,而應該是用setInterval。setTimeout每次要重新設置一個定時器。
十六、 盡量減少DOM調用
在Web開發中,JavaScript的一個很重要的作用就是對DOM進行操作。可是對DOM的操作是非常昂貴的,因為這會導致瀏覽器執行迴流 (reflow)操作。我們應該盡可能的減少DOM操作。
4、靜態網站如何防止CSS JS緩存
沒寫過靜態網站,都是動態的。你可以在進入頁面的時候自動刷新頁面嗎
5、如何讓html頁面不緩存,js永久緩存
當瀏覽不同Url時,瀏覽器會自動將當前訪問的地址進行一次緩存;而第二次訪問時著調用緩存下來的頁面,從而達到頁面快速載入(頁面載入優化)的目的;
因此,我們可以給頁面後面設定個不同的值,讓頁面保持沒錯訪問的不同即可達到不緩存的目的了!
下面是個簡單的示例:
復制代碼 代碼如下:
<script>
document.write("<script type='text/javascript' src='/js/test.js?"+Math.random();+"'></script>");
</script>
其他的類似,只需在地址後加上+Math.random()
注意:因為Math.random() 只能在Javascript 下起作用,故只能通過Javascript的調用才可以
最後加一個ajax也不讓緩存的方法
復制代碼 代碼如下:
xmlHttp.open("GET", "ajax.asp?now=" + new Date().getTime(), true);
記得後面的now=" + new Date().getTime()是重點,需要帶參數的。
希望本文所述對大家的javascript程序設計有所幫助。
以上是雲棲社區小編為您精心准備的的內容,在雲棲社區的博客、問答、公眾號、人物、課程等欄目也有的相關內容,歡迎繼續使用右上角搜索按鈕進行搜索js , html , 頁面 不緩存 javascript 緩存、javascript 清除緩存、javascript緩存數據、javascript 本地緩存、javascript 緩存機制,以便於您獲取更多的相關知識。
6、Web性能優化中,有一個利用ajax緩存。請問這個緩存具體如何操作?
加入本地存儲的邏輯也可以。例如存入LocalStorage,維持一個時間戳。過期時再去請求新數據。
方法一:針對瀏覽器設置過期時間,在這個時間內的請求都會先請求本地緩存的文件和數據。另外jquery的ajax請求方式可以設置是否緩存,可以充分利用該選項。
方法二:js請求限制,可以設計成多少秒以內都不響應響應的操作,過期後的操作才會有效。點擊後僅返回一個模擬的結果。
方法三:ajax做dom緩存策略,比如在頁面放一個不可見的textarea,請求過來的數據同時寫入textarea的value,並且在一定時間內(可設置)的請求只去讀取textarea的內容,並將結果展示到頁面上。
7、在web優化中,有一條是常用的js腳本,css樣式,常用圖片把他緩存起來?圖片的文件名不都是隨機的嗎?如何緩存?
目前緩存都藉助雲抄存儲,你可以把襲常用的JS和CSS 上傳到類似七牛。UPYUN 這上面去。一般來說。如果你不是手機端的話,我建議你不用緩存,作用不大~訪問的話,可以在其URL加上後綴。。圖片可以直接利用插件上傳到這兩個雲存儲上
8、js獲取網站的緩存
手機版本的都支持html5;可以用localStorage.setItem('nowPage',222);這種方式存儲下來,下次打開首先localStorage.getItem('nowPage'),如果是undefined,則沒有看過,默認從第一頁看起,如果有就從當前頁看起,望採納!
9、js如何解決頁面緩存
你可以再html頁面禁止緩存的啊,比如在html頁面加上標簽
<META HTTP-EQUIV="pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-store, must-revalidate">
<META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
<META HTTP-EQUIV="expires" CONTENT="0">
等這四個都是可以的
具體的可以再百度上找到
10、web前端怎麼用代碼實現緩存優化
有以下集中方法
方法一:針對瀏覽器設置過期時間,在這個時間內的請求都會先請求本地緩存的文件和數據。另外jquery的ajax請求方式可以設置是否緩存,可以充分利用該選項。
方法二:js請求限制,可以設計成多少秒以內都不響應響應的操作,過期後的操作才會有效。點擊後僅返回一個模擬的結果。
方法三:ajax做dom緩存策略,比如在頁面放一個不可見的textarea,請求過來的數據同時寫入textarea的value,並且在一定時間內(可設置)的請求只去讀取textarea的內容,並將結果展示到頁面上。