Das Video haengt nicht mehr, wenn die Kamera laeuft

Filipe, am Tag einer Sendung: „sobald meine kamera auch zu sehen ist,
also mich, dan haengen die videos EXTREEEEEM. wenn das video alleine
nur laeuft dan laeuft es fast perfekt."

Haus: Team Dogi. Zwei Ursachen, und BEIDE sind nur aktiv, wenn
Kameras sichtbar sind -- genau deshalb lief das Video allein sauber.

1. ZWOELF KODIERER OHNE JEDE GRENZE

Die Reaction verbindet jeden mit jedem. Fuer jeden Zuschauer baut der
Host eine eigene Verbindung auf, und jede hat ihren EIGENEN Kodierer:
Bei zwoelf Sichtplaetzen kodiert sein Rechner dasselbe Gesicht
zwoelfmal gleichzeitig, waehrend daneben das Video dekodiert wird.

Und an keinem einzigen Sender stand eine Grenze. `addTrack` ohne ein
Wort zu `maxBitrate`, `maxFramerate`, `scaleResolutionDownBy` oder
`degradationPreference` -- zwoelf Kodierer, die alle gleichzeitig „so
gut wie moeglich" versuchen und dem Video die Rechenzeit wegnehmen.

Jetzt: 220 kbit, 15 Bilder, Aufloesung halbiert (240x180 gehen
hinaus, das Fenster ist 200 Pixel breit), `balanced`. Rund ein
Sechstel der bisherigen Rechenlast. Der geteilte Bildschirm bekommt
eigene Werte -- dort ist die Aufloesung der Zweck und die Bildrate
fast egal.

2. MATTGLAS UEBER EINEM LAUFENDEN VIDEO

`backdrop-filter` zwingt die Grafikkarte, den Bereich DAHINTER neu zu
lesen und weichzuzeichnen. Ueber einer stehenden Flaeche kostet das
einmal etwas; ueber einem laufenden Video bei JEDEM Bild -- auf
derselben Grafikkarte, die das Video dekodiert.

Vier Stellen lagen auf der Leinwand: das Namensschild JEDES
Kamerafensters (bei voller Sendung dreizehnmal), die Tempoanzeige,
die Senderleiste und der Ton-Knopf. Alle vier tragen jetzt einen
deckenderen Grund und keinen Weichzeichner. Dazu `contain: paint` am
Kamerafenster: Ein ankommendes Kamerabild zieht keine Neuzeichnung
der Leinwand mehr nach sich.

EIN RUECKZIEHER, UND ZWAR EIN WICHTIGER

Mein erster Griff war, die Kamera kleiner aufzunehmen (480x360 statt
640x480). `mess-reaktion` meldete daraufhin „Im Vorraum laeuft kein
eigenes Bild" -- eine Warnung, die vorher nicht da war. 640x480 kann
jede Kamera, 480x360 nicht, und `ideal` ist zwar nur ein Wunsch, aber
was dabei herauskommt, entscheidet der Treiber. Am Abend einer Sendung
ist „vielleicht kein Bild" der schlechteste aller Tausche. Die
Aufloesung bleibt deshalb, kleiner gerechnet wird im Kodierer -- dort
ist es nachweislich erlaubt und kann nichts verhindern, was vorher
ging.

GEMESSEN -- mess-kameralast.mjs (neu), 13 Messungen, 0 Fehler

Sie fragt nicht „kommt ein Bild an" (das war immer mit Ja beantwortet),
sondern WIE TEUER das Bild ist, das hinausgeht -- und zwar an der
LAUFENDEN Verbindung ueber `getParameters()`, nicht im Quelltext. Eine
Zahl im Code beweist nicht, dass der Browser sie uebernommen hat.

Zum Mattglas stellt sie die PRAEZISE Frage: Der erste Entwurf suchte
jedes `backdrop-filter` auf der Seite und meldete drei, die gar nicht
ueber der Leinwand liegen (Kopfleiste, Regieleiste, Buehnenschild) --
teuer ist es aber nur, wenn sich dahinter etwas bewegt. Gemessen wird
jetzt die UEBERSCHNEIDUNG mit dem Videobereich; so kamen die zwei
heraus, die ich uebersehen hatte.

  mess-kameralast (neu)   13, 0 Fehler
  mess-reaktion           0 ACHTUNG (mit dem Rueckzieher wieder sauber)
  pruef-reaktion          588, 0 Fehler
  pruef-css-klassen       gruen

Co-Authored-By: Claude Opus 5 <[email protected]>

workspace/assets/css/reaktion.css

@@ -529,10 +529,25 @@ body.reaktion-seite > .kopfleiste { flex: none; }
   font-size: .72rem; font-weight: 800;
   font-variant-numeric: tabular-nums;
   letter-spacing: .04em;
