いつもお世話になっております。
下記の質問についてご存知の方がいらっしゃいましたらご教示を願います。


【質問の主旨】

CSSファイルについてバージョン管理をしているにも関わらず、ChromeのCacheストレージに同じ名前のファイルが格納されます。別々の名前で保存するためにはどうすれば良いでしょうか?

【質問の補足】

  1. CSSファイル(global.css)が変更されるたびにキャッシュ内でバージョンを更新したいと考えています。
global.css

更新前) a{color:#b28b60}
↓
更新後) a{color:red}

2.
aタグのcolorプロパティ値を変えたときにindex.htmlのlinkタグを下記のように書きかえました。

index.html

更新前) <link rel="stylesheet" href="/css/global.css" type="text/css">
↓
更新後) <link rel="stylesheet" href="/css/global.css?v=1" type="text/css">
  1. 1と2に関するコードはGitHubのhistoryに記述しています。

4.
CSSが格納されているChromeのCacheストレージの様子は以下のように変化します

更新前) http://takaiba.net/stackoverflow/stackoverflow20190328_1.png

更新後) http://takaiba.net/stackoverflow/stackoverflow20190328_2.png

5.
今回の質問はWebサイトパフォーマンス実践入門という本のP238からP239までの内容に基づいて投稿しています。上述した補足の4では、/css/global.cssが2つ格納されていますが、 本の例では/css/global.css/css/global.css?v=1がそれぞれ1つずつ格納されている ことが図で示されています。


以上、ご確認よろしくお願い申し上げます。