Wissen Sie, wie Sie das Laden von Webfonts optimieren können?

Wissen Sie, wie Sie das Laden von Webfonts optimieren können?
Genau wie der Titel!

Die allgemein verwendete Schriftfamilie lädt die integrierten Schriftarten des Browsers. Wenn jedoch das neue Tag @font-face in CSS3 zum Laden von TTF-Schriftarten verwendet wird, entsteht sehr viel Datenverkehr. Speziell für chinesische Schriftarten.

Heutzutage gibt es immer mehr verschiedene Schriftarten. Wie können wir Schriftarten reibungslos laden?

Heute habe ich mehrere chinesische Schriftarten von China Fonts http://font.chinaz.com/ heruntergeladen, sie in mein Blog gestellt und versucht, sie zu laden, aber ich habe festgestellt, dass sie sehr langsam geladen wurden.

Eine chinesische TTF-Schriftart ist größer als 8 MB. Ich frage mich, wie lange das Laden und Anzeigen dauern wird.

Dann habe ich mich gefragt, wie diese chinesische Schriftarten-Website es schafft, so viele Schriftarten hochzuladen. Obwohl einige der Schriftarten Bilder sind, bietet sie auch die Funktion zur Vorschau der eingegebenen Schriftart.

Irgendeine Idee, was die Lösung ist? Wenn Sie es wissen, antworten Sie bitte.

<<:  Eine kurze Diskussion über Tags in HTML

>>:  Reiner CSS-Code zum Erzielen eines Drag-Effekts

Artikel empfehlen

Führen Sie die Schritte zur Installation von MySQL 5.5 auf CentOS aus

Inhaltsverzeichnis 1. Vorbereitung vor der Instal...

Vue+video.js implementiert Video-Wiedergabelisten

In diesem Artikel wird der spezifische Code von v...

So führen Sie eine reibungslose if-Beurteilung in js durch

Inhaltsverzeichnis Vorwort Code-Implementierung I...

So umgehen Sie unbekannte Feldnamen in MySQL

Vorwort Dieser Artikel stellt die fünfte Frage vo...

JavaScript-Beispielcode zum Ermitteln, ob eine Datei vorhanden ist

1. Geschäftsszenario Ich habe kürzlich Entwicklun...

Mehrere Methoden zur Implementierung von Karussellbildern in JS

Karussell Die Grundidee ist: Im großen Container ...

So mounten Sie die CD, um das RPM-Paket unter Linux zu finden

Vorne geschrieben Manchmal müssen Sie bei der Ver...

Ladeanimation mit CSS3 implementiert

Ergebnisse erzielen Implementierungscode <h1&g...