-  background: rgba(6, 5, 11, .76);
+  /* ==== KEIN MATTGLAS UEBER EINEM LAUFENDEN VIDEO (08.10.2026) ===
+
+     Hier stand `backdrop-filter: blur(6px)`. Ueber einer stehenden
+     Flaeche kostet das einmal etwas; ueber einem LAUFENDEN VIDEO
+     kostet es bei JEDEM Bild: Der Browser muss den Bereich dahinter
+     neu auslesen und neu weichzeichnen, fuenfundzwanzigmal in der
+     Sekunde, und das auf der Grafikkarte, die gleichzeitig das Video
+     dekodiert.
+
+     Dasselbe stand am Namensschild jedes Kamerafensters -- dort also
+     einmal JE FENSTER. Zusammen mit den zwoelf Kodierern war das die
+     zweite Haelfte von Filipes „EXTREEEEEM".
+
+     ERSETZT UND NICHT WEGGENOMMEN: Der Grund wird dafuer deckender
+     (.76 -> .88). Das Schild liest sich genauso gut; es kostet nur
+     nichts mehr. */
+  background: rgba(6, 5, 11, .88);
   border: 1px solid var(--rand);
   color: var(--schrift-leise);
-  backdrop-filter: blur(6px);
 }
 .leinwand__tempo[hidden] { display: none; }
 
@@ -610,6 +625,14 @@ body.reaktion-seite > .kopfleiste { flex: none; }
 
 .kamera {
   position: relative;
+  /* ==== DAS FENSTER MALT NUR SICH SELBST (08.10.2026) ===========
+     `contain: paint` sagt dem Browser, dass nichts aus diesem Kasten
+     herausragt. Er darf ihn dann als eigene Ebene behandeln und muss
+     beim naechsten Kamerabild NICHT die Leinwand darunter neu malen
+     -- und die ist das Video. Ohne diese Zeile zieht jedes
+     ankommende Kamerabild eine Neuzeichnung des ganzen Bereichs nach
+     sich. */
+  contain: paint;
   width: 100%;
   aspect-ratio: 4 / 3;
   border-radius: 16px;
@@ -669,10 +692,12 @@ body.reaktion-seite > .kopfleiste { flex: none; }
   padding: 3px 9px 4px;
   border-radius: 999px;
   font-size: .72rem; font-weight: 700;
-  background: rgba(6, 5, 11, .76);
+  /* Deckend statt Mattglas -- siehe `.leinwand__tempo` weiter oben.
+     Dieses Schild steht EINMAL JE KAMERAFENSTER und damit bei einer
+     vollen Sendung bis zu dreizehnmal ueber dem laufenden Video. */
+  background: rgba(6, 5, 11, .88);
   border: 1px solid var(--rand);
   color: var(--schrift);
-  backdrop-filter: blur(6px);
   max-width: calc(100% - 16px);
   overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
 }
@@ -4123,9 +4148,11 @@ body.reaktion-seite {
   min-height: 44px; padding: 10px 18px;
   border-radius: 999px;
   border: 1px solid color-mix(in srgb, var(--an-hell) 50%, transparent);
-  background: rgba(10, 8, 16, .88);
-  backdrop-filter: blur(12px);
-  -webkit-backdrop-filter: blur(12px);
+  /* KEIN MATTGLAS -- siehe `.leinwand__tempo`. Dieser Knopf liegt
+     mitten auf der Leinwand; dort kostet ein `backdrop-filter` bei
+     JEDEM Bild des Videos einen neuen Weichzeichner. Der Grund ist
+     ohnehin fast deckend; die paar Prozent mehr sieht niemand. */
+  background: rgba(10, 8, 16, .94);
   color: #ffe9ea;
   font-size: .88rem; font-weight: 700;
   box-shadow: 0 18px 40px -18px #000, 0 0 26px -10px var(--an);
@@ -4155,9 +4182,11 @@ body.reaktion-seite {
   display: flex; align-items: center; gap: 8px;
   padding: 6px;
   border-radius: 999px;
-  background: rgba(10, 8, 16, .82);
-  backdrop-filter: blur(12px);
-  -webkit-backdrop-filter: blur(12px);
+  /* KEIN MATTGLAS. Diese Leiste liegt waehrend der ganzen Sendung
+     ueber dem laufenden Video und ist die breiteste Flaeche davon --
+     gemessen von `mess-kameralast` als eine von zwei, die sich
+     wirklich mit der Leinwand ueberschneiden. */
+  background: rgba(10, 8, 16, .92);
   border: 1px solid var(--rand);
   box-shadow: 0 16px 38px -20px #000;
 }