0

以前にGoogleの洞察でテストしたように、少なくとも有効期限を追加できる多くの画像、css、およびjsファイルをリストします。これは私がこれについて理解したことです:

効率的なキャッシュ ポリシーを使用して静的アセットを提供する

そのため、イメージを aws s3 バケットに追加し、期間を 7 日間に設定してテストしています。Chrome 開発ツールでチェックインしたところ、表示されCache-Control: max-age=604800ます。サイズはメモリからフェッチされ、ステータス コードは 304 です。

しかし、Googleページの速度の洞察で再度テストすると、この特定の画像がまだ下に表示されます

効率的なキャッシュ ポリシーを使用して静的アセットを提供する

セクション。

提案どおりに有効期限/より長い期間が追加された場合、なぜここに画像が表示されるのでしょうか? この静的ファイルを正しく提供するために他にすべきことはありますか?

4

1 に答える 1

0

Google の Lighthouse は1 年を示唆していますが、そのヒューリスティックはハードコーディングされた制限よりも一般的であると説明しています。

彼らのアドバイスに従いたい場合は、年を使用するのが最も簡単ですが、値が小さいほどチェックに合格するはずです。

例から：

Cache-Control: max-age=31536000

可能であれば、 1 年以上など、不変の静的アセットを長期間キャッシュします。静的アセットのファイル名にハッシュを埋め込むようにビルド ツールを構成して、それぞれが一意になるようにします。

ヒューリスティックは、特定の値を持つのではなく、実際の統計から派生したものとして説明されています。

この見積もりには、Chrome に報告された使用統計の集計に基づいた、各リソースの最適なキャッシュ期間の計算が含まれています。期間が長いほど良いとは限りません。詳細については、監査ソースを確認してください。最終的に、リソースの最適なキャッシュ期間を決定するのはユーザー次第です。

ソース コードでは、ヒューリスティックがどのように定義されているかを確認できます。

// Ignore assets that have very high likelihood of cache hit
const IGNORE_THRESHOLD_IN_PERCENT = 0.925;

...

const cacheHitProbability = CacheHeaders.getCacheHitProbability(cacheLifetimeInSeconds);
if (cacheHitProbability > IGNORE_THRESHOLD_IN_PERCENT) continue;

...
static getCacheHitProbability(maxAgeInSeconds) {
// This array contains the hand wavy distribution of the age of a resource in hours at the time of
// cache hit at 0th, 10th, 20th, 30th, etc percentiles.
// Example: a max-age of 12 hours already covers ~50% of cases, doubling to 24 hours covers ~10% more.
...
const RESOURCE_AGE_IN_HOURS_DECILES = [0, 0.2, 1, 3, 8, 12, 24, 48, 72, 168, 8760, Infinity];
assert.ok(RESOURCE_AGE_IN_HOURS_DECILES.length === 12, 'deciles 0-10 and 1 for overflow');

簡単に言うと、しきい値は約 3 か月 (約max-age=8337600) であると思いますが、正確な値を一致させることが、年を選択するよりも役立つとは考えにくいです。

于 2019-01-22T11:48:30.400 に答える