Verhindert „display:none' das Laden von Bildern in modernen Browsern?

Enthüllung der Auswirkungen von „display:none“ auf das Laden von Bildern

Befürworter von responsivem Webdesign verlassen sich häufig auf das CSS „display:none“. Eigenschaft zur Verbesserung des mobilen Surferlebnisses. Es stellt sich jedoch eine entscheidende Frage: Verhindert diese Eigenschaft das Laden von Bildern oder ruft sie sie immer noch im Hintergrund ab?

Wahrheit enthüllt: Die sich entwickelnden Browser

Zunächst Wenn Sie die „Anzeige“ eines Bilds auf „Keine“ setzen, wird es ausgeblendet, ohne dass dies Auswirkungen auf das Laden hat. Allerdings sind moderne Browser intelligenter geworden. Sie können jetzt erkennen, wenn ein Bild für den sichtbaren Teil der Seite unnötig ist, und das Laden überspringen.

Chrome verfügt insbesondere über die Möglichkeit, das Laden von Bildern zu verhindern, wenn das übergeordnete Element des Bildes ausgeblendet ist. Dieses Verhalten kann hier beobachtet werden: http://jsfiddle.net/tnk3j08s/.

Alternative Ansätze zum Verhindern des Ladens

Wenn Sie das Laden eines Bildes vollständig verhindern möchten , ziehen Sie diese Alternativen in Betracht:

• Entfernen des IMG Element:Schließen Sie einfach das IMG-Element aus dem Dokument aus.
• Ändern der IMG-Quelle:Aktualisieren Sie das src-Attribut des IMG auf „data:“ oder „about:blank“, um dies zu verhindern Bildabruf.

Wichtig Hinweise

Damit die oben genannten Strategien effektiv funktionieren, sollte Ihr Bild nicht auf dem Startbildschirm sichtbar sein und nicht träge geladen werden. Wenn diese Bedingungen nicht erfüllt sind, wird das Bild möglicherweise trotzdem geladen, aber ausgeblendet.

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