javaweb項目css和js引入導致緩存問題
css引入:<link href="css/style.css?v=<%= System.currentTimeMillis()%>" rel="stylesheet"type="text/css" />
加個時間戳. 每次打開頁面css名稱都不一樣,所以就不會有緩存咯.
但是,如果css文件很大的話,每次打開網頁都會重新加載,這樣會影響網頁加載速度,用戶體驗不太好。所以最好還是加上 項目的版本號 最好,每次改代碼,發佈都是一個新版本。
例如:<link href="css/style.css?v=9527" rel="stylesheet"type="text/css" />
FIS是專為解決前端開發中自動化工具、性能優化、模塊化框架、開發規範、代碼部署、開發流程等問題的工具框架。
使用FIS我們可以快速的完成各種前端項目的資源壓縮、合併等等各種性能優化工作,同時FIS還提供了大量的開發輔助功能
首先我們瞭解一下FIS的基本命令
fis install : 命令安裝fis倉庫提供的各種 組件、框架、示例、素材、配置等 開發資源。
fis release: 命令用於編譯併發布的你的項目,擁有多個參數調整編譯發佈操作。
fis server: 命令可以啟動一個本地調試服務器用於預覽fis release產出的項目。
接下來我們可以通過快速入門進一步的瞭解FIS。
(1)準備工作
工具安裝
FIS使用Node.js開發,以npm包的形式發佈。因此使用FIS需要先安裝Node.js,再通過npm安裝命令進行FIS安裝。
$ npm install -g fis
示例準備
在介紹FIS的主要功能前,需要先準備一個示例項目。我們可以使用Lights包管理安裝,也可以從Github獲取
$ npm install -g lights #要求node版本在v0.10.27以上
$ lights install fis-quickstart-demo
本地預覽
首先我們可以通過
fis server start
命令啟動FIS的本地調試服務器功能對構建發佈的項目進行預覽調試注意
如果8080端口被佔用,可以通過
fis server start -p [port]
指定新的端口。如果沒有java、php環境,可以通過
fis server start --type node
啟動Node版fis server。命令執行後內置服務器會一直運行,可以通過
fis server stop
命令關閉內置服務器。本地調試服務器啟動成功後,就會自動打開
http://127.0.0.1:8080
,但是此時服務器內沒有任何內容。我們還需要通過FIS發佈DEMO項目才能進行預覽$ cd fis-quickstart-demo #進入DEMO目錄$ fis release #編譯併發布DEMO
fis release
命令會將編譯後的項目發佈至本地調試服務器,再次刷新瀏覽器頁面,我們就可以到fis-quickstart-demo項目的主頁了。資源壓縮
資源壓縮一直是前端項目優化中非常重要的一環,使用FIS我們無需任何配置,只需要一個命令就可以完成壓縮工作。
$ fis release --optimize
添加文件版本
FIS能夠根據靜態資源的內容自動生成文件版本,自動更新資源引用路徑,解決緩存更新問題,告別手動更新時間戳。
我們通過開啟
--md5
參數,為項目中的靜態資源添加md5版本號$ fis release --optimize --md5 # fis release -om
刷新頁面,我們可以看到所有資源均加上了md5版本號