什麼是防止陳舊的CSS和JavaScript的最佳實踐

我正在研究這個項目，我想知道其他人正在做什麼來防止陳舊的CSS和JavaScript文件與每個新版本一起提供。我不想追加時間戳或類似的東西，這可能會阻止每個請求的緩存。什麼是防止陳舊的CSS和JavaScript的最佳實踐

我正在使用Spring 2.5 MVC框架，我已經在使用google api來提供原型和scriptaculous。我也在考慮使用Amazon S3和新的Cloudfront產品來最大限度地減少網絡延遲。

2008-12-10 digitalsanctum

我一個參數添加到使用版本號的要求，是這樣的：

<script type="text/javascript" src="/path/to/script.js?ver=456"></script>

的「版本」參數與每個版本自動更新（從文件中讀取，它構建更新）。這可以確保只對當前版本緩存腳本。

來源

2008-12-10 16:12:39

最好的解決辦法是最簡單:)謝謝 – Mike 2010-10-09 21:42:19

使用conditional get請求與If-Modified-Since頭

來源

2008-12-10 15:58:12

這其實是一個很難的問題，以及東西，你可以花一段時間工。正確的解決方案。

我會建議使用內置的URL時間戳和/或版本發佈的文件，這樣，而不是：

/media/js/my.js你結束了：

/媒體/ js/v12/my.js或類似的東西。

您可以使用任何工具自動執行版本控制/時間戳。

這有附加好處，就是在您推出新版本時不會破壞站點，並且可以進行真正的並行測試（不同於只刪除版本併發回最新文件的重寫規則）。

有一點要注意的JS或CSS是當你需要包含依賴的URL（背景圖像等）時，你需要確保JS/CSS的時間戳/版本改變，如果內部的資源（以及作爲重寫它們，但這是可能的一個非常簡單的正則表達式和資源清單）。

無論你做什麼，都要確保不要折騰vblah到最後，因爲當你這樣做時，基本上會拋出窗口緩存（這是不幸的，因爲它是迄今爲止最簡單的處理方法）

來源

2008-12-10 16:12:18

如果您將文件的「修改時間」作爲時間戳記，它將被緩存直到文件被修改。只需使用助手函數（或其他框架中調用的任何函數）來添加從文件獲取時間戳的script/css/image標記。在unix系統上（絕大多數超級用戶），你可以簡單地使用touch這些文件來強制修改時間以便在必要時進行更改。

Ruby on Rails在生產模式下使用此策略（默認情況下我是beleave），並在開發模式下使用正常的時間戳（以確保某些內容沒有被緩存）。

來源

2008-12-10 18:12:36

關於緩存文件，我還沒有遇到任何與使用querystring方法的失效緩存文件相關的錯誤問題。

然而，關於性能和呼應Todd B的提按文件名轉速時，請確認了史蒂夫Souders的「工作更多的題目

「魷魚，一個流行的代理，不使用查詢字符串緩存資源，當代理緩存後面的多個用戶請求同一個文件時，這會損害性能 - 而不是使用緩存版本，每個人都必須向原始服務器發送請求。

「代理服務器管理員可以更改配置，支持緩存資源，查詢字符串，當緩存頭表示是合適的，但默認配置是開發商應該期望最常遇到什麼網站。」

http://www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/

來源

2008-12-10 20:03:50

像@埃倫 - 加爾佩林，我用一個參數的參考JS文件，但我有一個服務器生成的參考文件的「上次修改」日期。 @ stein-g-strindhaug建議這種方法。這將是這個樣子：

<script type="text/javascript" src="/path/to/script.js?1347486578"></script>

服務器忽略的參數爲靜態文件和客戶端可以緩存腳本，直到日期代碼的變化。如果（且僅當）您修改服務器上的JS文件，則日期代碼將自動更改。

例如，在PHP中，我的腳本來創建此代碼如下所示：

function cachePreventCode($filename) { 
    if (!file_exists($filename)) 
     return ""; 
    $mtime = filemtime($filename); 
    return $mtime; 
}

所以，那麼當你的PHP文件包含一個CSS文件的引用，它可能是這樣的：

<link rel="stylesheet" type="text/css" href="main.css?<?= cachePreventCode("main.css") ?>" />

...這將創造...

<link rel="stylesheet" type="text/css" href="main.css?1347489244" />

來源

2012-09-12 22:35:37

如果你使用Maven，你可以利用這一點，加上你p om.xml：

<properties> 
    <maven.build.timestamp.format>yyyyMMddHHmm</maven.build.timestamp.format> 
    <timestamp>${maven.build.timestamp}</timestamp> 
</properties>

有了這個，你可以在你的視圖中獲得$ {timestamp}。喜歡這個樣本：

<script type="text/javascript" src="/js/myScript.js?t=${timestamp}"></script>

來源

2015-08-14 18:44:24

什麼是防止陳舊的CSS和JavaScript的最佳實踐

回答

相關問題