Die Ressource <URL> wurde mit dem Link-Preload vorgeladen, aber nicht innerhalb weniger Sekunden nach dem Ladeereignis dCSS

CSS verstehen
Anonymous
 Die Ressource <URL> wurde mit dem Link-Preload vorgeladen, aber nicht innerhalb weniger Sekunden nach dem Ladeereignis d

Post by Anonymous »

Auf der Website, an der ich arbeite, werden einige Schriftarten auf einem externen Server gehostet. In meinem lade ich die Schriftarten vor und erhalte dann das Stylesheet, das alle @font-face-Regeln für die Schriftart enthält. Das Stylesheet befindet sich auf demselben Server wie die Schriftarten.
Das Problem, das ich habe, ist jedoch, dass die Schriftart nachdem das Stylesheet geladen wurde, erneut geladen zu werden scheint, ohne dass das Vorladen überhaupt genutzt wird.
Ich habe einen Kommentar gesehen, als ich nach einer Lösung gesucht habe, die darauf hindeutet, dass es sich um einen Chromium-Fehler handelt, dieses Verhalten tritt jedoch auch in Firefox auf.
In der Konsole sehe ich:

Die Ressource wurde mit Link-Preload vorgeladen, aber nicht innerhalb weniger Sekunden nach dem Ladeereignis des Fensters verwendet. Bitte stellen Sie sicher, dass es einen geeigneten as-Wert hat und absichtlich vorgeladen ist.

Das Verhalten, das ich sehe, ist, dass die Schriftart etwa eine Sekunde nach dem Laden der Seite geladen wird und mein Kunde damit nicht zufrieden ist. Wenn der Browser die vorinstallierten Schriftarten verwenden würde, würde dies nicht passieren.

Code: Select all



Ich habe versucht, dies sowohl oberhalb als auch unterhalb der Stelle zu platzieren, an der sich mein Haupt-Stylesheet befindet. Ich habe auch versucht, den CSS-Aufruf auch in mein Haupt-Stylesheet einzufügen. Alle Versuche führen zu den gleichen Ergebnissen.
Unten finden Sie den Inhalt der Searchlight.css-Datei.

Code: Select all

@font-face {
font-family: 'Searchlight';
src: local('Searchlight'), local('SearchlightRegular'),
url('path to SearchlightRegular.woff2') format('woff2'),
url('path to SearchlightRegular.woff') format('woff'),
url('path to SearchlightRegular.ttf') format('truetype');
font-weight: 300;
font-style: normal;
font-display: swap;
}

.font-searchlight {
font-family: 'Searchlight', serif;
}
Image
Ich kann mir vorstellen, dass es dafür eine Lösung gibt, da ich Websites gesehen habe, deren Schriftarten sofort (oder nur sehr schnell) geladen werden. Nichts, was ich bei der Suche in den letzten 30 Minuten gefunden habe, hat bei mir geholfen.

Quick Reply

Change Text Case: 
   
  • Similar Topics
    Replies
    Views
    Last post