Verhindert „display:none' wirklich das Laden von Bildern?

Kann „display:none“ das Laden von Bildern verhindern?

Beim responsiven Webdesign ist das Ausblenden unnötiger Inhalte in mobilen Browsern zur Verbesserung der Leistung ein Problem gängige Praxis. Ein Ansatz besteht darin, die CSS-Eigenschaft „display:none“ zu verwenden. Verhindert diese Methode tatsächlich das Laden von Bildern oder wird der Inhalt trotz der Verschleierung trotzdem abgerufen?

Antwort:

Moderne Browser sind in ihrem Ressourcenmanagement intelligenter geworden. Je nach Browser und Version kann das Laden von Bildern angehalten werden, wenn es als nicht unbedingt erforderlich erachtet wird.

Konkret erkennen Browser wie Chrome v68.0 versteckte übergeordnete Elemente und überspringen das Laden von Bildern entsprechend. Dieses Verhalten kann über die Entwicklertools des Browsers überprüft werden, indem die Registerkarte „Netzwerk“ überprüft wird.

Wenn das Bild jedoch ohne verzögertes Laden auf dem ersten Bildschirm angezeigt wird, verhindert „display:none“ das Laden möglicherweise nicht vollständig. Das Bild wird jedoch nicht angezeigt.

Alternativen zum Verhindern des Ladens von Bildern:

Um das Laden vollständig zu verhindern Um unnötiges Laden von Inhalten zu vermeiden, ziehen Sie die folgenden Alternativen in Betracht:

• Lassen Sie das IMG-Element weg:Vermeiden Sie einfach das Hinzufügen des IMG-Elements zum HTML-Dokument.
• Set die Bildquelle auf „data:“ oder „about:blank“: Diese Werte lösen kein Bild aus wird geladen.

Bedenken Sie, dass „display:none“ nur die Sichtbarkeit beeinträchtigt und das Abrufen von Inhalten nicht vollständig verhindert. Erkunden Sie für eine echte Leistungsoptimierung die oben genannten alternativen Methoden.

Das obige ist der detaillierte Inhalt vonVerhindert „display:none' wirklich das Laden von Bildern?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!