chore(de): translate diff [0a4d5b451c]

Machine translation from English using gpt-4o-2024-08-06.

Source: mdn/content@0a4d5b4

System prompt:

```md
You are tasked with translating MDN Web Docs content from English to German.

Ensure that the translation is accurate, preserves technical terminology, and follows the rules provided below.

# Rules for Translation

1. Format:

   - The input is a Markdown file.
   - The output should be a Markdown file.
   - Return the raw output, without wrapping it in a Markdown code block.
   - Keep GFM alert syntax untranslated, such as `> [!NOTE]`, `> [!WARNING]`, and `> [!CALLOUT]`.
   - If the input contains HTML tags wrapped in backticks (e.g. `<video>`), make sure they are wrapped in the output.
   - If the input contains HTML tags escaped with a slash (e.g. `\<length>`), make sure they are escaped in the output.

2. Language:

   - Prefer formal language ("Sie") over informal language ("du").

3. Code blocks:

   - Do not translate code blocks.
   - Do not translate terms wrapped in backticks.

4. Macro calls:

   - MDN uses macros for dynamic content insertion. These macros must remain **unchanged** and not translated.
   - Macro calls start with `{{`, followed by the macro name, optional parameters, and end with `}}`.
   - Avoid invalid macro calls by ensuring curly braces, parentheses, and quotes are closed properly.

5. Technical terms and code snippets in text:

   - Keep technical terms like element names, attributes, and method names in **English**. Only translate the surrounding descriptive text.

6. Links and References:

   - Translate link descriptions, but keep the URLs and their structure intact.
   - Do not change the locale in URLs.

7. Glossary:

   - "Browser compatibility" => "Browser-Kompatibilität"
   - "Guide" => "Leitfaden"
   - "How to" => "Anleitung"

# Translation Scope

Translate the following Markdown content from **English** to **German** while adhering to the rules above.
```

files/de/web/api/canvasrenderingcontext2d/textbaseline/index.md

@@ -3,7 +3,7 @@ title: "CanvasRenderingContext2D: textBaseline-Eigenschaft"
 short-title: textBaseline
 slug: Web/API/CanvasRenderingContext2D/textBaseline
 l10n:
-  sourceCommit: 1f216a70d94c3901c5767e6108a29daa48edc070
+  sourceCommit: 0a4d5b451cc54599ed2b99cef4fdd39c3fd96a3d
 ---
 
 {{APIRef}}
@@ -15,25 +15,25 @@ Die **`CanvasRenderingContext2D.textBaseline`**-Eigenschaft der Canvas 2D API le
 Mögliche Werte:
 
 - `"top"`
-  - : Die Text-Basislinie ist die Oberseite des "em"-Quadrats.
+  - : Die Text-Basislinie ist der obere Rand des Em-Quadrats.
 - `"hanging"`
-  - : Die Text-Basislinie ist die hängende Basislinie. (Wird von tibetischen und anderen indischen Schriften verwendet.)
+  - : Die Text-Basislinie ist die hängende Basislinie. (Wird von tibetischen und anderen indischen Schriftsystemen verwendet.)
 - `"middle"`
-  - : Die Text-Basislinie ist die Mitte des "em"-Quadrats.
+  - : Die Text-Basislinie ist die Mitte des Em-Quadrats.
 - `"alphabetic"`
-  - : Die Text-Basislinie ist die normale alphabetische Basislinie. Standardwert.
+  - : Die Text-Basislinie ist die normale {{Glossary("/Baseline/Typography", "alphabetische Basislinie")}}. Standardwert.
 - `"ideographic"`
-  - : Die Text-Basislinie ist die ideographische Basislinie; dies ist der Boden des Hauptkörpers der Zeichen, wenn der Hauptkörper der Zeichen unterhalb der alphabetischen Basislinie hervorsteht. (Wird von chinesischen, japanischen und koreanischen Schriften verwendet.)
+  - : Die Text-Basislinie ist die ideografische Basislinie; dies ist der untere Rand des Hauptkörpers der Zeichen, falls der Hauptkörper der Zeichen unter die alphabetische Basislinie herausragt. (Wird von chinesischen, japanischen und koreanischen Schriftsystemen verwendet.)
 - `"bottom"`
