Shopify Cache von Drittanbieter-Assets: Was Sie beheben können

Was die Cache-Richtlinienwarnung bedeutet

PageSpeed markiert statische Assets mit kurzer Cache-Lebensdauer, da wiederkehrende Besucher sie möglicherweise zu früh erneut herunterladen müssen. Auf einer rein benutzerdefinierten Site kann ein Entwickler häufig Server-Header anpassen. Bei Shopify sind die Storefront-Assets auf das CDN von Shopify, Ihr Theme, App-Anbieter, Tracking-Plattformen, Schriftartenanbieter, Videoeinbettungen und Werbenetzwerke aufgeteilt. Sie kontrollieren einen Teil dieses Stapels, aber nicht den gesamten.

This is why merchants get frustrated with the warning. They see a third-party JavaScript file from a reviews app, chat widget, pixel, or attribution tool and look for a Shopify setting that does not exist. If the file is served from the vendor's domain, the vendor sets the cache lifetime. Your job is to decide whether that vendor should load, where it should load, and whether a lighter pattern can replace it.

Cache-Richtlinie gehört daneben Effiziente Cache-Richtlinie von Shopify, Auswirkungen auf Skripte von Drittanbietern, App-Geschwindigkeitsoptimierungund die vollständiger Leitfaden zur Shopify-Geschwindigkeitsoptimierung.

Welche Assets Sie auf Shopify kontrollieren können

Themenressourcen

Dateien, die in Ihr Shopify-Theme hochgeladen werden, wie CSS, JavaScript, Bilder und Schriftarten, sind der sicherste Ort zum Optimieren. Sie können tote Dateien entfernen, Bilder komprimieren, Skripte aufteilen und das Laden alter Assets vermeiden. Das CDN von Shopify übernimmt die Lieferung, aber Sie haben weiterhin die Kontrolle darüber, was angefordert wird.

Zugelassene statische Herstellerdateien

Some libraries can be self-hosted if the license and vendor documentation allow it. Examples include a local slider library, a small helper script, or a font file you are licensed to host. This is different from copying a live app script that expects vendor updates.

App-Einbettungen und Pixel

Normalerweise können Sie ihre Cache-Header nicht ändern. Sie können ungenutzte App-Einbettungen deaktivieren, doppelte Pixel entfernen, Widgets auf relevante Vorlagen beschränken und unkritische Benutzeroberflächen verzögern, bis der erste Bildschirm nutzbar ist.

Handbuch Schritt für Schritt: Behandeln Sie Cache-Warnungen von Drittanbietern

1. Sortieren Sie die Vermögenswerte nach Eigentum

Öffnen Sie DevTools Network oder PageSpeed und gruppieren Sie markierte URLs in Shopify CDN, Ihrem Theme, App-Anbietern, Pixeln, Schriftarten, Videoeinbettungen und Marketing-Tools. Reparieren Sie zunächst Ihr eigenes Vermögen. Für Vermögenswerte im Besitz des Anbieters ist eine andere Entscheidung erforderlich.

Shopify-controlled:
cdn.shopify.com/s/files/.../theme.css
cdn.shopify.com/s/files/.../custom.js

Vendor-controlled:
reviews-app.example/widget.js
analytics.example/pixel.js
chat.example/launcher.js

2. Remove assets from templates that do not need them

Ein Produktbewertungs-Widget gehört möglicherweise zu Produktseiten, jedoch nicht zu Blogbeiträgen. Ein Store-Locator-Skript gehört möglicherweise zu einer Seite, nicht zur gesamten Storefront. Theme-App-Erweiterungen und App-Einbettungen sollten so eng begrenzt sein, wie es die App zulässt.

{% if template.name == 'product' %}
  <script src="https://vendor.example/reviews.js" defer></script>
{% endif %}

3. Verwenden Sie Fassaden für schwere Einbettungen

Videos, Karten, Chats und soziale Einbettungen laden oft viele Dateien mit Cache-Richtlinien, die Sie nicht kontrollieren können. Ersetzen Sie die vollständige Einbettung durch eine statische Vorschau oder eine einfache Schaltfläche und laden Sie dann den Code des Drittanbieters erst nach der Interaktion.

<button class="chat-facade" data-load-chat>
  Chatten Sie mit uns
</button>

&lt;script&gt;
  document.querySelector('[data-load-chat]')?.addEventListener('click', () => {
    const script = document.createElement('script');
    script.src = 'https://chat.example/widget.js';
    script.defer = true;
    document.head.appendChild(script);
  });
&lt;/script&gt;

4. Hosten Sie nur das selbst, was sicher ist

Hosten Sie Schriftarten, kleine Bibliotheken und genehmigte statische Assets selbst, wenn Sie dazu berechtigt sind. Kopieren Sie keine App-Skripte, Zahlungsskripte, Tracking-Pixel oder ständig aktualisierten Anbietercode in Ihr Theme. Dies kann die Verarbeitung von Einwilligungen, die Analyse, den Support und zukünftige Sicherheitskorrekturen beeinträchtigen.

@font-face {
  font-family: 'Brand Sans';
  src: url('{{ "brand-sans.woff2" | asset_url }}') format('woff2');
  font-display: swap;
  font-weight: 400;
}

5. Bitten Sie Anbieter um besseres Caching

If a critical app ships static files with very short cache lifetimes, contact support with the exact URL from PageSpeed and ask whether they can improve cache headers or provide a lighter embed. Good vendors understand the request. If they cannot help and the widget is not producing revenue, remove or replace it.

6. Wiederholte Aufrufe und mobile Leistung erneut testen

Die Cache-Richtlinie ist für wiederkehrende Besucher am wichtigsten, aber dieselben Ressourcen von Drittanbietern können auch die Netzwerknutzlast beim ersten Laden, die Arbeit im Haupt-Thread und INP beeinträchtigen. Testen Sie erneut mit dem kostenloser Shopify-Geschwindigkeitstest, dann vergleichen mobile Geschwindigkeitsmetriken und Shopify-Geschwindigkeitsbewertung vs. PageSpeed Insights.

Manueller Fix vs. Thunder Fix

Was Sie nicht tun sollten

Streben Sie nicht nach einem perfekten Cache-Policy-Score, indem Sie Umsatztools kaputtmachen. Bewertungen, Abonnements, Analysen, Betrugsprüfungen und Chat können von Bedeutung sein. Die richtige Frage ist, ob jedes Drittanbieter-Asset seinen Platz in genau dieser Vorlage verdient. Entfernen Sie, was nicht der Fall ist, dämmen Sie ein, was nicht der Fall ist, und halten Sie die von Shopify kontrollierte Seite so schlank wie möglich.

Für einen umfassenderen Reinigungsplan verwenden Sie App-Skriptkorrekturen, GTM-Geschwindigkeitskorrekturen, und Shopify-Ressourcenhinweise. Wenn Sie zuerst die automatisierte Baseline wünschen, überprüfen Sie diese Thunder-Preise und dann den Anbieterstapel mit besseren Daten bereinigen.

FAQ