-  - : Die Text-Basislinie ist die Unterseite des Begrenzungsrahmens. Dies unterscheidet sich von der ideographischen Basislinie darin, dass die ideographische Basislinie keine Abstriche berücksichtigt.
+  - : Die Text-Basislinie ist der untere Rand der Begrenzungsrahmen. Dies unterscheidet sich von der ideografischen Basislinie, da diese keine Unterlängen berücksichtigt.
 
 Der Standardwert ist `"alphabetic"`.
 
 ## Beispiele
 
 ### Vergleich der Eigenschaftswerte
 
-Dieses Beispiel zeigt die verschiedenen Werte der `textBaseline`-Eigenschaft.
+Dieses Beispiel zeigt die verschiedenen `textBaseline`-Eigenschaftswerte.
 
 #### HTML
 
@@ -75,7 +75,7 @@ baselines.forEach((baseline, index) => {
 
 ### Vergleich der Eigenschaftswerte auf derselben Linie
 
-Wie im vorherigen Beispiel zeigt dieses Beispiel die verschiedenen Werte der `textBaseline`-Eigenschaft, jedoch in diesem Fall alle horizontal auf derselben Linie ausgerichtet - um es einfacher zu machen, die Unterschiede zu erkennen.
+Wie im vorherigen Beispiel zeigt dieses Beispiel die verschiedenen `textBaseline`-Eigenschaftswerte, jedoch in diesem Fall mit allen horizontal entlang derselben Linie angeordnet — um es einfacher zu machen zu sehen, wie sie sich voneinander unterscheiden.
 
 #### HTML
 
@@ -130,4 +130,4 @@ baselines.forEach((baseline, index) => {
 
 ## Siehe auch
 
-- Das Interface, das diese Eigenschaft definiert: [`CanvasRenderingContext2D`](/de/docs/Web/API/CanvasRenderingContext2D)
+- Die Schnittstelle, die diese Eigenschaft definiert: [`CanvasRenderingContext2D`](/de/docs/Web/API/CanvasRenderingContext2D)

files/de/web/api/css_painting_api/index.md

@@ -2,16 +2,16 @@
 title: CSS Painting API
 slug: Web/API/CSS_Painting_API
 l10n:
-  sourceCommit: 8a4f257358730920c6df40433171ff39b4b1fc21
+  sourceCommit: bad620560c435cae3d3436b9b01ff654680af9a3
 ---
 
 {{DefaultAPISidebar("CSS Painting API")}}{{SeeCompatTable}}
 
-Die CSS Painting API — ein Teil der [CSS Houdini](/de/docs/Web/API/Houdini_APIs) APIs — ermöglicht es Entwicklern, JavaScript-Funktionen zu schreiben, die direkt in den Hintergrund, den Rahmen oder den Inhalt eines Elements zeichnen können.
+Die CSS Painting API — Teil des [CSS Houdini](/de/docs/Web/API/Houdini_APIs) Gesamtpakets von APIs — ermöglicht es Entwicklern, JavaScript-Funktionen zu schreiben, die direkt in den Hintergrund, Rahmen oder Inhalt eines Elements zeichnen können.
 
-## Konzepte und Verwendung
+## Konzepte und Nutzung
 
-Im Wesentlichen enthält die CSS Painting API Funktionen, die es Entwicklern ermöglichen, benutzerdefinierte Werte für {{cssxref('image/paint', 'paint()')}}, eine CSS [`<image>`](/de/docs/Web/CSS/image) Funktion, zu erstellen. Diese Werte können dann auf Eigenschaften wie {{cssxref("background-image")}} angewendet werden, um komplexe benutzerdefinierte Hintergründe auf einem Element festzulegen.
+Im Wesentlichen enthält die CSS Painting API Funktionen, die es Entwicklern erlauben, benutzerdefinierte Werte für {{cssxref('image/paint', 'paint()')}}, eine CSS {{cssxref('&lt;image&gt;')}} Funktion, zu erstellen. Diese Werte können Sie dann auf Eigenschaften wie {{cssxref('background-image')}} anwenden, um komplexe benutzerdefinierte Hintergründe auf ein Element anzuwenden.
 
 Zum Beispiel:
 
@@ -21,28 +21,28 @@ aside {
 }
 ```
 
-Die API definiert ein [`worklet`](/de/docs/Web/API/Worklet), das verwendet werden kann, um programmgesteuert ein Bild zu erzeugen, das auf Änderungen im berechneten Stil reagiert. Um mehr darüber zu erfahren, wie dies verwendet wird, konsultieren Sie [Verwenden der CSS Painting API](/de/docs/Web/API/CSS_Painting_API/Guide).
+Die API definiert ein [`worklet`](/de/docs/Web/API/Worklet), das verwendet werden kann, um programmgesteuert ein Bild zu erzeugen, das auf Änderungen des berechneten Stils reagiert. Um mehr darüber zu erfahren, wie dies verwendet wird, konsultieren Sie [Using the CSS Painting API](/de/docs/Web/API/CSS_Painting_API/Guide).
 
 ## Schnittstellen
 
 - [`PaintWorkletGlobalScope`](/de/docs/Web/API/PaintWorkletGlobalScope)
-  - : Der globale Ausführungskontext des Paint Worklets.
+  - : Der globale Ausführungskontext des Paint Worklet.
 - [`PaintRenderingContext2D`](/de/docs/Web/API/PaintRenderingContext2D)
-  - : Implementiert einen Teil der [`CanvasRenderingContext2D`](/de/docs/Web/API/CanvasRenderingContext2D) API. Es hat ein Ausgabebitmap, das die Größe des Objekts hat, auf das es zeichnet.
+  - : Der Rendering-Kontext für den Rendering-Kontext der CSS Painting API zum Zeichnen auf das Bitmap.
 - [`PaintSize`](/de/docs/Web/API/PaintSize)
-  - : Repräsentiert die Größe des Ausgabebitmaps, das der Autor zeichnen sollte.
+  - : Repräsentiert die Größe des Ausgabebitmaps, die der Autor zeichnen soll.
 
 ## Beispiele
 
-Das folgende Beispiel erstellt eine Liste von Elementen mit einem Hintergrundbild, das zwischen drei verschiedenen Farben und drei Breiten rotiert. In [einem unterstützenden Browser](#browser-kompatibilität) sehen Sie etwas wie das Bild unten.
+Das folgende Beispiel erstellt eine Liste von Elementen mit einem Hintergrundbild, das zwischen drei verschiedenen Farben und drei Breiten rotiert. In [einem unterstützenden Browser](#browser-kompatibilität) werden Sie etwas wie das untenstehende Bild sehen.
 
-![Die Breite und Farbe des Hintergrundbildes ändert sich basierend auf den benutzerdefinierten Eigenschaften](guide/boxbg.png)
+![Die Breite und Farbe des Hintergrundbildes ändern sich basierend auf den benutzerdefinierten Eigenschaften](guide/boxbg.png)
 
 Um dies zu erreichen, definieren wir zwei benutzerdefinierte CSS-Eigenschaften, `--boxColor` und `--widthSubtractor`.
 
 ### Das Paint Worklet
 
-Das Worklet ist eine externe JavaScript-Datei (in diesem Fall haben wir es `boxbg.js` genannt), die ein Paint-[`worklet`](/de/docs/Web/API/Worklet) definiert. Mit dem Worklet können wir auf die CSS-Eigenschaften (und benutzerdefinierte Eigenschaften) von Elementen zugreifen:
+Das Worklet ist eine externe JavaScript-Datei (in diesem Fall haben wir es `boxbg.js` genannt), die ein Paint [`worklet`](/de/docs/Web/API/Worklet) definiert. Mit dem Worklet können wir auf CSS-Eigenschaften (und benutzerdefinierte Eigenschaften) von Elementen zugreifen:
 
 ```js
 registerPaint(
@@ -78,9 +78,9 @@ registerPaint(
 );
 ```
 
-Wir haben die Methode `inputProperties()` in der `registerPaint()`-Klasse verwendet, um die Werte von zwei benutzerdefinierten Eigenschaften zu erhalten, die auf ein Element angewendet werden, das `boxbg` verwendet, und diese dann in unserer `paint()`-Funktion verwendet. Die Methode `inputProperties()` kann alle Eigenschaften zurückgeben, die das Element beeinflussen, nicht nur benutzerdefinierte Eigenschaften.
+Wir haben die Methode `inputProperties()` in der Klasse `registerPaint()` verwendet, um die Werte von zwei benutzerdefinierten Eigenschaften zu erhalten, die auf einem Element gesetzt sind, das `boxbg` angewendet hat, und diese dann innerhalb unserer `paint()`-Funktion verwendet. Die `inputProperties()`-Methode kann alle Eigenschaften zurückgeben, die das Element beeinflussen, nicht nur benutzerdefinierte Eigenschaften.
 
-### Verwendung des Paint Worklets
+### Verwendung des Paint Worklet
 
 #### HTML
 
@@ -126,23 +126,23 @@ li:nth-of-type(3n + 1) {
 
 #### JavaScript
 
-Das Setup und die Logik des Paint Worklets befinden sich im externen Skript. Um das Worklet zu registrieren, müssen wir [`addModule()`](/de/docs/Web/API/Worklet/addModule) von unserem Hauptskript aufrufen:
+Das Setup und die Logik des Paint Worklet befinden sich im externen Skript. Um das Worklet zu registrieren, müssen wir [`addModule()`](/de/docs/Web/API/Worklet/addModule) aus unserem Hauptskript aufrufen:
 
 ```js live-sample___example-boxbg
 CSS.paintWorklet.addModule(
   "https://mdn.github.io/houdini-examples/cssPaint/intro/worklets/boxbg.js",
 );
 ```
 
-In diesem Beispiel wird das Worklet unter `https://mdn.github.io/` gehostet, aber Ihr Worklet könnte eine relative Ressource sein wie folgt:
+In diesem Beispiel wird das Worklet bei `https://mdn.github.io/` gehostet, aber Ihr Worklet kann eine relative Ressource wie folgt sein:
 
 ```js
 CSS.paintWorklet.addModule("boxbg.js");
 ```
 
 #### Ergebnis
 
-Obwohl Sie das Skript des Worklets nicht ändern können, können Sie die Werte der benutzerdefinierten Eigenschaften in den DevTools ändern, um die Farben und die Breite des Hintergrundbildes zu ändern.
+Obwohl Sie nicht mit dem Skript des Worklets spielen können, können Sie die Werte der benutzerdefinierten Eigenschaften in den DevTools ändern, um die Farben und die Breite des Hintergrundbildes zu ändern.
 
 {{EmbedLiveSample("example-boxbg", "", "300px")}}
 
@@ -156,6 +156,6 @@ Obwohl Sie das Skript des Worklets nicht ändern können, können Sie die Werte
 
 ## Siehe auch
 
-- [Verwenden der CSS Painting API](/de/docs/Web/API/CSS_Painting_API/Guide)
+- [Using the CSS Painting API](/de/docs/Web/API/CSS_Painting_API/Guide)
 - [CSS Typed Object Model API](/de/docs/Web/API/CSS_Typed_OM_API)
 - [Houdini APIs](/de/docs/Web/API/Houdini_APIs)

files/de/web/api/htmlimageelement/loading/index.md

@@ -3,59 +3,56 @@ title: "HTMLImageElement: loading-Eigenschaft"
 short-title: loading
 slug: Web/API/HTMLImageElement/loading
 l10n:
-  sourceCommit: 5b20f5f4265f988f80f513db0e4b35c7e0cd70dc
+  sourceCommit: 8bc1b82b5526140a0bd6cfc147b74bf74947a09d
 ---
 
 {{APIRef("HTML DOM")}}
 
-Die [`HTMLImageElement`](/de/docs/Web/API/HTMLImageElement)-Eigenschaft **`loading`** ist ein String, dessen Wert dem {{Glossary("user_agent", "User-Agent")}} einen Hinweis gibt, wie das Laden des Bildes, das sich derzeit außerhalb des visuellen Viewports des Fensters befindet, gehandhabt werden soll.
+Die [`HTMLImageElement`](/de/docs/Web/API/HTMLImageElement)-Eigenschaft **`loading`** ist ein String, dessen Wert einen Hinweis darauf gibt, wie der {{Glossary("user_agent", "User-Agent")}} das Laden des Bildes, das sich derzeit außerhalb des {{Glossary("visual_viewport", "visuellen Viewports")}} des Fensters befindet, behandeln soll.
 
-Dies hilft, das Laden der Inhalte eines Dokuments zu optimieren, indem das Laden des Bildes bis zu dem Zeitpunkt verschoben wird, an dem es voraussichtlich benötigt wird, anstatt es sofort während des anfänglichen Seitenladevorgangs zu laden.
+Dies hilft, das Laden der Inhalte des Dokuments zu optimieren, indem das Laden des Bildes hinausgeschoben wird, bis es wahrscheinlich benötigt wird, anstatt sofort beim initialen Seitenladen.
 
 ## Wert
 
-Ein String, der dem User-Agent einen Hinweis gibt, wie das Laden des Bildes am besten geplant werden kann, um die Leistung der Seite zu optimieren.
+Ein String, der dem User-Agent einen Hinweis gibt, wie das Laden des Bildes am besten geplant werden soll, um die Seitenleistung zu optimieren.
 Die möglichen Werte sind:
 
 - `eager`
-  - : Das Standardverhalten, `eager`, weist den Browser an, das Bild zu laden, sobald das `<img>`-Element verarbeitet wird.
+  - : Das Standardverhalten, `eager` weist den Browser an, das Bild zu laden, sobald das `<img>`-Element verarbeitet wird.
 - `lazy`
-  - : Weist den User-Agent an, das Laden des Bildes solange aufzuschieben, bis der Browser schätzt, dass es bald benötigt wird.
-    Zum Beispiel, wenn der Benutzer durch das Dokument scrollt, wird ein Wert von `lazy` bewirken, dass das Bild nur kurz bevor es im visuellen Viewport des Fensters erscheint, geladen wird.
+  - : Weist den User-Agent an, das Laden des Bildes zurückzustellen, bis der Browser schätzt, dass es bald benötigt wird.
+    Zum Beispiel, wenn der Benutzer durch das Dokument scrollt, bewirkt ein Wert von `lazy`, dass das Bild erst kurz vor seinem Erscheinen im {{Glossary("visual_viewport", "visuellen Viewport")}} geladen wird.
 
-## Verwendungshinweise
-
-> [!NOTE]
-> In Firefox muss das `loading`-Attribut vor dem `src`-Attribut definiert sein, sonst hat es keine Wirkung ([Firefox-Bug 1647077](https://bugzil.la/1647077)).
+## Nutzungshinweise
 
 ### JavaScript muss aktiviert sein
 
 Das Laden wird nur verzögert, wenn JavaScript aktiviert ist.
-Dies ist eine Anti-Tracking-Maßnahme, denn wenn ein User-Agent Lazy-Loading unterstützen würde, während Scripting deaktiviert ist, wäre es dennoch möglich, die ungefähre Scroll-Position eines Benutzers während einer Sitzung zu verfolgen, indem Bilder strategisch im Markup einer Seite platziert werden, sodass ein Server verfolgen kann, wie viele Bilder angefordert werden und wann.
+Dies ist eine Maßnahme gegen Tracking, da es einer Website möglich wäre, die ungefähre Scrollposition eines Benutzers während einer Sitzung zu verfolgen, indem strategisch Bilder im Markup einer Seite platziert werden, sodass ein Server verfolgen kann, wie viele Bilder angefordert werden und wann.
 
-### Zeitpunkt des Ladeereignisses
+### Zeitpunkt des Lade-Events
 
-Das [`load`](/de/docs/Web/API/Window/load_event)-Ereignis wird ausgelöst, wenn das Dokument vollständig verarbeitet wurde.
-Wenn Bilder eifrig geladen werden (was der Standard ist), muss jedes Bild im Dokument abgerufen werden, bevor das `load`-Ereignis ausgelöst werden kann.
+Das [`load`](/de/docs/Web/API/Window/load_event)-Event wird ausgelöst, wenn das Dokument vollständig verarbeitet wurde.
+Wenn Bilder eifrig geladen werden (was der Standard ist), muss jedes Bild im Dokument abgerufen werden, bevor das `load`-Event ausgelöst werden kann.
 
-Durch Angabe des Wertes `lazy` für `loading` verhindern Sie, dass das Bild das `load`-Attribut um die Zeit verzögert, die zum Anfordern, Abrufen und Verarbeiten des Bildes benötigt wird.
+Durch das Festlegen des Wertes `lazy` für `loading` verhindern Sie, dass das Bild das `load`-Attribut um die Zeit verzögert, die benötigt wird, um das Bild anzufordern, abzurufen und zu verarbeiten.
 
-Bilder, deren `loading`-Attribut auf `lazy` gesetzt ist, die sich jedoch innerhalb des visuellen Viewports direkt nach dem anfänglichen Seitenladen befinden, werden geladen, sobald das Layout bekannt ist, aber deren Ladevorgänge verzögern das Auslösen des `load`-Ereignisses nicht.
-Mit anderen Worten laden diese Bilder nicht sofort beim Verarbeiten des `<img>`-Elements, sind jedoch immer noch Teil des anfänglichen Seitenladens.
-Sie beeinflussen einfach nicht den Zeitpunkt des `load`-Ereignisses.
+Bilder, deren `loading`-Attribut auf `lazy` gesetzt ist, die sich jedoch sofort nach dem initialen Laden der Seite im visuellen Viewport befinden, werden geladen, sobald das Layout bekannt ist, aber ihr Laden verzögert nicht die Auslösung des `load`-Events.
+Mit anderen Worten, diese Bilder werden nicht sofort beim Verarbeiten des `<img>`-Elements geladen, sind aber dennoch Teil des initialen Seitenladens.
+Sie beeinflussen lediglich nicht das Timing des `load`-Events.
 
-Das bedeutet, dass wenn `load` ausgelöst wird, es möglich ist, dass alle lazy-geladenen Bilder, die sich im visuellen Viewport befinden, noch nicht sichtbar sind.
+Das bedeutet, dass es möglich ist, wenn `load` ausgelöst wird, dass noch nicht alle lazy-geladenen Bilder, die sich im visuellen Viewport befinden, sichtbar sind.
 
-### Verhindern von Elementverschiebungen während des Lazy-Loadings von Bildern
+### Verhinderung von Elementverschiebungen während des Lazy-Ladens von Bildern
 
-Wenn ein Bild, dessen Laden durch das `loading`-Attribut mit dem Wert `lazy` verzögert wurde, schließlich geladen wird, bestimmt der Browser die endgültige Größe des {{HTMLElement("img")}}-Elements basierend auf dem Stil und der intrinsischen Größe des Bildes und überarbeitet das Dokument nach Bedarf, um die Position der Elemente basierend auf jeder Größenänderung zu aktualisieren, die am Element vorgenommen wird, um das Bild anzupassen.
+Wenn ein Bild, dessen Laden durch das `loading`-Attribut auf `lazy` verzögert wurde, schließlich geladen wird, bestimmt der Browser die endgültige Größe des {{HTMLElement("img")}}-Elements basierend auf dem Stil und der intrinsischen Größe des Bildes und überarbeitet das Dokument nach Bedarf, um die Positionen der Elemente basierend auf jeder Größenänderung anzupassen, die am Element vorgenommen wird, um das Bild anzupassen.
 
-Um diese Überarbeitung zu verhindern, sollten Sie die Größe der Bilddarstellung ausdrücklich mithilfe der Attribute [`width`](/de/docs/Web/HTML/Element/img#width) und [`height`](/de/docs/Web/HTML/Element/img#height) des Bildelements angeben.
-Indem Sie das intrinsische {{Glossary("aspect_ratio", "Seitenverhältnis")}} auf diese Weise festlegen, verhindern Sie, dass sich Elemente während des Ladens des Dokuments verschieben, was im besten Fall irritierend oder abschreckend sein kann und im schlimmsten Fall Benutzer dazu bringen kann, versehentlich das falsche Objekt anzuklicken, abhängig vom genauen Timing der verzögerten Ladevorgänge und Überarbeitungen.
+Um diesen Reflow zu verhindern, sollten Sie die Größe der Bildpräsentation ausdrücklich mit den Attributen [`width`](/de/docs/Web/HTML/Element/img#width) und [`height`](/de/docs/Web/HTML/Element/img#height) des Bildelements angeben.
+Indem Sie auf diese Weise das intrinsische {{Glossary("aspect_ratio", "Seitenverhältnis")}} festlegen, verhindern Sie, dass sich Elemente während des Ladens des Dokuments verschieben, was im besten Fall irritierend oder unattraktiv sein kann und im schlimmsten Fall dazu führen kann, dass Benutzer fälschlicherweise auf etwas klicken, abhängig vom genauen Timing der verzögerten Ladevorgänge und Reflows.
 
 ## Beispiele
 
-Die unten gezeigte Funktion `addImageToList()` fügt eine Fotominiaturansicht zu einer Liste von Elementen hinzu und verwendet Lazy-Loading, um das Laden des Bildes aus dem Netzwerk zu vermeiden, bis es tatsächlich benötigt wird.
+Die unten gezeigte Funktion `addImageToList()` fügt ein Foto-Thumbnail zu einer Liste von Elementen hinzu und verwendet Lazy-Loading, um zu vermeiden, dass das Bild aus dem Netzwerk geladen wird, bis es tatsächlich benötigt wird.
 
 ```js
 function addImageToList(url) {
@@ -87,4 +84,4 @@ function addImageToList(url) {
 
 - Das {{HTMLElement("img")}}-Element
 - [Web-Performance](/de/docs/Learn_web_development/Extensions/Performance) im MDN-Lernbereich
-- [Lazy Loading](/de/docs/Web/Performance/Lazy_loading) im MDN-Webperformance-Leitfaden
+- [Lazy Loading](/de/docs/Web/Performance/Lazy_loading) im MDN-Web-Performance-Leitfaden