WEBVTT

00:00:00.017 --> 00:00:03.257
Ach, du weißt, in Actionfilmen ist das auch immer so, dass die aus dem Flugzeug

00:00:03.257 --> 00:00:05.897
fallen und dann merken die, dass sie keinen Fallschirm haben.

00:00:05.957 --> 00:00:10.197
Und dann springt aber James Bond hinterher und holt dich ein und dann fängt

00:00:10.197 --> 00:00:14.197
er dich und macht seinen Fallschirm auf. Und so ist das mit Abort-Signal dann auch gewesen.

00:00:15.337 --> 00:00:18.377
Ich finde es super, wie alle Vergleiche, die du ziehst, so Sachen sind,

00:00:18.437 --> 00:00:22.017
wo ich sagen würde, ja, okay, Tom Cruise macht das für seinen nächsten Film

00:00:22.017 --> 00:00:24.377
so als Stunt, weil er halt irgendwie nicht alle Tassen im Schrank hat.

00:00:24.657 --> 00:00:27.257
Aber wenn ich einfach so hier stinknormaler Webentwickler bin,

00:00:27.377 --> 00:00:29.357
würde ich vielleicht einfach meine Aufgabe erledigen wollen.

00:00:30.517 --> 00:00:32.837
Okay, schnallt euch an. Es wird krass.

00:00:37.057 --> 00:00:40.237
Jawohl, Peter. Das ist doch für dich genau das Richtige.

00:00:40.720 --> 00:00:47.280
Music.

00:00:45.857 --> 00:00:49.577
Diese Revision von Working Draft wird euch präsentiert von wahren Podcast-Fans wie euch.

00:00:50.037 --> 00:00:52.317
Wenn ihr es noch nicht getan habt, würden wir uns sehr darüber freuen,

00:00:52.417 --> 00:00:54.417
wenn ihr uns eine positive Bewertung geben könntet.

00:00:54.517 --> 00:00:58.417
Auf den einschlägigen Podcast-Portalen wie Spotify und Apple Podcast könnt ihr

00:00:58.417 --> 00:00:59.757
uns gerne ein paar Sternchen hinterlassen.

00:01:00.017 --> 00:01:02.977
Damit das, was wir hier machen, von mehr Menschen gefunden und gehört werden

00:01:02.977 --> 00:01:06.157
kann. Danke für eure Unterstützung und danke für eure Sternchen.

00:01:10.237 --> 00:01:11.277
Revision 622.

00:01:13.497 --> 00:01:19.357
Wir sind heute zu dritt und wir hätten aus dem Team den Hans. Hallo.

00:01:19.797 --> 00:01:25.857
Den Peter. Moin, moin. Ich bin der Shep und heute möchten wir mal wieder eine

00:01:25.857 --> 00:01:28.957
Runde Glücksrott spielen, nachdem wir das schon wieder länger nicht mehr gemacht haben.

00:01:30.197 --> 00:01:33.277
Jawohl. So sieht's doch aus.

00:01:33.817 --> 00:01:39.637
Genau, und für alle, die das noch nicht kennen, wenn man auf workinggraph.de slash glücksrad geht,

00:01:39.817 --> 00:01:46.377
dann ist da eine Art Zufallsgenerator und der bedient sich aus den MDN-Daten

00:01:46.377 --> 00:01:52.757
und fischt für uns irgendwelche HTML-Elemente oder CSS oder Web-APIs und ich

00:01:52.757 --> 00:01:55.097
glaube, ich hab auch mittlerweile JavaScript drin.

00:01:55.717 --> 00:01:59.237
Also JavaScript-Syntaxe, weil die hatten wir irgendwie nie drin.

00:01:59.237 --> 00:02:01.757
Das hatte ich irgendwie letztes Mal gedacht, packe ich mal rein.

00:02:02.397 --> 00:02:05.677
Cool. Genau, der fischt uns da irgendwas raus. Und dann versuchen wir,

00:02:05.757 --> 00:02:10.757
alles darüber auf den Tisch zu kippen, aus unseren Hirnen, was uns dazu einfällt.

00:02:11.397 --> 00:02:13.737
Und weil wir das schon ein paar Mal gespielt haben, könnte es sein,

00:02:13.817 --> 00:02:17.477
dass wir auch Dinge erwürfeln, die wir schon mal hatten. Dann werden wir einfach noch mal würfeln.

00:02:18.017 --> 00:02:22.557
Dann skippen wir. Und wichtig ist ja, glaube ich, wenn auch ihr als Hörerinnen

00:02:22.557 --> 00:02:27.117
und Hörer irgendwie dann diese Eigenschaft oder Ähnliches kennt und da eine

00:02:27.117 --> 00:02:30.317
coole Anekdote zu habt oder vielleicht noch mehr wisst als wir,

00:02:30.417 --> 00:02:32.937
was manchmal gar nicht so unwahrscheinlich ist,

00:02:33.617 --> 00:02:35.357
dann teilt das doch gerne mal mit uns,

00:02:36.077 --> 00:02:38.997
weil dann lernen wir auch was Neues und vielleicht können wir es dann bei der

00:02:38.997 --> 00:02:42.017
nächsten Revision hier rezitieren.

00:02:42.317 --> 00:02:45.357
Genau, und ihr könnt auch mit uns glückshaft spielen. Also wenn ihr möchtet,

00:02:45.357 --> 00:02:47.237
ladet euch einfach selbst zu uns an.

00:02:47.737 --> 00:02:52.837
Dann spielen wir das. Genau, auch mega cool. Hatten wir auch vor kurzem eine

00:02:52.837 --> 00:02:54.637
Sendung, glaube ich. Ja.

00:02:56.357 --> 00:02:59.437
Sollen wir starten? und wer möchte, du kannst.

00:03:00.975 --> 00:03:04.635
Hans, willst du loslegen? Ich kann sehr gerne drücken. Ich drücke jetzt den

00:03:04.635 --> 00:03:07.255
Button Zufallsgenerator aktivieren.

00:03:07.875 --> 00:03:15.795
Und wir haben die Breakinside-Property aus der CSS-Spezifikation.

00:03:16.015 --> 00:03:19.355
Also Breakinside ist eine Eigenschaft.

00:03:19.775 --> 00:03:27.035
Ja, Peter? Mit so Page-to-Media-Print-Style-Sheet machen wir einen Seitenumbruch

00:03:27.035 --> 00:03:30.035
in diesem oder jenem Element. Und warum funktioniert das bitte schön nicht?

00:03:32.375 --> 00:03:38.395
Das ist so meine Erinnerung daran. Ja, genau. Also genau so Paged Media,

00:03:38.555 --> 00:03:46.575
beziehungsweise ich glaube, das läuft ja alles irgendwie unter dem Oberbegriff Fragmented Media.

00:03:46.795 --> 00:03:50.455
Also theoretisch ist ja sowas wie Multicolumn auch, fällt da ja auch rein.

00:03:50.655 --> 00:03:55.315
Also es geht ja immer um irgendwelche Layout-Konstellationen,

00:03:56.015 --> 00:03:59.815
wo es quasi eine Unterbrechung gibt und dann wird das irgendwo anders fortgesetzt.

00:03:59.815 --> 00:04:02.895
Und das können Spalten sein, das können Seiten sein.

00:04:04.175 --> 00:04:08.435
Das waren früher mal CSS-Regions. Theoretisch kann man mit dieser CSS-Property sagen,

00:04:09.515 --> 00:04:17.335
wenn dieses Element sozusagen in die Grenzregion fällt von so einem fragmentierten

00:04:17.335 --> 00:04:23.195
Layout-Block, dann bitte zerreiße es nicht in der Mitte,

00:04:24.155 --> 00:04:26.695
sondern versuche das eben möglichst zu verhindern.

00:04:27.555 --> 00:04:32.275
Also es kann trotzdem passieren, Aber man kann eben dann sagen Avoid.

00:04:33.075 --> 00:04:38.475
Und das kann man dann auch nochmal spezifizieren, ob das jetzt nur bei Page

00:04:38.475 --> 00:04:41.995
Break zu erweiden ist oder bei Column Break oder wie auch immer.

00:04:43.075 --> 00:04:46.695
Also zum Beispiel, wenn man jetzt irgendwie einen Absatz hat und man will auf

00:04:46.695 --> 00:04:50.855
jeden Fall, dass dieser Absatz mit der Überschrift zusammenhängt,

00:04:50.875 --> 00:04:54.635
dann könnte man jetzt spezifizieren, dass zwischen diesen beiden Elementen halt

00:04:54.635 --> 00:04:58.095
nicht gebrochen werden soll oder in einem darüber liegenden Element.

00:04:58.415 --> 00:05:03.235
Das wird dann auf die nächste Column geschoben, dann entsteht halt in der Column

00:05:03.235 --> 00:05:04.675
davor ein Whitespace oder so.

00:05:06.899 --> 00:05:10.699
Genau, also du müsstest die dann, müsstest die auf jeden Fall aber dann in einem

00:05:10.699 --> 00:05:14.979
Element gruppieren, damit das nicht passiert.

00:05:15.679 --> 00:05:19.739
Mein innerer Toll findet es ja sehr schade, dass es beim Break-Inside nur Avoid

00:05:19.739 --> 00:05:20.919
und seine Varianten gibt.

00:05:21.819 --> 00:05:24.859
Aber halt nicht so ein Mechanismus, um zu sagen, ja, immer bitteschön.

00:05:24.859 --> 00:05:29.219
Weil bei Break-Before und Break-After, den Kollegen kann man ja sagen, ja, immer Umbruch.

00:05:29.239 --> 00:05:32.479
Oder halt eben wie, keine Ahnung, ich glaube, das war es.

00:05:32.819 --> 00:05:35.899
Da gibt es auch nur Avoid und so Sachen wie Page und was nicht alles.

00:05:37.479 --> 00:05:41.739
Ja, das ist alles in der Theorie sehr, sehr sophisticated. Ich weiß nicht,

00:05:41.759 --> 00:05:44.599
wann ich zuletzt probiert habe, wirklich einen schönen Print-Style-Sheet zu machen.

00:05:46.799 --> 00:05:50.979
Naja, aber vielleicht hast du also ich denke so, wenn du Multicolumn benutzt,

00:05:51.079 --> 00:05:55.699
also ich halte Multicolumn ja eh für völlig underrated, also ich finde,

00:05:55.719 --> 00:05:57.339
das ist ein cooles Layout-Modul,

00:05:58.019 --> 00:06:02.719
das auch nochmal richtig gut geworden ist seit Chrome also Chrome hatte da irgendwie

00:06:02.719 --> 00:06:05.019
auch immer viele Bugs aber die haben ja dann ihre,

00:06:07.459 --> 00:06:09.639
Rendering NG, also Next Generation.

00:06:12.419 --> 00:06:16.319
Rendering Engine gebaut und die hat dann vielen Bugs aufgeräumt.

00:06:17.019 --> 00:06:19.619
Und seitdem ist Multicalm halt richtig gut.

00:06:20.999 --> 00:06:24.659
Und da brauchst du das schon mal. Da kann es schon mal passieren,

00:06:24.799 --> 00:06:28.959
dass dir irgendwelche Dinge in der Mitte zerreißen, wo du das vielleicht auch

00:06:28.959 --> 00:06:29.859
nicht so gerne möchtest.

00:06:30.099 --> 00:06:34.359
Aber dann mach doch mal den Case Pro Multicalm Layout, weil wann brauche ich

00:06:34.359 --> 00:06:37.399
das, wenn ich nicht gerade irgendwie eine Zeitungsseite baue,

00:06:37.499 --> 00:06:39.199
also eine Printzeitung? Ja.

00:06:40.369 --> 00:06:45.889
Naja, du kannst ja sowas machen wie, also das, was jetzt hier gerade stark diskutiert

00:06:45.889 --> 00:06:50.169
wird, also warum auch immer, aber so Masonry-Layout kannst du halt super damit machen.

00:06:51.409 --> 00:06:57.889
Okay. Gerade wenn du so Bildergalerien hast und wenn du da vielleicht dann irgendwelche

00:06:57.889 --> 00:07:00.329
Bildunterschriften oder Credits hast, also dann willst du ja auch nicht,

00:07:00.389 --> 00:07:03.469
dass die wegbreken in die nächste Column.

00:07:04.049 --> 00:07:11.149
Genau. Also du kannst halt manche Layouts nur mit Multicolumn hinbekommen,

00:07:11.229 --> 00:07:14.169
die du halt einfach mit Grid zum Beispiel nicht hinbekommst.

00:07:15.309 --> 00:07:22.169
Also ich denke, es ist nicht so mächtig wie Flex und Grid, aber es ist halt

00:07:22.169 --> 00:07:24.509
trotzdem noch ein cooler dritter Baustein.

00:07:24.889 --> 00:07:27.589
Aber nochmal, was ist denn das für ein Layout, dass ich mit Grid nicht hinbekomme?

00:07:27.929 --> 00:07:32.169
Weil so masonry-like, wenn halt auch nicht besonders flexibel,

00:07:32.229 --> 00:07:34.769
bekomme ich da ja auch hin, weil ich mir halt eben meinen Grid mache.

00:07:34.869 --> 00:07:37.569
Und ich kann ja meine Elemente alle so aufspannen und sagen,

00:07:37.649 --> 00:07:39.249
du gehst nach da, du gehst nach dort und so weiter.

00:07:39.369 --> 00:07:43.529
Naja, aber das funktioniert ja dann nicht mehr, wenn du jetzt zum Beispiel Bilder

00:07:43.529 --> 00:07:47.069
einkippst, die alle unterschiedliche Seitenverhältnisse haben.

00:07:48.429 --> 00:07:51.129
Ja, und vor allen Dingen halt nicht vorhersehbare Seitenverhältnisse,

00:07:51.229 --> 00:07:54.029
wenn ich jetzt also irgendwie mit Random Content rechnen muss.

00:07:54.029 --> 00:07:56.849
Das ist sozusagen dann der Case für Multicolumn-Layout.

00:07:57.489 --> 00:08:02.049
Genau, ja. Auch wenn du jetzt zum Beispiel ein vertikales Display-Flex hast,

00:08:02.209 --> 00:08:03.949
dann rappt das ja nicht automatisch.

00:08:04.029 --> 00:08:08.709
Also du musst es dann in der Höhe begrenzen. Und das ist wiederum auch blöd, weil ...

00:08:09.669 --> 00:08:13.349
Also außer du möchtest, dass das quasi immer weiter in der Horizontalen wächst.

00:08:13.429 --> 00:08:16.949
Aber im Grunde möchtest du ... Das möchtest du ja nicht. Du willst vielleicht

00:08:16.949 --> 00:08:20.709
irgendwie drei gleich lange Spalten haben.

00:08:20.849 --> 00:08:23.689
Aber du müsstest dann vorher wissen, wie hoch die sind. Und nur dann könntest

00:08:23.689 --> 00:08:24.949
du das mit Flex umsetzen.

00:08:27.613 --> 00:08:31.373
Ich hatte mal irgendwann, da müsste ich jetzt mal suchen, ich weiß nicht,

00:08:31.413 --> 00:08:37.713
ob ich das finde, der Bastian Allgäu, der wollte mal ein bestimmtes Layout-Verhalten

00:08:37.713 --> 00:08:41.593
haben für das Panel von Kirby.

00:08:43.333 --> 00:08:47.653
Und hatte dann, ich glaube auf Twitter war das gefragt, der hat es ja leider

00:08:47.653 --> 00:08:51.973
schon gelöscht, deswegen weiß ich gar nicht, ob man das hier überhaupt nochmal finden kann.

00:08:53.633 --> 00:08:59.173
Da hatte ich, also es ging halt auch mit Multicolumn und mit anderen Dingen

00:08:59.173 --> 00:09:00.673
nicht. Ah ja, doch, hier.

00:09:02.313 --> 00:09:05.873
Geh erfunden. Genau, jetzt ist natürlich nur seine Frage nicht da.

00:09:07.773 --> 00:09:14.733
Aber ich habe ein Code-Pen gepostet und vielleicht erschließt sich das da aus.

00:09:14.813 --> 00:09:18.333
Ich glaube, da ging es darum, dass, was war das denn? Ich öffne den mal.

00:09:21.613 --> 00:09:26.313
Genau, es waren sechs Elemente in drei Spalten und die sollen immer paarweise

00:09:26.313 --> 00:09:31.633
dann sich umlayouten und nicht einzeln, wenn sie zu viel werden.

00:09:31.733 --> 00:09:34.953
Und das ging halt nur mit Multicalum. Ah, okay, verstehe.

00:09:38.753 --> 00:09:45.873
Ah, okay. Das ist nicht schlecht, das verlinken wir mal für diejenigen unter

00:09:45.873 --> 00:09:49.133
uns, die das nochmal mal brauchen eines Tages. Sehr interessant.

00:09:49.513 --> 00:09:51.613
Okay. Bin überzeugt.

00:09:55.124 --> 00:10:02.724
Genau, und der Browser Support ist ja relativ gut mittlerweile hier von Break Insight.

00:10:02.864 --> 00:10:09.684
Also, weil früher war das ja so, wie du sagst, also wurde halt nicht unterstützt von den Browsern.

00:10:12.424 --> 00:10:16.284
Ja, Browser Support gut, ja, doch.

00:10:16.924 --> 00:10:22.984
Avoid Page können halt Firefox und Safari nicht. Nee, nur Safari kann das nicht. Ja, dann.

00:10:24.424 --> 00:10:29.164
Genau, aber Avoid können sie schon. Du kannst jetzt nur nicht eingrenzen auf,

00:10:30.024 --> 00:10:36.524
nur bei Page Avoiden, aber wenn es dir reicht, dass du generell Avoid nutzen kannst, dann,

00:10:38.204 --> 00:10:39.564
ist das ja auch schon mal was.

00:10:39.824 --> 00:10:42.544
Ja, oder halt eben Avoid Color. Das geht ja offenbar.

00:10:43.824 --> 00:10:45.144
Naja, ja, stimmt.

00:10:50.004 --> 00:10:55.164
Okay, nicht Nicht schlecht. Break in Zeit. Unterschätzt, aber wertvoll.

00:10:57.484 --> 00:11:00.984
Willst du das nächste drücken? Mach ich doch gerne. Achtung,

00:11:00.984 --> 00:11:04.624
Achtung. Ich aktiviere den Zufallszahlengenerator. Bitte zurücktreten.

00:11:07.064 --> 00:11:08.284
Uh. Uh.

00:11:12.104 --> 00:11:12.704
Huiuiui.

00:11:15.204 --> 00:11:22.784
Worum handelt es sich, Peter? Erzähl uns mal. Paint Order Attribut Gut für SVG-Elemente,

00:11:22.784 --> 00:11:29.064
wo man angeben kann, in welcher Reihenfolge gewisse Dinge gemalt werden.

00:11:29.304 --> 00:11:32.344
Also sowas wie, keine Ahnung, du hast irgendwie eine Füllung für das Element

00:11:32.344 --> 00:11:35.504
festgelegt, Hintergrund wird grün und dann kannst du das noch umranden.

00:11:35.504 --> 00:11:38.384
Und die Frage ist halt, soll die Umrandung unter dieser Füllung liegen oder

00:11:38.384 --> 00:11:41.724
auf der Füllung zum Beispiel? Und das kann man damit regulieren.

00:11:44.646 --> 00:11:48.006
So, und an die Hörerinnen und Hörer mal eben alle Hände hoch,

00:11:48.126 --> 00:11:51.886
die das schon mal benutzt haben. Mal melden kurz.

00:11:52.346 --> 00:11:56.346
Okay, ich sehe zwei, die melden sich aber mit jeweils beiden Händen,

00:11:56.366 --> 00:11:58.066
weil SVG halt so ein Thema ist.

00:12:04.426 --> 00:12:09.026
Der Adam Argeil, der hatte letztens ein schönes Beispiel, wo man das möchte.

00:12:09.346 --> 00:12:12.226
Ich such mal, genau hier, auch auf Twitter.

00:12:13.066 --> 00:12:20.366
Also wenn du Text hast mit Umrandung, der überlappt sich auch leicht, weil du quasi so ein,

00:12:20.506 --> 00:12:26.306
weil du sowas gemacht hast wie Letterspacing und das auf negative Werte gesetzt hast,

00:12:26.446 --> 00:12:30.306
dann, also dann überlappen sich die Buchstaben und dann ist es cool,

00:12:30.426 --> 00:12:38.146
wenn du erst die Outline hast und dann die Füllung und den Link werfe ich euch hier rein.

00:12:38.866 --> 00:12:43.206
Ja, das ist natürlich cool, aber dann hast du natürlich SVG und Text an dem

00:12:43.206 --> 00:12:47.226
Backen und das ist ja für sich genommen schon nicht unbedingt vergnügungssteuerpflichtig.

00:12:48.766 --> 00:12:52.746
Ja, das stimmt. Wobei es ja so ist, dass viele von den Sachen kannst du ja auch,

00:12:54.586 --> 00:12:55.986
außerhalb von SVG benutzen.

00:12:56.266 --> 00:13:01.326
Deswegen ist die Frage, also nicht alles, aber vieles und ich weiß nicht,

00:13:01.386 --> 00:13:03.506
wie das hier mit ist, ob das vielleicht sogar auch geht.

00:13:04.246 --> 00:13:10.866
Ich muss mal den Code-Pen hier öffnen. Also der Beschreibung nach scheint mir

00:13:10.866 --> 00:13:13.106
das recht SVG-spezifisch zu sein.

00:13:15.875 --> 00:13:20.175
Ja, der Beschreibung noch auf jeden Fall. Weil du als Values ja so Sachen angeben

00:13:20.175 --> 00:13:21.675
kannst wie Fill, Stroke und Markers.

00:13:22.055 --> 00:13:27.315
Und das sind ja tatsächlich SVG-spezifische Konstrukte, die du auch per CSS

00:13:27.315 --> 00:13:30.995
definieren kannst, aber die existieren nicht außerhalb von SVG.

00:13:33.095 --> 00:13:36.795
Wobei es gibt ja WebKit Text Stroke. Das kannst du ja machen.

00:13:37.075 --> 00:13:40.535
Das gibt's. Und das wird, glaube ich, auch von den anderen Browsern unterstützt.

00:13:41.035 --> 00:13:44.235
Aber das wird dann nicht hiervon mitgesteuert, würde ich annehmen.

00:13:44.235 --> 00:13:48.795
Da sehe ich jedenfalls nichts von. Warte mal. Müsste man mal ausprobieren. Spezifikation.

00:13:51.595 --> 00:13:57.035
In der Meantime kann ich ja mal sagen, zum Thema Browser Compatibility ist es

00:13:57.035 --> 00:14:03.175
natürlich herrlich, weil eigentlich bis auf die Mobile Browser ist man da sehr gut aufgestellt.

00:14:03.355 --> 00:14:08.295
Mobile Browser heißt in dem Fall Safari for iOS, unterstützt das Ganze nicht.

00:14:08.735 --> 00:14:12.935
Opera Android nicht und die Webview in Android auch nicht.

00:14:14.235 --> 00:14:20.635
Also gerade das Safari vor iOS ist wahrscheinlich bei vielen dann sozusagen

00:14:20.635 --> 00:14:24.135
der Killer an der Stelle. Ja.

00:14:53.135 --> 00:14:56.295
Zu bieten haben. Das ist generell ziemlich gruselig.

00:14:59.995 --> 00:15:03.995
Also, immer wenn ich halt Du meinst sowas wie Preview oder so auf Mac jetzt

00:15:03.995 --> 00:15:08.075
zum Beispiel oder irgendein anderes Betrachtungsprogramm.

00:15:08.195 --> 00:15:11.175
Genau, oder was immer ich hier auf meinem Linux hab, was halt eben so mitinstalliert

00:15:11.175 --> 00:15:14.555
ist bei der Standard Dings, wo ich halt irgendwie auf JPEG doppelt draufklicken

00:15:14.555 --> 00:15:16.495
kann, dann geht das halt in so ein Ding auf und dann kann ich es mir angucken

00:15:16.495 --> 00:15:19.935
und irgendwie rotieren und halt so basale Bearbeitungsschritte machen.

00:15:20.755 --> 00:15:23.655
Oder halt eben mir auch nur angucken, je nachdem, was für eine Geschmacksrichtung

00:15:23.655 --> 00:15:27.335
man da hat. Also halt die vorinstallierten Dinger, um die sich halt eben keiner

00:15:27.335 --> 00:15:28.655
kümmert, weil die sind halt eben einfach da.

00:15:31.231 --> 00:15:34.431
Und das ist halt generell alles recht grauslich.

00:15:37.571 --> 00:15:43.071
Also wir merken aber auch da, eigentlich ist es nicht so unser Nummer-eins-Anwendungsfall.

00:15:43.851 --> 00:15:47.171
Ich würde nur generell einfach sagen, wer irgendwie sich denkt,

00:15:47.231 --> 00:15:50.771
ich will eine Grafik malen und oh, ich mache es mit SVG, ist halt öfter mal

00:15:50.771 --> 00:15:54.391
so ein Fall von, dann hast du zwei Probleme an der Backe, wo du vorher nur eins hattest.

00:15:55.131 --> 00:15:57.811
Was man halt wirklich sehr gut machen kann, ist, man nimmt einfach einen Browser

00:15:57.811 --> 00:16:03.431
und lässt den halt eben mit einer Kombination aus SVG und allem anderen,

00:16:03.511 --> 00:16:07.191
was der Browser so kann, an CSS und sonstigen Geschichten, ein Bild bauen.

00:16:08.291 --> 00:16:10.891
Und dann nimmt man halt eben das, weil das kann man auch skalierbar machen,

00:16:10.951 --> 00:16:13.911
wenn man will. Das existiert dann nur im Browser, aber das hätte das SVG auch getan.

00:16:14.251 --> 00:16:17.231
Oder man skriptet sich mit Papettier dann so ein Ding, was ein Screenshot macht,

00:16:17.311 --> 00:16:18.991
dann hat es halt eine Rastergrafik, eine sehr schöne.

00:16:19.851 --> 00:16:24.211
Das geht eigentlich sehr gut. Also zum Malen ist CSS und Divs auch ganz gut geeignet.

00:16:24.271 --> 00:16:28.351
Da kann man SVG mit drin benutzen, Wenn man halt mal einen Pfad braucht oder so.

00:16:28.531 --> 00:16:31.651
Aber das sollte sich meines Erachtens nicht immer alles um SVG drehen.

00:16:31.751 --> 00:16:34.391
Dafür ist das zu seltsam. Für viele Aufgaben.

00:16:37.071 --> 00:16:40.331
Ah, WebKit Text Stroke hieß es. Ich habe gerade schon gegoogelt und nicht gefunden,

00:16:40.451 --> 00:16:44.511
wie es heißt. Genau, das wird von den anderen Browsern auch unterstützt.

00:16:44.531 --> 00:16:52.491
Die haben ja vieles sozusagen, also viele eigene WebKit-Sachen unterstützen,

00:16:52.571 --> 00:16:54.291
die dann ja mit WebKit-Prefix,

00:16:54.391 --> 00:16:57.571
weil irgendwann war es ja so, dass die Leute einfach keinen Mods davor gemacht

00:16:57.571 --> 00:17:01.371
haben und es war immer WebKit und die Browser konnten es zwar,

00:17:01.491 --> 00:17:06.811
aber niemand hat es mit den entsprechenden Vendor-Prefixen dann genutzt.

00:17:06.811 --> 00:17:10.511
Und darum haben die gesagt, ach komm, wir unterstützen einfach jetzt auch WebKit.

00:17:11.471 --> 00:17:15.771
Und wenn ihr hier in die Examples geht von der Paint-Order-Geschichte,

00:17:15.851 --> 00:17:19.971
dann kommt erst diese SVG-Geschichte und dann, wenn ihr ein bisschen runterscrollt,

00:17:20.011 --> 00:17:26.111
dann seht ihr, dass die auch eben das Gleiche machen mit WebKit-Text-Stroke.

00:17:27.131 --> 00:17:28.351
Also auch da geht das.

00:17:30.491 --> 00:17:35.971
Ja. Oh, wie ist schön. Die Spezifikation, wo dieses WebKit-Text-Stroke festgehalten

00:17:35.971 --> 00:17:38.831
ist, ist auch ein Spezifikationsdokument.

00:17:39.511 --> 00:17:44.931
Das Kompatibilitäts-Spezifikationsdokument. Und alle Punkte da drin fangen mit

00:17:44.931 --> 00:17:47.011
Strich WebKit an. Super.

00:17:48.231 --> 00:17:54.951
Nee, auch nicht. So hier Event-Händler auf dem Window-Objekt on Orientation Change. Aha, okay.

00:17:56.891 --> 00:18:02.491
Interessant. Interessant, aber das meiste sind WebKit CSS-Geschichten. Sehr schön.

00:18:05.411 --> 00:18:07.971
Sachen gibt's. Okay.

00:18:09.790 --> 00:18:12.870
Soll ich drücken? Ich wollte gerade sagen, Schleppe, frei uns aus den Klauen

00:18:12.870 --> 00:18:15.970
von CSS, mach mal irgendwie was, was so für richtige Entwicklungen gibt.

00:18:17.450 --> 00:18:21.870
SVG, wir haben ja auch gesagt, also ab Folge 600 wollen wir ja der SVG-Podcast

00:18:21.870 --> 00:18:24.990
werden, deswegen das war ja Pflicht.

00:18:26.010 --> 00:18:30.050
Hoffen wir, dass jetzt noch eine Eigenschaft von SVG um die Ecke kommt,

00:18:30.130 --> 00:18:33.030
sonst werden wir auch bitter enttäuscht, glaube ich. Ja, da müssen wir es schon machen.

00:18:33.190 --> 00:18:35.870
Ich gebe mir Mühe. Ja, bitte. Oh.

00:18:37.130 --> 00:18:38.330
Wir haben es geschafft.

00:18:39.730 --> 00:18:48.530
Herrlich. Wie geht's weiter? Es liest sich sehr langweilig. Es geht um das onUnload-Attribut.

00:18:49.290 --> 00:18:52.110
Also für in SVG allerdings.

00:18:52.970 --> 00:18:56.830
Und tatsächlich hat MDN auch da nicht mal eine Seite dafür.

00:18:57.910 --> 00:19:02.230
Genau. Ja, vielleicht drück ich nochmal, oder? Also onUnload.

00:19:03.250 --> 00:19:05.810
Ja, funktioniert nicht. Wir könnten das höchstens als Aufhänger nehmen,

00:19:05.970 --> 00:19:10.530
um uns über onUnload auszulassen. Generell, das könnten wir tun.

00:19:10.890 --> 00:19:19.630
Also nicht im SVG-Space, sondern halt grundsätzlich auf onUnload auf Document. Genau.

00:19:21.010 --> 00:19:24.290
Auf Window ist das, oder? Window ist das, ja. Hast du recht.

00:19:26.910 --> 00:19:30.430
Wobei, dann wäre es ja gar kein Attribut mehr. Also ich will jetzt gerade mal

00:19:30.430 --> 00:19:34.850
wirklich wissen, ob das ein Content-Attribut onUnload gibt auf dem SVG.

00:19:35.130 --> 00:19:38.610
Weil das normale Normaler Unload-Event ist ja tatsächlich auf dem Window.

00:19:38.770 --> 00:19:41.550
Und das Window ist ja kein HTML-Element, also kann ich da kein Content-Attribut

00:19:41.550 --> 00:19:43.170
mit HTML draufschreiben.

00:19:44.530 --> 00:19:47.210
Also muss das hier ja schon irgendwas Spezielles sein. Warte mal.

00:19:48.410 --> 00:19:50.990
SVG on Unload. Dinge, die noch niemals jemand gegoogelt hat.

00:19:51.930 --> 00:19:54.130
Super. Brandneue Erkenntnisse hier.

00:19:57.250 --> 00:20:00.790
On Unload muss ich auch googeln, nicht on Unload. Meine Güte,

00:20:00.810 --> 00:20:02.370
diese Namensfindung auch, ne? Ja.

00:20:07.318 --> 00:20:12.058
Objekt-Tag, Cookie-Banner, geh weg. Guck mal hier.

00:20:12.258 --> 00:20:17.438
In addition to the window interface, the event-handler property on unload is

00:20:17.438 --> 00:20:19.398
also available on the following targets.

00:20:20.098 --> 00:20:24.778
HTML-Body-Element, HTML-Frameset-Element, SVG-SVG-Element.

00:20:27.178 --> 00:20:32.258
Also kannst du es sogar an den Body dran kleben, ja, und dann delegiert dir

00:20:32.258 --> 00:20:37.198
das wahrscheinlich sozusagen so ein bisschen, also nach wie vor hoch, oder?

00:20:37.578 --> 00:20:40.578
Hat ja den gleichen Effekt, ist ja genauso, wie wenn du dem Body eine Hintergrundfarbe

00:20:40.578 --> 00:20:43.918
gibst und du hast kein Content an der Seite, ist der Body ja irgendwie vier

00:20:43.918 --> 00:20:46.818
Pixel hoch und trotzdem ist die ganze Seite mit der Hintergrundfarbe versehen.

00:20:46.858 --> 00:20:50.178
Also da passieren ja eh seltsame Sachen an der Grenzschicht.

00:20:52.738 --> 00:20:56.978
Jetzt sprechen wir aber doch mal über Unload. Grundsätzlich ist das Thema ja

00:20:56.978 --> 00:20:58.918
sehr prekär, sage ich mal.

00:20:59.058 --> 00:21:03.538
Also zum einen ist es deprecated und zum anderen werden Werden Developer dazu

00:21:03.538 --> 00:21:06.878
angehalten, das Unload-Event nicht zu benutzen?

00:21:07.138 --> 00:21:11.218
Ich glaube, wir kennen es alle. Man möchte gern verhindern, dass man die Seite

00:21:11.218 --> 00:21:16.398
schließt oder dass der Benutzer irgendwas verliert, was man vielleicht gerade

00:21:16.398 --> 00:21:18.758
reingehackt hat oder die Benutzerin.

00:21:19.218 --> 00:21:23.658
Und man hat vergessen, dass man da gerade was macht oder im Hintergrund läuft

00:21:23.658 --> 00:21:25.478
noch ein asynchroner Request oder so.

00:21:25.798 --> 00:21:32.038
Und man möchte die Benutzer einfach warnen, hey, vielleicht wartest du noch eine Sekunde.

00:21:32.618 --> 00:21:36.078
Und dafür benutzt man ja meistens das Unload-Event.

00:21:37.658 --> 00:21:42.798
Genau, wobei ich nicht weiß, also ich habe dafür traditionell immer das Before-Unload-Event

00:21:42.798 --> 00:21:50.238
genommen, wo du ja quasi ein Prevent-Default oder ein False-Return kannst oder sowas.

00:21:50.318 --> 00:21:54.658
Ja, genau, ich glaube, wenn du ein False-Return hast, dann cancelst du das Unloaden, ja.

00:21:55.258 --> 00:21:58.538
Ja, oder bei Prevent-Default auch, ist beides das Gleiche. Ja,

00:21:58.578 --> 00:22:03.558
genau. Genau, und ich vermute mal, also ich habe das Unload eben dann,

00:22:04.318 --> 00:22:06.338
irgendwie habe ich das nie benutzt, ich habe immer Before Unload genommen.

00:22:06.578 --> 00:22:10.878
Ich vermute mal, bei Unload ist es dann zu spät. Also da kann man das wahrscheinlich gar nicht mehr.

00:22:11.518 --> 00:22:17.198
Aber ich nehme an, dass man das Event vielleicht nutzen wollte,

00:22:17.378 --> 00:22:21.378
um noch schnell Daten irgendwie wegzuspeichern oder sowas.

00:22:21.998 --> 00:22:26.078
Was aber natürlich auch nicht klappt, außer man benutzt die.

00:22:27.698 --> 00:22:36.578
Beacon API, das ist ja so eine Art quasi kleines Geschwisterchen von Fetch das

00:22:36.578 --> 00:22:38.358
nur Postdaten verschicken kann,

00:22:39.831 --> 00:22:46.071
Und ich glaube auch nur relativ einfach gestrickte und auch nur in einer gewissen Maximalgröße.

00:22:46.111 --> 00:22:52.311
Aber da kann man sozusagen doch Daten abfeuern und die finden ihren Weg ins

00:22:52.311 --> 00:22:54.511
Ziel, auch wenn der Browser geschlossen wird.

00:22:56.511 --> 00:23:01.751
Aber dennoch sagt man mittlerweile, dass man diese beiden Events lieber nicht

00:23:01.751 --> 00:23:06.491
mehr benutzt, weil es gibt Szenarien, speziell auf mobilen Geräten,

00:23:06.651 --> 00:23:09.211
wo die gar nicht die Gelegenheit haben,

00:23:09.831 --> 00:23:13.571
dieses Event zu feuern, weil man zum Beispiel so ein Task-Switching durchführt

00:23:13.571 --> 00:23:19.311
und dann schließt man die Seite zwar nicht, aber wenn man dann in seinem Task-Overview

00:23:19.311 --> 00:23:21.351
den Browser schließt oder so,

00:23:21.891 --> 00:23:25.411
dann ist der ja nicht aktiv, das ist ja im Grunde nur so ein eingefrorener Screenshot

00:23:25.411 --> 00:23:29.891
von dem Browser und der kann dann nicht irgendwie noch schnell zum Leben erwachen,

00:23:30.611 --> 00:23:34.251
und diese Unload-Event oder Before-Unload feuern.

00:23:35.771 --> 00:23:40.491
Das heißt aber in der Regel, also jetzt mal für Desktop Stop Browser gesprochen

00:23:40.491 --> 00:23:46.451
oder sag ich mal, wenn die Seite über wirklich, ich möchte dieses Tab schließen,

00:23:46.451 --> 00:23:50.371
geschlossen werden würde, könnte man weiterhin Before Unload,

00:23:51.511 --> 00:23:55.191
verwenden, weil das ist nicht deprecated und wird von Browsern unterstützt,

00:23:55.251 --> 00:23:56.451
soweit ich das verstehe.

00:23:57.191 --> 00:24:00.511
Aber es wird halt davon abgeraten aus dem genannten Grund.

00:24:00.991 --> 00:24:05.831
Genau, aus dem Grund und was auch ein Problem ist, ist es gibt,

00:24:05.931 --> 00:24:09.871
also in anderen Browsern gibt es das schon länger, also in Firefox und Safari,

00:24:10.071 --> 00:24:11.491
die haben so einen Back-Forward-Cache.

00:24:12.971 --> 00:24:21.191
Wo die den State einer Seite einfrieren und den erhalten, wenn du weiter navigierst.

00:24:21.311 --> 00:24:24.831
Und wenn du dann den Back-Button drückst, dann ist die sofort da in dem gleichen

00:24:24.831 --> 00:24:28.171
State, in dem du sie verlassen hast. Also da wird dann nicht noch mal neu gepasst und alles.

00:24:29.131 --> 00:24:32.871
Und Chrome hat das jetzt nach langer Zeit auch nachgerüstet,

00:24:32.871 --> 00:24:36.691
vor einem halben Jahr oder Jahr. Vielleicht ist es schon ein Jahr her, glaube ich.

00:24:37.131 --> 00:24:41.671
Aber es gibt eben so bestimmte Dinge, die dürfen auf so einer Seite nicht stattfinden,

00:24:41.851 --> 00:24:42.651
damit das funktioniert.

00:24:42.891 --> 00:24:47.351
Und das ist unter anderem eben die Verwendung dieser Event-Händler. Mhm.

00:24:48.437 --> 00:24:53.817
Das heißt, jeder, der den hat, auf der Seite, da ist es dann halt,

00:24:53.857 --> 00:24:56.397
hat man halt Pech gehabt und dann wird es halt nicht so gecached,

00:24:56.497 --> 00:24:57.917
sondern wird komplett einmal gepasst.

00:24:58.357 --> 00:25:02.137
Genau, und das kann man auch in den Dev-Tools, ich überlege,

00:25:02.177 --> 00:25:06.677
glaube ich, in dem Application-Tab, da kann man das auch debuggen,

00:25:06.777 --> 00:25:08.297
also ob der Backforward-Cache,

00:25:08.437 --> 00:25:13.357
der BF-Cache, ob der eben sagt so, hey, cool, die Seite,

00:25:13.517 --> 00:25:16.557
mit der kann ich arbeiten, oder, oh nee,

00:25:16.757 --> 00:25:20.457
die hat das und das Problem, deswegen kann ich hier nicht arbeiten.

00:25:21.877 --> 00:25:26.377
Hm, sehr cool. Ja, das ist gut zu wissen, wie man sowas auch mal debuggen kann.

00:25:28.817 --> 00:25:32.297
Ja, generell würde ich aber auch herausstellen wollen, dass so die Idee hinter

00:25:32.297 --> 00:25:35.197
Unload halt auch eine, sagen wir mal, etwas, glaube ich, archaische ist.

00:25:35.297 --> 00:25:38.577
Das ist ja so wie früher die Frage, wie oft am Tag gehen sie online? Online.

00:25:39.957 --> 00:25:42.477
Also was der Chef da ja beschrieben hat mit den mobilen Browsern,

00:25:42.537 --> 00:25:44.517
man macht ja selten den Tab zu,

00:25:44.677 --> 00:25:48.137
bei den meisten Tab-Messies ist es da ja gerade auf Mobile so,

00:25:48.257 --> 00:25:52.497
dass der halt einfach irgendwann, also de facto halt eingefroren wird,

00:25:52.577 --> 00:25:56.857
weil einfach eh niemand mehr aufruft, aber er ist ja niemals dann wirklich geschlossen worden,

00:25:56.997 --> 00:25:59.977
aber er hat sich halt faktisch aus der Realität entfernt.

00:26:00.717 --> 00:26:06.017
Das heißt irgendwie zu sagen, das Unload, wenn es feuert oder bevor Unload, wenn es feuert,

00:26:06.557 --> 00:26:09.437
kann man sich halt nicht darauf verlassen, dass sozusagen, dass dann wirklich

00:26:09.437 --> 00:26:12.877
alle Instanzen von Nutzer oder Nutzerin verwendet das Ding nicht mehr,

00:26:12.957 --> 00:26:16.017
dass das eingefangen wird. Das ist, glaube ich, halt echt vorbei.

00:26:17.056 --> 00:26:20.096
Aber auf der anderen Seite zum Beispiel, wo ich das öfter mal bekomme,

00:26:20.116 --> 00:26:25.636
ist bei sowas wie beispielsweise Gmail oder so, wenn ich das Interface halt

00:26:25.636 --> 00:26:27.536
online verwende und dann,

00:26:27.616 --> 00:26:31.676
also was eigentlich mein Standard-Use-Case ist und dann refreshe ich irgendwie

00:26:31.676 --> 00:26:34.496
oder navigiere aus Versehen weg,

00:26:34.596 --> 00:26:38.376
aus welchen Gründen auch immer und bin aber gerade in einem Draft,

00:26:38.456 --> 00:26:42.776
der irgendwie noch nicht gespeichert ist, dann bekomme ich da mal eine Fehlermeldung,

00:26:43.236 --> 00:26:47.056
oder gesagt, hey, willst du das wirklich tun? Ach so, ja, danke, das ist ja super nett.

00:26:47.436 --> 00:26:50.356
Ja, aber das ist... Nee, will ich natürlich nicht. Aber das ist halt auch wirklich

00:26:50.356 --> 00:26:52.716
ein UI, das benutzt du im Desktop-Modus.

00:26:53.096 --> 00:26:56.256
Also, und das wissen die auch, die das gebaut haben, dass das niemand in einem

00:26:56.256 --> 00:27:01.656
Szenario verwendet, wo dieses de facto schließen durch vergessen passieren kann. Ja, ja, genau.

00:27:02.156 --> 00:27:06.476
Und da wäre es aber wahrscheinlich auch kein Problem, weil die meisten Use Cases

00:27:06.476 --> 00:27:12.156
bei sowas, also beziehungsweise der Use Case, du hast irgendwas dann nicht automatisiert gespeichert,

00:27:12.196 --> 00:27:15.956
also es wird halt gerade noch es besteht gerade noch die Verbindung zwischen

00:27:15.956 --> 00:27:20.896
deinem Client und dem Server und es dauert halt ausnahmsweise mal drei Sekunden

00:27:20.896 --> 00:27:23.916
oder so, das passiert halt,

00:27:24.036 --> 00:27:28.316
also passiert bei Mobile ja dann auch nicht, wenn das dann in diesen.

00:27:30.036 --> 00:27:34.216
Gefrorenen Status irgendwann kommt, das Tab, weil dann synkt es ja im Hintergrund

00:27:34.216 --> 00:27:38.456
weiter weil der Browser halt offen ist und die drei Sekunden sind irgendwann

00:27:38.456 --> 00:27:42.116
um also musst du gar nicht mehr dem Benutzer der Benutzerin sagen, hier,

00:27:42.596 --> 00:27:48.156
ist was irgendwie, was sich noch nicht gesynct hat, weil es halt de facto nicht passiert.

00:27:49.696 --> 00:27:53.096
Ja, ich meine, dafür hast du andere, sagen wir mal, Umstände des Schließens,

00:27:53.176 --> 00:27:55.616
die nicht antizipiert werden können, wie hups, die Batterie ist leer.

00:27:57.216 --> 00:28:04.256
True. Und da kann man auch kein on before unload mehr feiern, sage ich mal.

00:28:04.516 --> 00:28:07.436
Ich glaube nicht, die Batterie sagt dem Chrome Bescheid so, jetzt ist Sense.

00:28:07.436 --> 00:28:10.656
Oder ich meine, wahrscheinlich macht es das irgendwie bei den schlaueren Dingen,

00:28:10.736 --> 00:28:12.576
die sich dann ja automatisch runterfahren und hast du nicht gesehen,

00:28:12.696 --> 00:28:17.696
aber ich will nur sagen irgendwie so, dieses Schließen ist glaube ich ein komplizierterer Prozess,

00:28:17.876 --> 00:28:21.196
wenn man anfängt darüber nachzudenken, als man so im ersten Moment meinen möge.

00:28:24.096 --> 00:28:29.676
Alright. Also was man benutzen soll, ist halt das Page-Hide-Event idealerweise.

00:28:30.736 --> 00:28:35.496
Das hat nichts mit der Sichtbarkeit zu tun, also eigentlich ist es auch falsch benannt.

00:28:35.496 --> 00:28:43.756
Das ist aber auch ein Event in diesem Page-Lifecycle wo quasi die alte Darstellung

00:28:43.756 --> 00:28:46.196
oder die Darstellung der Seite,

00:28:46.816 --> 00:28:52.876
der bisherigen Seite weggenommen wird und das kann aber dann die kann dann immer

00:28:52.876 --> 00:28:56.456
noch in einem Back-Forward-Cache liegen aber ist ja dann eben nicht mehr zu sehen,

00:28:57.216 --> 00:29:04.196
und das Event ist dann besser geeignet heutzutage als die Unload- und Before-Unload-Events.

00:29:10.878 --> 00:29:16.258
Okay, dann neues SVG-Thema. Jetzt ist der Hans wieder dran.

00:29:16.658 --> 00:29:22.578
Ich bin wieder dran und ich drücke mal auf den Knopf und es kommt mal kein SVG-Thema

00:29:22.578 --> 00:29:28.258
raus, sondern es kommt MIDI-Access dabei rum. So.

00:29:29.358 --> 00:29:32.498
The MIDI-Access Interface of the Web MIDI API.

00:29:43.618 --> 00:29:46.158
Die Beziehung zu diesen Geräten. Fällt da nicht ein Wort? Tu,

00:29:46.158 --> 00:29:51.438
müsste doch da eigentlich noch was. Das fehlt nicht, weil es geht um nur das Auflisten.

00:29:53.238 --> 00:29:57.658
Ah, Listing. Aha. Nicht Listening.

00:29:58.278 --> 00:30:02.558
Ich habe mich einfach verlesen. ja, ideal,

00:30:02.898 --> 00:30:07.978
also man kann einfach sich MIDI-Geräte anzeigen lassen, also was hast du eigentlich

00:30:07.978 --> 00:30:12.138
für einen Zugriff auf welche MIDI-Geräte in deinem Browser gerade,

00:30:12.418 --> 00:30:19.858
also keine Ahnung, wenn du da jetzt drei Devices connected hast, wie irgendwelche.

00:30:22.098 --> 00:30:26.798
Hier Keyboards oder zählen theoretisch auch Mikrofone dazu?

00:30:28.478 --> 00:30:33.678
Nee, Mikrofone nicht aber, äh, naja, traditionell auch, äh, waren ja Joysticks

00:30:33.678 --> 00:30:38.178
auch über die MIDI-Schnittstelle verbunden. Ich weiß aber gar nicht,

00:30:38.258 --> 00:30:41.058
also, heutzutage hat man ja keine MIDI-Schnittstelle mehr.

00:30:41.118 --> 00:30:46.718
Ich weiß nicht, ob die dann emuliert wird oder sowas, äh, unten drunter. Aber ich...

00:30:48.204 --> 00:30:52.564
I don't know. Naja, aber ich meine, es gibt ja auch die Web Serial API.

00:30:52.664 --> 00:30:56.404
Hast du an deinem Rechner noch irgendwie einen so oldschool Serial Port?

00:30:57.804 --> 00:31:00.804
Ja, vielleicht ist es natürlich für so Point-of-Sales Geschichten,

00:31:00.844 --> 00:31:05.144
also wo du so Hardware hast, die noch auf solche Schnittstellen zurückgreift

00:31:05.144 --> 00:31:11.124
und du willst dann eben Desktop-like Software schreiben dafür, aber das ist richtig.

00:31:11.604 --> 00:31:14.424
Also so Industriecomputer haben das ja gerne noch, wenn du die irgendwie an

00:31:14.424 --> 00:31:18.544
so eine echte Hardware anschließen willst, aber die haben dann doch wiederum

00:31:18.544 --> 00:31:20.504
in aller Regel kein MIDI-Interface.

00:31:21.804 --> 00:31:27.344
Nee. Also ich weiß es gar nicht. Ich weiß nicht, vielleicht wissen unsere Hörerinnen

00:31:27.344 --> 00:31:33.024
und Hörer ja, wo man die Web-MIDI-API nutzt heutzutage.

00:31:33.364 --> 00:31:36.724
Also so Point-of-Sale-Dinger und so Industriecomputer haben das tatsächlich nicht.

00:31:36.864 --> 00:31:42.804
Das weiß ich, weil da gibt es einen sehr schönen YouTuber, Cathodray Butte,

00:31:42.924 --> 00:31:47.104
der hat daraus im Prinzip eine Serie gemacht, dass der der so Industrie-PCs,

00:31:47.144 --> 00:31:48.884
die halt irgendwie so 10 plus Jahre alt sind,

00:31:49.304 --> 00:31:51.864
hernimmt und zerlegt und sich diese ganzen absurden Sachen anschaut,

00:31:51.884 --> 00:31:56.844
die man da so drin findet, wie irgendwie so Serial-Ports, die RJ45-Stecker haben

00:31:56.844 --> 00:31:59.204
und lauter so Kram. Also abgefahrenes Zeug.

00:31:59.564 --> 00:32:03.024
Und das habe ich mir letztens mal alles angeschaut. Und deswegen weiß ich,

00:32:03.024 --> 00:32:04.804
dass es MIDI-Ports da nicht gibt.

00:32:04.944 --> 00:32:07.684
Aber alles andere Mögliche verlinken wir mal natürlich.

00:32:08.264 --> 00:32:09.644
Aber ja, ansonsten würde mir

00:32:09.644 --> 00:32:13.864
nur einfallen, dass du wahrscheinlich dir USB-MIDI-Adapter holen kannst.

00:32:13.864 --> 00:32:17.704
Und dann kannst du dann wirklich, also als Komponist, Musiker,

00:32:17.704 --> 00:32:27.084
kannst halt dann dein Keyboard anschließen und steuerst dann mit dem Keyboard deine Audio-App,

00:32:27.244 --> 00:32:30.004
die du hast und die dann wahrscheinlich im Browser laufen müsste.

00:32:30.124 --> 00:32:34.644
Also ich weiß nicht, welche das dann sind, aber ...

00:32:40.949 --> 00:32:47.109
Genau, Unterstützung gibt es sogar im Firefox, interessanterweise.

00:32:47.469 --> 00:32:54.269
Ich dachte, das wäre so eine reine Chromium-Geschichte, so wie hier das serielle

00:32:54.269 --> 00:32:55.809
Schnittstelle und USB auch.

00:32:56.829 --> 00:32:59.149
Also dachte ich zumindest, nur Chromium wäre.

00:33:00.949 --> 00:33:05.629
Also die Frage ist, kann man das irgendwie rausfinden? Wo kriege ich jetzt Hardware her, die das kann?

00:33:06.709 --> 00:33:08.909
Weil das könnte ja alles Fake News sein, dass die das können.

00:33:09.269 --> 00:33:10.649
Und niemand hat es hier ausprobiert.

00:33:13.609 --> 00:33:15.369
Ja, da müsste man wahrscheinlich,

00:33:17.429 --> 00:33:24.209
Musiker oder VJs fragen. Zum Beispiel den Tim Petruski, der wäre jetzt wahrscheinlich

00:33:24.209 --> 00:33:25.429
jemand, den man fragen könnte.

00:33:25.969 --> 00:33:29.689
Ah ja, guck, und da kriegt man auch tatsächlich allerlei Kabelgedöns für gar

00:33:29.689 --> 00:33:33.229
nicht mal so teuer bis sehr teuer. Okay, geht eigentlich.

00:33:34.909 --> 00:33:35.789
Gibt's reichlich.

00:33:37.529 --> 00:33:38.049
Tatsächlich.

00:33:40.309 --> 00:33:43.349
Gameport-Schnittstelle, Elektronik-Kompendium, sehr schön.

00:33:46.949 --> 00:33:50.309
Ist alles sehr faszinierend. Weiterwürfeln?

00:33:51.389 --> 00:33:53.669
Weiterwürfeln, ja. Ich gucke noch ganz schnell aus Interesse,

00:33:53.709 --> 00:33:58.669
wollte ich gucken, wie das bei WebUSB ist, ob das einen Browser unterstützt,

00:33:58.669 --> 00:34:01.509
also ob das der Firefox unterstützt, meine ich, nee, das macht der nicht.

00:34:01.509 --> 00:34:06.129
Ich glaube nicht, ich glaube, da sind sie wirklich der Meinung, dass das alles etwas,

00:34:09.709 --> 00:34:14.229
Es ist ja etwas riskant. Also USB, weiß ich nicht.

00:34:15.389 --> 00:34:21.969
Aber es gibt ja auch mittlerweile so Designungsfälle, wo du eben mit einem Chromium-Browser

00:34:21.969 --> 00:34:25.269
kannst du die Firmware flashen über die USB-Schnittstelle.

00:34:25.429 --> 00:34:28.729
So was ist halt schon ganz cool.

00:34:29.069 --> 00:34:32.869
Das ist ganz cool, wenn du das ausgelöst hast und möchtest.

00:34:33.769 --> 00:34:37.829
Ja. Wenn du auf OK gedrückt hast, weil da jemand dir gesagt hat,

00:34:37.909 --> 00:34:39.629
klicke hier, um Facebook zu hacken,

00:34:41.993 --> 00:34:44.553
Weißt du, da kannst du viel mehr Schaden mit anrichten, als einfach nur deine

00:34:44.553 --> 00:34:48.693
Account-Details klauen oder so, was du halt früher gemacht hast. Ja.

00:34:50.953 --> 00:34:55.993
Das stimmt wohl. Ja, also schwierig. Schwieriges Thema.

00:34:59.293 --> 00:35:03.013
Okay, wer soll würfeln? Bin ich mit Würfeln dran? Ja. Okay.

00:35:03.753 --> 00:35:08.073
Würfeln, würfeln, würfeln. Ich würfel und wir kommen an bei der Location-API.

00:35:13.153 --> 00:35:15.553
Hat die in letzter Zeit irgendwelche Neuerungen erfahren?

00:35:18.833 --> 00:35:20.613
Weiß ich nicht. Sie hat so viele APIs.

00:35:26.713 --> 00:35:30.913
Also das Einzige, was ich darüber weiß, ist, man kann das Ding direkt toString

00:35:30.913 --> 00:35:34.413
machen und dann kriegst du die URL der Page raus.

00:35:34.673 --> 00:35:38.053
Da musst du nicht in den Unterproperties rumprökeln. Das ist ganz praktisch.

00:36:07.693 --> 00:36:10.313
Um das das, ja, also, das ist halt

00:36:10.313 --> 00:36:12.753
das Interface, aber Window-Location implementiert ja dieses Interface.

00:36:14.373 --> 00:36:19.313
Genau, und ich mache aber keinen toString, weil ich das meistens irgendwo reinstecke,

00:36:19.393 --> 00:36:25.533
wo ein implizites toString erforderlich ist, und dann funktioniert das. Ja, quasi.

00:36:29.833 --> 00:36:33.753
Auf der anderen Seite braucht man wohl toString auch gar nicht,

00:36:33.773 --> 00:36:37.193
weil man .href einfach verwenden könnte, als Property, oder?

00:36:39.093 --> 00:36:41.853
Ja, aber dann kannst du ja den Code lesen. Weißt du, wenn du das einfach in

00:36:41.853 --> 00:36:44.453
die String-Funktion reinsteckst oder plus leerer String machst,

00:36:44.653 --> 00:36:47.733
dann weiß keiner, was vor sich geht und du kriegst denselben Effekt erzeugt.

00:36:48.973 --> 00:36:54.853
Und ich sehe gerade, es gibt eine Assign-Methode, wo man eine neue URL dann

00:36:54.853 --> 00:37:01.353
reinstecken kann und dann lädt der Browser diese Seite und dann denke ich so, hä?

00:37:02.313 --> 00:37:06.653
Da habe ich immer Window Location gleich, glaube ich, gemacht.

00:37:08.333 --> 00:37:12.893
.htref oder so. Ich glaube nicht mal. Wahrscheinlich habe ich nicht mal das gemacht.

00:37:13.293 --> 00:37:17.353
Und dann gebe ich halt die neue URL und dann macht er das auch. Ja.

00:37:19.913 --> 00:37:24.873
Und da denke ich mir, hm, wofür brauche ich denn dann Assign?

00:37:25.973 --> 00:37:27.373
Und Replace gibt es auch noch.

00:37:29.013 --> 00:37:33.213
Weiß nicht. Also vielleicht willst du das haben, weil du das auch in Form von,

00:37:35.453 --> 00:37:38.893
einer Funktion haben willst, aus irgendwelchen Gründen.

00:37:42.218 --> 00:37:48.038
Und es gibt hier die Replace-Method. The replace-Method replaces the current

00:37:48.038 --> 00:37:50.498
resource with the one at the provided URL.

00:37:50.618 --> 00:37:54.318
The difference from the assign-Method is that after using replace,

00:37:54.758 --> 00:37:57.898
the current page will not be saved in session history. Okay.

00:37:58.538 --> 00:38:05.558
Das ist halt das Gleiche wie hier mit diesem Push-History und Replace-History, genau.

00:38:07.178 --> 00:38:12.558
Genau, und wahrscheinlich wollten die das mal als Funktion spezifizieren,

00:38:12.678 --> 00:38:15.398
weil dieses Zuweisen eines Wertes,

00:38:15.478 --> 00:38:21.178
also zum Beispiel wenn du location.href equals und dann eine neue URL.

00:38:23.118 --> 00:38:27.858
Hinschreibst, ist halt sehr archaisch und fühlt sich nicht richtig an.

00:38:28.458 --> 00:38:34.918
Also für mich zumindest im Vergleich zu, wenn man halt eine Funktion bedient.

00:38:35.118 --> 00:38:37.998
Also intuitiv hätte ich da eine Funktion erwartet.

00:38:38.298 --> 00:38:47.558
Genauso wie mit dem mit dem Lesen der mit dem Lesen der Location ist vielleicht

00:38:47.558 --> 00:38:51.998
ToString etwas intuitiver, als wenn man einfach die Property nimmt.

00:38:52.318 --> 00:38:56.878
Ja, es ist auf jeden Fall OOP, rein so von der Philosophie her,

00:38:56.938 --> 00:38:59.718
dass du irgendwie eine Methode aufrufst, einen internen Zustand von dem Kerl

00:38:59.718 --> 00:39:04.538
zu verändern, statt dass du da irgendwie implizite Getter Setter oder ähnliches

00:39:04.538 --> 00:39:06.478
auslöst, also das kann ich schon nachvollziehen.

00:39:08.307 --> 00:39:13.507
Ja, also sonst nutze ich, habe ich nur die Reload-Methode benutzt. Ja.

00:39:14.587 --> 00:39:17.727
Das ist halt mehr so Infrastruktur, die ist halt da und die funktioniert halt.

00:39:17.827 --> 00:39:19.887
Das ist relativ langweilig. Mhm.

00:39:20.967 --> 00:39:27.287
Ja, aber gut, also das mit dem Replace und Assign und so, das wusste ich auch noch nicht bis heute.

00:39:28.607 --> 00:39:35.087
Wer weiß, wofür ich das mal gebrauchen kann. Das weiß ich auch nicht. Dann das Replace. Tja.

00:39:36.767 --> 00:39:40.927
Aber weißt du, was du ganz gut gebrauchen kannst, Shep? Einen Druck auf den

00:39:40.927 --> 00:39:44.187
Knopf. Genau. Go, go, go. Ich drücke.

00:39:46.427 --> 00:39:49.047
Da, guck. Ich hab doch gesagt, wir haben jetzt JavaScript auch drin.

00:39:49.167 --> 00:39:53.287
Jetzt haben wir auch was von JavaScript Operators. Und die Structuring haben wir jetzt hier als.

00:39:57.167 --> 00:40:02.247
Ausgewürfeltes Dings. Sehr gut. Was war das nochmal, was mich letztens aufgeregt hat, was nicht ging?

00:40:03.687 --> 00:40:06.087
Hm. Ich erinnere mich nicht mehr.

00:40:08.827 --> 00:40:13.287
Genauso. Also zur kurzen Erklärung, die Structuring, was bedeutet das eigentlich?

00:40:14.407 --> 00:40:22.307
Wir haben beispielsweise ein Array an Zahlen und wollen beispielsweise den ersten

00:40:22.307 --> 00:40:28.287
und den zweiten Wert in eine Variable zuweisen und die übrigen Werte in diesem

00:40:28.287 --> 00:40:32.727
Array an eine dritte Variable mit dem Namen beispielsweise rest.

00:40:32.727 --> 00:40:39.627
Dann können wir dem so begegnen, dass wir sagen, erster Wert ist in einem Array

00:40:39.627 --> 00:40:44.167
geschrieben a, dann Komma b, Komma Punkt, Punkt, Punkt, Rest.

00:40:44.167 --> 00:40:50.147
Und diese drei Punkte und die Zuweisung aller Werte außer dem 0. und dem 1.

00:40:50.387 --> 00:40:59.887
Wert in diese REST-Variable, das ist dann das destructurte oder beziehungsweise

00:40:59.887 --> 00:41:06.447
das destructuren ist eigentlich dieser komplette Vorgang der Zuweisung in die Variablen.

00:41:08.091 --> 00:41:11.591
Hast du das richtig und verständlich erklärt? Würde ich so sagen.

00:41:11.751 --> 00:41:15.971
Also auf jeden Fall im Prinzip eine syntaktische Umkehr der Array-Syntax.

00:41:16.011 --> 00:41:18.491
Jetzt in dem Beispiel des Array-Destruct-Drinks, wo du normalerweise schreiben

00:41:18.491 --> 00:41:21.391
würdest, da reingeht erst dieses, dann jenes, dann solches.

00:41:21.471 --> 00:41:24.691
Machst du mit Destruct-Drinken, da rauskommt erst dieses, dann jenes, dann solches.

00:41:24.971 --> 00:41:27.831
Und der Rest wandert halt eben in den Rest-Container. Genau.

00:41:29.011 --> 00:41:36.531
Ich frage mich gerade, könnte man den A und B befüllen, ohne dass man den Rest

00:41:36.531 --> 00:41:38.391
in Rest reinsteckt? Klar.

00:41:38.971 --> 00:41:46.631
Das geht, ja. Das ist komplett optional. Dann A, B, dann Array oder eckige Klammer zu gleich.

00:41:46.751 --> 00:41:50.351
Und dann aber ein Array, das mehr als zwei Werte hat, dann würden eben die ersten

00:41:50.351 --> 00:41:52.311
zwei da fließen dann da rein.

00:41:52.371 --> 00:41:55.731
Und der Rest, der wird dann verworfen.

00:41:56.011 --> 00:41:59.391
Also es ist genauso, als würdest du schreiben, A gleich Array,

00:41:59.391 --> 00:42:01.091
eckige Klammer 0, B gleich eckige Klammer 2.

00:42:01.611 --> 00:42:04.691
Okay. Äh, 1, Entschuldigung. 1, ja. Ja.

00:42:05.111 --> 00:42:08.471
Okay. Alles langweilig. Das Spannende daran ist, was die wenigsten wissen,

00:42:08.551 --> 00:42:10.691
das geht mit allem, was iterierbar ist.

00:42:11.431 --> 00:42:14.951
Also mit allem, was in eine Voraufschleife reinpasst, kann man mit Array Destructuring

00:42:14.951 --> 00:42:16.591
destructern, das hat also nichts mit Arrays zu tun.

00:42:17.791 --> 00:42:21.451
Also, erste zwei Code-Punkte aus dem String herausholen, machst du Eck hier

00:42:21.451 --> 00:42:24.571
Klammer, A, B, Eck hier Klammer zu, gleich, und dann steht da dein String.

00:42:24.731 --> 00:42:25.911
Holst du die beiden Buchstaben raus.

00:42:26.991 --> 00:42:30.031
Erste paar Entries aus dem Map oder aus einer Set rausholen, gleiche Geschichte.

00:42:30.171 --> 00:42:35.571
Aus einer Dom-Token-List, aus einer Node-List, geht alles damit. Ja, das ist schon geil.

00:42:37.231 --> 00:42:41.751
Genau, und dann kann man noch das, was man, glaube ich, eher häufiger nutzt,

00:42:41.751 --> 00:42:46.391
das ist ja dieses Objekt-Destructuring, was da ja auch drunter fällt und wo

00:42:46.391 --> 00:42:49.231
man auch hier die Beispiele auf der Seite ein bisschen tiefer hat.

00:42:49.611 --> 00:42:52.631
Genau, da hast du halt Schweifklammern statt Ecke-Klammern und da ist dann auch

00:42:52.631 --> 00:42:55.571
keine Magie bei, das funktioniert nur mit Objekten. Mhm.

00:42:58.477 --> 00:43:01.117
Also mein liebster Funfact, was das angeht, ist ja tatsächlich,

00:43:01.317 --> 00:43:05.137
dass man Objektdestructuring auch sehr gut auf Arrays anwenden kann.

00:43:06.337 --> 00:43:10.517
Also wenn du zum Beispiel sowas haben willst, wie ich brauche das erste Element

00:43:10.517 --> 00:43:14.937
und ich will die Länge haben, dann könntest du theoretisch das erste Element

00:43:14.937 --> 00:43:17.997
mit der Ecke hier Klammer-Syntax rausholen und die Length, die ja eine Objektproperty

00:43:17.997 --> 00:43:20.217
ist, heben mit Objektdestructuring.

00:43:20.917 --> 00:43:23.977
Aber kann man das nicht auch beides in einem machen? Ja, kannst du schon,

00:43:24.117 --> 00:43:28.177
weil Arrays haben ja bloß ihre Felder als numerische Properties.

00:43:28.297 --> 00:43:30.657
Also 1, 2, 3 sind ja bloß Objektproperties da drauf.

00:43:30.957 --> 00:43:34.797
Also kannst du schreiben, Eck hier, Klammer, Length, Komma und dann 0.

00:43:34.897 --> 00:43:40.057
Hast aber das Problem, 0 ist ja kein gültiger Variablename, aber im Objektdestructuring

00:43:40.057 --> 00:43:42.637
kannst du das Ding ja direkt in eine andere Variable stecken.

00:43:42.817 --> 00:43:46.597
Also dass du schreiben kannst, rauspicke ich das und ich stecke es in jene mit

00:43:46.597 --> 00:43:47.477
einem Doppelpunkt dazwischen.

00:43:47.477 --> 00:43:50.897
Dass du also schreiben kannst, Schweifklammer und dann einfach irgendwie Length,

00:43:50.977 --> 00:43:54.097
dann kriegst du die Length daraus und dann nimmst du dir 0, das ist das erste

00:43:54.097 --> 00:43:58.797
Element, Doppelpunkt First, dann landet das in einer Variable namens First zusammen mit der Length.

00:43:59.097 --> 00:44:03.777
Das ist ganz nett eigentlich. Ja, total. Das ist cool.

00:44:04.877 --> 00:44:08.057
Du hast ja irgendwann irgendeinen Blogpost auch geschrieben,

00:44:08.237 --> 00:44:11.217
da ging es um irgendwas mit Arrays, ich weiß nicht, ob das darum ging,

00:44:11.297 --> 00:44:13.177
irgendwie Arrays nachzubauen oder sowas.

00:44:14.317 --> 00:44:17.637
Bestimmt. Oder auch nicht. Nicht, ach nee, ich glaube, da ging es so,

00:44:17.677 --> 00:44:22.377
du hattest irgendwie so ein sehr elegantes RegEx-Pattern-Matching und das hast

00:44:22.377 --> 00:44:27.557
du dann eben auch, da hast du dann auch eben ein Objekt-Destructuring drin gehabt.

00:44:28.057 --> 00:44:32.597
Ah, ja, ja, genau. Das ist ja tatsächlich da gar nicht mal so ungewöhnlich,

00:44:32.597 --> 00:44:37.997
dass man bei so Destructuring ja untersuchen muss, was genau ist da in meinem Array drin.

00:44:38.137 --> 00:44:40.657
Also ich meine, okay, bei regulären Ausdrücken sollte man das nicht haben,

00:44:40.717 --> 00:44:44.037
weil man ja Named Capturing Groups verwendet, hoffentlich, vielleicht.

00:44:45.622 --> 00:44:47.162
Aber wenn man das nicht am Start hat,

00:44:47.262 --> 00:44:51.842
dann ist das da so mein primärer Anwendungsfall für genau diesen Trick.

00:44:52.842 --> 00:44:57.282
Ja, das ist sogar ganz unten. Unpacking values from a regular expression match.

00:44:57.462 --> 00:44:58.782
Das haben die doch bei dir geklaut.

00:45:00.822 --> 00:45:07.722
Schweinebären. Das kann gut sein. Ich sollte sie verklagen. Ich denke auch.

00:45:09.142 --> 00:45:11.322
Du hast die Pia Art geliefert. hat.

00:45:14.662 --> 00:45:17.462
So, und sollen wir uns noch einer neuen Runde widmen?

00:45:19.542 --> 00:45:23.602
Ja, ich gucke mal hier auf die Zeit. Wir können ja noch hier drehen.

00:45:24.522 --> 00:45:27.782
Also einmal drei sozusagen. Genau.

00:45:29.582 --> 00:45:33.322
Alles klar. Zu Destructuring sind wir eigentlich durch, oder?

00:45:33.842 --> 00:45:37.442
Ja, ist ja auch relativ langweilig und gut abgehangen mittlerweile.

00:45:38.522 --> 00:45:41.322
Alles klar, wir Wir verwenden das, glaube ich, alle ab und zu mal.

00:45:41.542 --> 00:45:46.542
Und der Zufallsgenerator gibt uns auch was anderes, eine andere Eigenschaft

00:45:46.542 --> 00:45:53.002
aus dem JavaScript-Umfeld, beziehungsweise eine Funktion, die wir sehr,

00:45:53.062 --> 00:45:55.722
sehr häufig wahrscheinlich alle mittlerweile verwenden.

00:45:56.542 --> 00:46:02.702
Es ist die tolle Ablösung des verhassten XHR-Requests.

00:46:02.842 --> 00:46:09.622
Es ist der Nachfolger, der wildly used on the client as well as on the server ist.

00:46:09.702 --> 00:46:13.422
Es ist die Fetch-Funktion der globalen Natur.

00:46:13.762 --> 00:46:19.762
Mein lauwarmes Take ist, das ist ein würdiger Nachfolger zum XML-HTTP-Request,

00:46:19.982 --> 00:46:23.962
weil auch das Ding designtechnisch, glaube ich, gar nicht mal so der große Wurf ist.

00:46:25.402 --> 00:46:28.182
Was? Jo, ich hab's gesagt.

00:46:30.582 --> 00:46:34.002
Also im Endeffekt ist es ja erstmal eine Funktion, du steckst irgendwie eine

00:46:34.002 --> 00:46:37.902
URL rein und Und sie wird halt asynchron abgefragt.

00:46:37.942 --> 00:46:41.582
Und dann kannst du entweder einen Promise da drauf packen oder halt mit Async

00:46:41.582 --> 00:46:45.422
Await diese Funktion, also den Content erwarten.

00:46:45.462 --> 00:46:48.922
Und dann kommt wahrscheinlich deine Kritik zum Tragen.

00:46:48.942 --> 00:46:52.942
Ich nehme an, die Kritik von Peter wird sein, dass das eine der ersten APIs

00:46:52.942 --> 00:47:02.102
ist, die auf Promise-Basis gebaut wurde und die dann nachträglich dieses Board-Signal da rein,

00:47:03.342 --> 00:47:08.182
einfreemeln mussten, um Fetches auch abbrechen zu können, wenn sie in Flight sind.

00:47:08.582 --> 00:47:11.862
Genau, weil ein Request abbrechen? Nee, da brauchen die nicht.

00:47:11.942 --> 00:47:15.302
Komm, just ship it, da kümmern wir uns später drum, da kommt einfach ein Promise

00:47:15.302 --> 00:47:17.462
raus, da gibt es keine Abort-Methode oder irgendwas.

00:47:17.802 --> 00:47:21.242
Da muss man dann irgendwie so ein archaisches Konstrukt aus Abort-Signals bauen,

00:47:21.342 --> 00:47:25.982
wirklich XML-HTTP-Request, nur halt einfacher zu schreiben. Das ist mein Urteil.

00:47:28.203 --> 00:47:31.103
Ja. Naja, es ist, ja. Ja, genau.

00:47:32.763 --> 00:47:36.103
Was sagst du dir so? Ja, auch. Ja, na gut. Hey, das ist wie,

00:47:36.123 --> 00:47:38.143
als hätte man in deinem Auto einfach die Bremsen weggelassen,

00:47:38.183 --> 00:47:40.043
weil das machen wir dann später irgendwie.

00:47:40.383 --> 00:47:43.303
Oder du müsstest die Bremsen halt irgendwie bedienen, indem du,

00:47:43.323 --> 00:47:47.023
keine Ahnung, auf einem Touchscreen irgendwie eine Formenhalst oder irgendwie

00:47:47.023 --> 00:47:48.203
sowas mega umständliches.

00:47:48.423 --> 00:47:51.543
Ach, du weißt, im Actionfilm ist das auch immer so, dass die aus dem Flugzeug

00:47:51.543 --> 00:47:54.723
fallen und dann merken die, dass sie keinen Fallschirm haben und dann springt

00:47:54.723 --> 00:48:00.523
aber James Bond hinterher und holt dich ein und dann fängt er dich und macht seinen Fallschirm auf.

00:48:00.663 --> 00:48:03.963
Und so ist es mit Abort-Signal dann auch gewesen. Ja.

00:48:05.503 --> 00:48:11.663
Nur auf Spezifikationsebene. Ja, ja. Also ganz, ganz, ganz großes Spezifikationstennis. Ganz schlimm.

00:48:12.423 --> 00:48:16.043
Ja, genau. Aber generell ist es ja schon so, wenn man einfach einen Get-Request

00:48:16.043 --> 00:48:19.323
machen will oder so, dann ist Fetch ja schon sehr bequem.

00:48:20.363 --> 00:48:25.163
Ja, bis du abbrechen willst. Dann halt nicht mehr. Ach, wer will denn schon abbrechen?

00:48:25.723 --> 00:48:28.363
Ich meine ja nur XMLJP-Requests, du kriegst ein Objekt raus,

00:48:28.523 --> 00:48:31.363
weißt du, da ist eine Methode drauf, die kannst du aufrufen, dann ist abgebrochen.

00:48:31.483 --> 00:48:33.703
Das findet sogar der Hans gut, weil dann hast du eine Methode,

00:48:33.783 --> 00:48:37.183
die kannst du aufrufen, dann macht das eine Aktion, das ist richtig,

00:48:37.703 --> 00:48:39.983
ordentlich, sauber, schön, gut, ja.

00:48:41.723 --> 00:48:45.023
Da hat das die Nase vorn. Wo es auch die Nase vorn hat, ist,

00:48:45.083 --> 00:48:49.403
wenn man dann doch mal aus irgendeinem Grund synchrone Requests machen will.

00:48:49.763 --> 00:48:51.923
Ja, genau. Wenn man ja schöne Hacks machen kann.

00:48:53.583 --> 00:49:00.123
Hex? Also ich hab eine Firma hin und wieder als Kunden, die machen das einfach so per se. Aus Prinzip.

00:49:00.483 --> 00:49:03.123
Ja, genau, aus Prinzip. Ja.

00:49:04.563 --> 00:49:10.523
Von mir aus auch das. Aber die machen ja auch Soap, von daher ist, glaube ich, eh, naja.

00:49:11.923 --> 00:49:18.203
Es gibt auch diese Hex, dass du quasi, wie ist denn das, also du nutzt die im Prinzip um,

00:49:19.263 --> 00:49:24.543
zum Beispiel Party Town macht das dass so die emulieren ein DOM im Webworker

00:49:24.543 --> 00:49:31.503
und damit synchrone API-Requests eben bedient werden können, wird ein,

00:49:32.903 --> 00:49:36.363
synchroner XHR-Request gemacht und der wiederum,

00:49:37.203 --> 00:49:41.783
der wird dann von einem Serviceworker abgefangen und so weiter und so fort.

00:49:41.883 --> 00:49:43.523
Also das ist schon fiese Hackerei.

00:49:45.023 --> 00:49:48.623
Ich glaube, mittlerweile gibt es ja dann diese Atomics, mit denen man das umgehen kann.

00:49:49.503 --> 00:49:53.183
Muss ich mal raussuchen. Also das ist schon ein bisschen eklig,

00:49:53.203 --> 00:49:55.923
aber auch irgendwie cool. Moment, was genau kann man damit umgehen?

00:49:57.783 --> 00:50:03.703
Damit kann man Prozesse, glaube ich, anhalten, bis der Atomic wieder freigegeben ist.

00:50:04.043 --> 00:50:06.423
Ach so, ja, klar. Ja, ja, klar, das geht.

00:50:08.963 --> 00:50:16.263
PartyTown ist ja so eine Library, mit der kannst du Third-Party-JavaScript wie

00:50:16.263 --> 00:50:21.163
zum Beispiel Google Analytics oder so in einem Worker laufen lassen anstatt

00:50:21.163 --> 00:50:23.703
im Main Thread. Das ist ja so ein bisschen die Idee davon.

00:50:26.853 --> 00:50:35.733
Ja, da ist, glaube ich, Atomics echt der etwas weniger kriminelle Hack auf einer Skala, würde ich sagen.

00:50:36.713 --> 00:50:41.653
Ja, guck mal hier, ich habe da sogar ein Making-of gefunden,

00:50:41.853 --> 00:50:43.053
wo man das nachlesen kann.

00:50:46.133 --> 00:50:51.213
Okay, das ist sehr gut. Das werden wir auf jeden Fall definitiv so was von verlinken.

00:50:54.633 --> 00:50:57.813
Ja, ansonsten ist ein Fetch-IoT irgendwie, da wird zuletzt mal irgendwas Spannendes,

00:50:57.853 --> 00:51:01.993
Neues passiert, interessante Ergänzung irgendeiner Form.

00:51:02.113 --> 00:51:04.833
Ich glaube schon, dass da immer noch mal ein bisschen was dazu kommt,

00:51:04.913 --> 00:51:08.793
aber so richtig im Kopf habe ich das nicht.

00:51:09.633 --> 00:51:10.913
Ja, also okay, hier,

00:51:12.953 --> 00:51:16.533
Fetch-Priority, genau das haben die da auch reingebastelt.

00:51:16.593 --> 00:51:23.193
Das kann man halt in XAR nicht reinpacken, also diese Priority-Hints,

00:51:23.313 --> 00:51:26.653
dass man die dann eben dem Fetch-Request auch mitgeben kann.

00:51:28.453 --> 00:51:32.013
Boah, auch so Infrastruktur, die einfach da ist, ne? Ja.

00:51:32.673 --> 00:51:37.993
Genau. Aber auch Fetch wird uns das Leben im Hinblick auf Cores.

00:51:40.053 --> 00:51:44.633
Und Credentials mitsenden und Cores und Co. nicht erleichtern.

00:51:45.773 --> 00:51:47.913
Nee. Und abbrechen halt auch nicht.

00:51:49.493 --> 00:51:53.693
Doch, mit Abort-Signal. Das ist ja dann wie so eine Schnur, die,

00:51:53.753 --> 00:51:57.193
weißt du, die dann, so jemand springt in den Abgrund und hat aber noch so eine

00:51:57.193 --> 00:52:02.473
kleine Leine oben befestigt und da kann man dann nochmal ihn dann wieder hochziehen dann.

00:52:03.133 --> 00:52:06.333
Ich finde es super, wie alle Vergleiche, die du ziehst, so Sachen sind,

00:52:06.393 --> 00:52:10.153
wo ich sagen würde, ja okay, Tom Cruise macht das für seinen nächsten Film so

00:52:10.153 --> 00:52:12.333
als Stunt, weil er halt irgendwie nicht alle Tassen im Schrank hat.

00:52:12.573 --> 00:52:15.213
Aber wenn ich einfach so hier stinknormaler Webentwickler bin,

00:52:15.373 --> 00:52:17.333
würde ich vielleicht einfach meine Aufgabe erledigen wollen.

00:52:17.433 --> 00:52:21.373
Da wäre halt so eine schöne Methode, weißt du, die du aufrufst und dann passiert

00:52:21.373 --> 00:52:24.293
das, was du willst, also auf dem Objekt.

00:52:24.693 --> 00:52:28.073
Ich meine, ein Bord-Signal ist ja im Prinzip hier so, du bist jetzt ein anderes

00:52:28.073 --> 00:52:30.893
Objekt, du gehörst zu dem Ding und wenn ich bei dir da drauf drücke,

00:52:30.953 --> 00:52:32.293
muss dieses andere abgebrochen werden.

00:52:32.733 --> 00:52:35.413
Das ist halt schon ein bisschen Banane. Ja.

00:52:36.773 --> 00:52:38.873
Auf jeden Fall. Gebe ich dir recht.

00:52:41.887 --> 00:52:46.567
Nun denn, ich würde sagen, es hilft nur eines. Irgendwer muss drücken und ich

00:52:46.567 --> 00:52:47.987
weiß gerade nicht, wer. Du, glaube ich.

00:52:48.787 --> 00:52:51.127
Peter. Oh, ich muss drücken. Okay,

00:52:51.207 --> 00:52:54.547
was ist das Schlimmste, was ich mir vorstellen kann, was jetzt kommt?

00:52:55.827 --> 00:53:01.007
Irgendwas von SVG. Also irgendwas aus der Manifest-Datei, aber das habe ich rausblockiert.

00:53:02.167 --> 00:53:06.687
Das kam ja so oft am Anfang. Okay, dann einfach hier, Frames,

00:53:06.767 --> 00:53:09.247
okay? Frames, Frames, Frames, Frames.

00:53:13.627 --> 00:53:17.867
Gibt auch wieder keine Seite dazu, herrlich warum eigentlich nicht?

00:53:18.247 --> 00:53:25.187
Ich glaube als eigenes Popover Target genau, das ist das worüber wir sprechen

00:53:25.187 --> 00:53:30.307
es hat einfach nicht seine eigene Seite als Attribut, weil es ist ja bloß ein

00:53:30.307 --> 00:53:31.947
Content Attribut, wo eine ID reingeht,

00:53:33.687 --> 00:53:37.907
das ist ja nicht so krass genau, aber es ist ein.

00:53:40.407 --> 00:53:44.947
Globales Attribut. Ich überlege gerade. Also es gehört zur Popover-API.

00:53:45.967 --> 00:53:53.067
Die macht ja, dass so eine Art ein nicht blockierendes, ein nicht modal aufgeht,

00:53:53.067 --> 00:53:54.387
zumindest derzeit, bis die,

00:53:55.387 --> 00:53:59.707
Anchor-Positioning, bis das in CSS da ist und man dann vielleicht irgendwas

00:53:59.707 --> 00:54:05.467
auch tatsächlich wie ein Popup an einem Element befestigen kann.

00:54:06.947 --> 00:54:11.227
Aber Popover-Target, wenn es global ist, hieße das ja, man könnte aus jedem

00:54:11.227 --> 00:54:13.287
Element heraus einen Popover öffnen.

00:54:14.267 --> 00:54:16.687
Und nicht nur von interaktiven Elementen aus.

00:54:18.267 --> 00:54:23.127
Das finde ich ja ein bisschen merkwürdig. Heißt aber, dass dieses,

00:54:23.287 --> 00:54:28.147
das Target, also das, was man da reinschreibt, ist praktisch eine ID von irgendeinem

00:54:28.147 --> 00:54:34.547
anderen Element und das Element wird dann praktisch zum Popover,

00:54:34.667 --> 00:54:40.907
muss halt dann auch die Popover, also das Popover-Attribut bekommen,

00:54:41.147 --> 00:54:45.827
damit es dann entsprechend auch so funktioniert. Genau.

00:54:47.427 --> 00:54:51.067
Ja, und das ist eigentlich schon alles. Also es ist halt ein toller,

00:54:51.127 --> 00:54:58.327
deklarativer Ansatz, finde ich, den ich mir für Dialog-Elemente auch wünschen würde.

00:54:58.727 --> 00:55:03.067
Da haben wir, glaube ich, schon mal irgendwann drüber gesprochen, dass es cool wäre.

00:55:05.972 --> 00:55:15.292
Genau, und es gibt ja aktuell gibt's ja oder arbeitet man ja an so einem eher generellen Ansatz,

00:55:15.292 --> 00:55:21.312
der diesem Pop-over-Target entspricht und es gibt auch Pop-over-Target-Action

00:55:21.312 --> 00:55:24.632
und das ist die Invoker-API.

00:55:25.372 --> 00:55:31.572
Also dann würdest du halt quasi sagen, das eine ist der Invoker und das andere

00:55:31.572 --> 00:55:34.332
ist das Invokee, also das, was invoked wird.

00:55:35.232 --> 00:55:39.212
Und so wie du hier mit Popover Target gleich auf IDs verweist,

00:55:39.312 --> 00:55:41.672
kannst du das dann eben mit dieser Invoker-API machen.

00:55:42.412 --> 00:55:46.432
Aber die ist eben so ein bisschen generalistischer. Also die könnte dann sowas

00:55:46.432 --> 00:55:51.172
wie machen wie, keine Ahnung, Exclusive Accordions aufgehen lassen.

00:55:51.172 --> 00:55:58.252
Also alles, wo man States ändern kann, theoretisch soll damit steuerbar werden,

00:55:58.432 --> 00:56:02.772
sodass man immer das gleiche Attribut nehmen kann für alles.

00:56:03.892 --> 00:56:07.252
Ja, und wenn ich die Spezifikation richtig lese, ist es tatsächlich global.

00:56:09.112 --> 00:56:13.052
Weil auch nicht-interaktive Elemente können ja interaktiv gemacht werden,

00:56:13.112 --> 00:56:16.592
beziehungsweise man kann ja auch so Sachen wie Custom Elements bauen, die interaktiv sind.

00:56:17.932 --> 00:56:21.032
Und für die soll das halt auch zur Verfügung stehen. Okay.

00:56:22.152 --> 00:56:27.512
Ach, das ist so ein Open-UI-Dings wieder Ich habe gerade schon gegoogelt den

00:56:27.512 --> 00:56:28.332
Invoker, Entschuldigung,

00:56:29.232 --> 00:56:34.252
Nee, ich frage mich einfach nur also warum kann man nicht href verwenden,

00:56:34.412 --> 00:56:37.372
also in der Vergangenheit haben wir doch für sowas immer href,

00:56:38.212 --> 00:56:43.212
oder nur oder sowas verwendet also es gibt doch auch noch andere Möglichkeiten

00:56:43.212 --> 00:56:48.532
sowas, so einen Aufruf zu machen Aber das verlinkt ja tatsächlich dann auf ein anderes,

00:56:49.292 --> 00:56:53.332
Dokument, beziehungsweise auf etwas was in dem Dokument, aber mit diesem Popover

00:56:53.332 --> 00:56:56.632
steuerst du ja sozusagen wirklich, indem du auf einen Button klickst,

00:56:56.652 --> 00:56:59.392
ob was anderes aufpoppt oder nicht aufpoppt, sichtbar wird oder nicht.

00:56:59.892 --> 00:57:04.532
Das ist also schon so eine spukhafte Fernwirkung, die ja in der HTML so eher

00:57:04.532 --> 00:57:07.392
ungewöhnlich ist, dass du wirklich das hast, dass ein Element auf ein anderes

00:57:07.392 --> 00:57:10.532
verweist anhand seiner ID, das hast du bei Labels und bei irgendwie so,

00:57:11.612 --> 00:57:14.552
Formattributen bei Inputs, die außerhalb ihres Formtags existieren,

00:57:14.612 --> 00:57:16.672
aber sonst ist das ja wirklich was relativ Spezielles.

00:57:17.532 --> 00:57:21.892
Genau, und da verwenden wir ja for, und dann kommt die ID. Genau.

00:57:22.112 --> 00:57:24.692
Die Frage ist, kann man da nicht was generisches finden?

00:57:25.652 --> 00:57:29.892
Ja, das generische soll halt diese Invoker-API dann werden irgendwann, ja.

00:57:30.252 --> 00:57:35.072
Ja, man braucht auch was generisches, weil man will ja gegebenenfalls sowas

00:57:35.072 --> 00:57:37.672
auch in einer Form haben, was durch Shadow DOM durchgreifen kann.

00:57:38.792 --> 00:57:43.032
Und das geht mit diesem ID-Ansatz ja nicht so wirklich gut. Und das ist schon

00:57:43.032 --> 00:57:46.672
ein ziemliches Problem, gerade für so den ganzen Barrierefreiheitskrempel irgendwie

00:57:46.672 --> 00:57:50.752
so labeled by und so, ist halt relativ schwierig, wenn man da diesen riesig

00:57:50.752 --> 00:57:53.012
hohen NATO-Draht-Zaun Shadow DOM hat.

00:57:53.252 --> 00:57:56.772
Und da wäre halt eine JavaScript-API, die nicht irgendwie einfach nur so String-basiert

00:57:56.772 --> 00:57:58.572
ist wie in der Steinzeit, schon ganz gut.

00:57:59.452 --> 00:58:02.032
Genau, aber da hilft uns die Invoker-API nicht dafür.

00:58:03.970 --> 00:58:08.230
Nee, aber sagen wir mal so, der Ansatz, also gerade für so dieses Area Labeled

00:58:08.230 --> 00:58:10.590
By, da gibt es ja, meine Güte, wie heißt denn das?

00:58:12.010 --> 00:58:13.110
Accessibility Object Model.

00:58:15.430 --> 00:58:19.370
AOM ist was anderes. Accessibility Object Model, da.

00:58:20.710 --> 00:58:23.970
Das ist noch nicht mal eine Spezifikation, ist im Moment bloß ein Explainer,

00:58:23.970 --> 00:58:28.310
aber das enthält im Prinzip die Barrierefreiheits-APIs für genau diesen Shadow DOM Use Case.

00:58:29.130 --> 00:58:31.990
Und das ist alles nur Papier. Das gibt es, glaube ich, noch in keinem Browser,

00:58:32.030 --> 00:58:35.090
in keiner Form, aber wäre halt eben nötig, um die Dinger irgendwie brauchbar zu machen.

00:58:39.510 --> 00:58:39.970
Ja.

00:58:42.070 --> 00:58:50.210
Aber Popover API ist auf jeden Fall eine schöne Neuerung in der Webplattform und auch,

00:58:51.990 --> 00:58:57.590
mittlerweile Baseline, also in allen aktuellen Browsern verfügbar.

00:58:58.310 --> 00:59:03.290
Ja, die Frage ist halt, und da bin ich bei der Diskussion, die Shep,

00:59:03.330 --> 00:59:06.390
du warst ja, glaube ich, auch dabei, als der Hans-Christian Otto am Start war,

00:59:06.510 --> 00:59:10.470
wo wir so über diese Framework-Membranen gesprochen haben, durch die man die Welt wahrnimmt.

00:59:11.110 --> 00:59:14.350
Ich bin halt gespannt, ob sich zeigen wird, dass das wirklich irgendwer benutzt

00:59:14.350 --> 00:59:19.130
am Ende oder ob das alles in sieben React-Layers eingetütet wird und dadurch

00:59:19.130 --> 00:59:22.610
am Ende im Prinzip von Nicht-Vorhandensein nicht unterscheidbar ist.

00:59:24.410 --> 00:59:27.990
Ja, genau. Ich glaube, mit dem Hans-Christian Otto hatten wir auch tatsächlich

00:59:27.990 --> 00:59:29.310
über die Popover-API gesprochen.

00:59:30.850 --> 00:59:36.410
Am Ende, ja, wenn die Frameworks benutzen, die wiederum diese Web-Plattform-Features

00:59:36.410 --> 00:59:38.670
benutzen, ist das ja wahrscheinlich auch okay. key.

00:59:39.650 --> 00:59:43.770
Es ist okay, es ändert halt nur nichts. Also wie gesagt, es gibt keinen wahrnehmbaren

00:59:43.770 --> 00:59:46.550
Unterschied zwischen diesem Feature, dieses Feature ist da und dieses Feature ist nicht da.

00:59:48.050 --> 00:59:50.550
Das ist ja alles, was ich sage. Es ist nicht schlecht oder so,

00:59:50.630 --> 00:59:52.090
aber ändert halt nichts.

00:59:52.990 --> 00:59:59.110
Ja, also wahrnehmbar eher im Sinne von, keine Ahnung, weniger JavaScript muss geschippt werden,

01:00:00.810 --> 01:00:05.510
und vielleicht haben die Clients dafür bessere,

01:00:06.450 --> 01:00:12.790
Ausprägungen, wie die das eben dann rendern auf Mobile, auf Desktop und so,

01:00:12.850 --> 01:00:16.890
weil das einfach besser optimiert ist oder so. Letzteres kann ich glauben.

01:00:17.610 --> 01:00:20.770
Ersteres nicht so sehr, weniger JavaScript, weil die Alternative wäre ja irgendwie

01:00:20.770 --> 01:00:24.230
Display-Togglen. Das ist jetzt auch nicht so aufwendig.

01:00:26.090 --> 01:00:28.550
Der mit halt ein bisschen Glue-Code drumherum. Aber trotzdem,

01:00:28.610 --> 01:00:29.270
das macht ja keinen Unterschied.

01:00:30.210 --> 01:00:32.930
Ja. Würde ich behaupten. Ich bin da immer so ein bisschen so,

01:00:32.970 --> 01:00:35.350
was so Sachen angeht, also irgendwie so, ja, ich finde die gut,

01:00:35.430 --> 01:00:37.410
weil ich weiß, ich werde die benutzen. als ein plainer HTML.

01:00:39.295 --> 01:00:41.395
Aber ich weiß halt nicht, ob das wirklich irgendwie Impact auf die große,

01:00:41.495 --> 01:00:45.075
weite Welt hat. Ich bin skeptisch. Mal sehen.

01:00:46.175 --> 01:00:49.735
Ich würde sagen, ich drücke noch mal ein letztes Mal den Knopf,

01:00:49.735 --> 01:00:53.835
oder? Drücke ganz fest. Uh.

01:00:55.455 --> 01:00:58.975
Okay. Okay, jetzt, das ist was, da haben wir wahrscheinlich alle gar keinen Plan von.

01:01:00.695 --> 01:01:09.855
Web-API XRPose, also irgendwas mit hier 3D oder Augmented Reality Krempel.

01:01:11.415 --> 01:01:16.395
So, das wäre doch mal eine spannende Sendung, darüber mal sich belehren zu lassen,

01:01:16.535 --> 01:01:17.735
wie das eigentlich läuft.

01:01:17.915 --> 01:01:22.395
So, wer jetzt also noch nicht abgeschaltet hat und vielleicht von diesem Thema

01:01:22.395 --> 01:01:24.935
super Ahnung hat und sich jetzt denkt, oh, jetzt wird spannend,

01:01:25.075 --> 01:01:29.695
jetzt habe ich voll Bock und jetzt mal schauen, was sie erzählen, sind sie wieder plank.

01:01:30.135 --> 01:01:33.775
Ihr könnt das ändern. Kommt doch mal vorbei und erklärt uns was darüber.

01:01:34.415 --> 01:01:35.895
Das wäre auf jeden Fall mal spannend.

01:01:37.295 --> 01:01:42.235
Gerne, ja. Ja, und bis dahin, glaube ich, müssen wir das einfach nochmal wiederholen

01:01:42.235 --> 01:01:46.575
und hier diesen Fehlschuss, in Anführungsstrichen, für uns jetzt in dem Kontext

01:01:46.575 --> 01:01:49.015
einfach nochmal ausführen.

01:01:50.015 --> 01:01:51.235
Einen letzten müssen wir noch.

01:01:52.315 --> 01:01:54.795
Okay, schnallt euch an, es wird krass.

01:01:56.895 --> 01:02:02.275
Ah, yes! Jawohl, Peter, das ist doch für dich genau das Richtige.

01:02:02.455 --> 01:02:03.555
Hast du mich gerade alt genannt?

01:02:03.855 --> 01:02:09.975
Element Freightset. Das war vorhin deine eigene, eine, sag ich mal, Darstellung der Dinge.

01:02:12.275 --> 01:02:17.455
Frameset ist doch, glaube ich, jetzt dieses ganz neue Ding für Microfrontends, oder?

01:02:18.055 --> 01:02:21.875
Das nennt sich, pass auf, wenn du das in den React-Komponenten kleidest und

01:02:21.875 --> 01:02:27.275
du nennst das irgendwie Multiview, hast du nicht gesehen, dann ist das der neue heiße Scheiß.

01:02:27.435 --> 01:02:30.475
Ganz ehrlich, also wenn man einfach nur mal irgendwen trollen möchte,

01:02:30.615 --> 01:02:33.275
dann muss man wirklich irgendwie einfach ein React-Projekt aufmachen,

01:02:33.335 --> 01:02:36.535
sagen, ich entwickle hier neue UI-Library, guck mal her, ich hab ein neues Element

01:02:36.535 --> 01:02:40.255
erschaffen, Das heißt Font und dann gibt es auch noch ein neues, das heißt Center.

01:02:42.095 --> 01:02:43.595
Und dann mal gucken, wie viele Leute das ernst nehmen.

01:02:46.155 --> 01:02:49.275
Naja, es sind halt Design-Tokens, so kennen wir das doch, oder?

01:02:50.195 --> 01:02:53.235
Ja, es ist halt nur wichtig, dass du sie wirklich exakt so modellierst,

01:02:53.315 --> 01:02:54.975
wie seinerzeit Netscape.

01:02:56.635 --> 01:03:00.395
Und dass du zu keinem Zeitpunkt erkennen lässt, dass du das weißt, dass du das tust.

01:03:01.995 --> 01:03:04.935
Okay, nee, aber hier im Ernst auf Framesets. Wir müssen jetzt mal wirklich gucken,

01:03:05.095 --> 01:03:07.875
wer von uns hier hat zuletzt ein Frameset gemacht?

01:03:07.975 --> 01:03:10.135
Wer ist der letztmalige Frameset-Nutzer unter uns?

01:03:10.495 --> 01:03:14.015
Habt ihr irgendeine Idee? Wer erinnert sich noch, wann man das zuletzt benutzt

01:03:14.015 --> 01:03:17.255
hat? Aber kannst du es vielleicht ausschließen? Ich fand die ja schon gut damals.

01:03:17.595 --> 01:03:21.095
Ich fand die ja schon super. Und das Einzige, was an denen genervt hat,

01:03:21.615 --> 01:03:26.495
war, dass die URL oben sozusagen nicht wiedergespiegelt hat.

01:03:29.255 --> 01:03:33.755
Den Zustand der Frames in dem Frameset.

01:03:33.995 --> 01:03:38.095
Also das war ja, das, finde ich, war ja der größte Drawback.

01:03:38.135 --> 01:03:42.175
Aber sonst war es damals, also als ich noch zu blöd war für PHP oder irgendeinen

01:03:42.175 --> 01:03:43.895
anderen Krempel, und ich keine

01:03:43.895 --> 01:03:48.215
Lust hatte, irgendwie Menüs in jeder HTML-Seite zu bauen, war es ja mega.

01:03:48.315 --> 01:03:53.495
Ein Frame fürs Menü und das andere Frame für vielleicht den Header,

01:03:54.415 --> 01:03:58.995
ein Frame für den Footer und ein für den Content. Und dabei gab es ja nicht.

01:04:00.015 --> 01:04:07.275
Und dann hat man immer schön alles verlinkt mit Target Content Frame Set oder Frame.

01:04:08.035 --> 01:04:13.535
Und dann hat bei jedem Klick auf der Seite hat sich eben nur da das geändert. Ja.

01:04:14.615 --> 01:04:18.875
Lost Technology. Das können wir heutzutage nicht mehr. Schade.

01:04:20.355 --> 01:04:23.295
Ja, weil ich meine, es ist krass, dass es das tatsächlich gibt.

01:04:23.415 --> 01:04:26.375
Also ich meine, du machst irgendwie TikTok und dann kommen die Verschwörungstheoretiker,

01:04:26.415 --> 01:04:28.855
die dir sagen, heutzutage wäre es unmöglich, die Pyramiden zu bauen,

01:04:28.955 --> 01:04:32.675
wo die Wahrheit einfach nur ist, dass niemand Bock hat, eine Pyramide zu bauen.

01:04:32.775 --> 01:04:39.035
Aber man könnte, wenn man wollte, wohingegen so eine Develop Experience zu erzeugen,

01:04:39.055 --> 01:04:42.555
wie du sie gerade beschrieben hast, das geht halt nicht. Jedenfalls Falls nicht,

01:04:42.555 --> 01:04:43.995
wenn du die nicht zum Vollobst machen möchtest.

01:04:46.110 --> 01:04:50.050
Ja, also das Schöne ist ja, es funktioniert in jedem Browser.

01:04:50.490 --> 01:04:56.190
Also wenn man sich genötigt fühlt, so etwas mal zu bauen, es funktioniert auch mobile.

01:04:57.110 --> 01:05:02.770
Und das wäre doch mal interessant zu sehen. Da machst du einfach einen Mobile-Erkenner,

01:05:02.870 --> 01:05:07.150
also hier serverseitige Erkennung und leitest halt auf deine Mobile-Seite um.

01:05:07.570 --> 01:05:11.230
Und da hast du halt ein anderes Frameset, beziehungsweise, ja,

01:05:11.330 --> 01:05:12.350
wahrscheinlich genauso.

01:05:12.550 --> 01:05:15.770
Ich frage mich gerade, ob man das vielleicht sogar mit Grid layouten könnte.

01:05:16.110 --> 01:05:17.730
Das müsste man mal ausprobieren.

01:05:18.590 --> 01:05:21.690
Aber dann hast du ja die ganzen anderen tollen Vorteile nicht,

01:05:21.750 --> 01:05:23.150
die das Frameset dir bietet.

01:05:23.330 --> 01:05:26.910
Nämlich, er würde schon noch Frames benutzen, aber er würde als Layout Mechanismus

01:05:26.910 --> 01:05:32.170
nicht die Attribute vom Frameset Element verwenden. Genau.

01:05:33.250 --> 01:05:37.250
Spannend. Eine extrem gute Idee. Auch das, Shep, herzlichen Glückwunsch.

01:05:37.350 --> 01:05:39.650
Diesen Gedanken hatte vor dir noch niemals jemand.

01:05:40.290 --> 01:05:45.450
Ja, das sollten wir mal tun. So Bleeding Edge trifft Prähistorik.

01:05:46.470 --> 01:05:49.410
Nee, wir machen Prehistory. Wir machen einfach so einen Wettbewerb.

01:05:49.410 --> 01:05:56.190
Wer kann irgendwie so eine gegebene Web-App implementieren und den All-Storm-Browser unterstützen.

01:05:56.490 --> 01:05:58.830
Wer runterkommt bis irgendwie zum Mosaik, der gewinnt.

01:06:01.110 --> 01:06:04.130
Ja, wobei da wird es mit Grid vielleicht dann da wieder ein bisschen schwieriger.

01:06:05.050 --> 01:06:09.070
Da muss man graceful degraden. Ja.

01:06:10.550 --> 01:06:15.130
Dafür kann man ja Frameset dann verwenden. Ja, müsste man mal ausprobieren.

01:06:16.150 --> 01:06:20.490
Und vielleicht kann man ja auch mit Clip Path oder so die Frames auch in eine

01:06:20.490 --> 01:06:21.670
andere Form bringen und so.

01:06:22.330 --> 01:06:26.590
Ah, ey, mir fällt grad ein, dass ich Framesets reimplementiert habe.

01:06:28.493 --> 01:06:33.773
Merke ich gerade. Okay. Nee, pass auf, weil ich habe mir ja so eine Web-Component gebaut, HTML-Import.

01:06:34.033 --> 01:06:37.573
Die macht ja einfach unter der Haube ein Fetch-Request, natürlich.

01:06:39.593 --> 01:06:44.193
Und lädt einfach HTML vom Server, kleidet das in ein Document-Fragment und dumpt

01:06:44.193 --> 01:06:47.393
das dann so zwischen seine Tags. Das ist so ein Custom-Element.

01:06:49.513 --> 01:06:55.453
Das ist ja ein iFrame halb, weil es ja nicht isoliert ist, und ein Frame auch

01:06:55.453 --> 01:06:56.513
nicht, weil es halb nicht isoliert ist.

01:06:56.513 --> 01:06:59.233
Es wird ja tatsächlich in die Webseite einfach so reingedumpt,

01:06:59.273 --> 01:07:03.493
also mehr so eine Art kleinseitiges Server-Site-Include, mehr oder minder,

01:07:03.633 --> 01:07:06.833
aber eigentlich ist das ja die gleiche Idee.

01:07:10.073 --> 01:07:13.633
Ich meine, das, was man wirklich aus so Framesets und so Sachen mitnehmen kann,

01:07:13.693 --> 01:07:16.453
wenn man jetzt mal wirklich so in der Historie stochert von diesen ganzen Geschichten.

01:07:19.093 --> 01:07:21.613
Was man ja wirklich machen kann, ist, man kann sich davon ja wirklich inspirieren

01:07:21.613 --> 01:07:24.213
lassen und ernsthaft so Dinge machen, wie du sie gerade beschrieben hast, Chad.

01:07:24.613 --> 01:07:27.853
Was ist, wenn ich so diese Capabilities hernehme und ich kombiniere die mit

01:07:27.853 --> 01:07:30.293
was Modernem, wie so Grid-Layout? Das ist ja per se erstmal eine vernünftige Idee.

01:07:31.253 --> 01:07:34.953
Oder was, wenn das Gleiche wie bei meinem HTML-Import, aber ohne halt diese

01:07:34.953 --> 01:07:36.413
Isolierung durch wirklich Frames?

01:07:37.153 --> 01:07:39.813
Also man kann das halt immer tatsächlich runterbrechen auf das,

01:07:39.893 --> 01:07:44.233
was ja tatsächlich so das theoretische Fundament ist von dem ganzen Webkrempel,

01:07:44.253 --> 01:07:46.573
also Hypermedia im weitesten Sinne,

01:07:47.333 --> 01:07:49.853
und sich einfach mal so angucken, was treiben die da eigentlich noch so,

01:07:49.913 --> 01:07:54.213
die da in den 60ern oder wann auch immer das war, das erstmals theoretisiert

01:07:54.213 --> 01:07:56.833
haben und was kann man sich von denen noch so klauen?

01:07:58.282 --> 01:08:01.522
Das sind ja unter anderem auch so Dinge wie sowas wie Turbolinks,

01:08:01.602 --> 01:08:06.022
wo du ja einfach eine Webpage runterlädst mit einem Linkklick tatsächlich und

01:08:06.022 --> 01:08:07.562
dann machst du da irgendwie Domdiffing oder Zeug.

01:08:07.582 --> 01:08:10.442
Dann fühlt es sich an wie eine Single-Page-Application, ohne dass dir das ist.

01:08:10.882 --> 01:08:15.802
Also finde ich gar nicht so schlecht, wenn man sich da mal in der Historie umtut.

01:08:15.802 --> 01:08:19.082
Aber ich erinnere mich jetzt auch nicht, wann ich zuletzt ein Frameset verwendet

01:08:19.082 --> 01:08:20.702
habe. Es muss extrem lange her sein.

01:08:21.262 --> 01:08:24.282
Also ich kann erzählen, dass ich damals meine erste Website,

01:08:24.362 --> 01:08:28.802
wo es um mein Schlagzeug ging und ich das gerne präsentieren wollte,

01:08:28.942 --> 01:08:33.422
auf jeden Fall auch mit Framesets gebaut habe und genau das gemacht habe,

01:08:33.482 --> 01:08:34.622
wie es eben skizziert wurde.

01:08:34.722 --> 01:08:36.742
Ein schöner Header, eine schöne

01:08:36.742 --> 01:08:41.142
Navigation, die auf jeder Seite gleich war und dann ein paar Bilder.

01:08:41.522 --> 01:08:45.162
Ja, ebenso, aber mit Frontpage habe ich das noch gemacht.

01:08:45.982 --> 01:08:51.262
Also nicht von Hand. Ja. Ja, ich war ja nicht der Dreamweaver-Typ.

01:08:53.562 --> 01:08:56.902
Cool, Dreamweaver auch sehr nice. Wie hieß noch mal das JavaScript-Framework,

01:08:56.942 --> 01:08:59.602
was die da drin hatten? Hatten die da eins drin?

01:09:00.602 --> 01:09:07.042
Später auf jeden Fall. Die haben immer diese JavaScript-Funktionen so für Rollover-Images,

01:09:07.282 --> 01:09:10.342
also wenn man mit der Maus drüber geht, dass die dann ausgetauscht wurden und so.

01:09:10.402 --> 01:09:16.302
Das war ja auch der heiße Scheiß. Das war immer MM für Makromedia ja und dann unterstrich.

01:09:18.222 --> 01:09:23.542
Ich dachte vielleicht, die hatten später noch mal so was wie Scriptaculous oder so da eingebaut.

01:09:24.762 --> 01:09:31.942
Für noch mehr Effekte. Nicht, dass ich wüsste. Vielleicht verwechsel ich es auch einfach. Genau.

01:09:35.119 --> 01:09:40.139
Das waren noch gute alte Zeiten. So, das heißt nächstes Projekt,

01:09:40.399 --> 01:09:43.599
Framesets steht nichts mehr im Wege, weil wir ja jetzt die ganzen neuen,

01:09:43.699 --> 01:09:47.899
den ganzen neuen heißen Scheiß auch verwenden können mit Framesets zusammen

01:09:47.899 --> 01:09:49.999
und auf einmal werden sie nützlich.

01:09:50.659 --> 01:09:54.219
Theoretisch, man kann das ja auch so machen, dass dann über einen History.push

01:09:54.219 --> 01:09:59.659
oder so, nee, PushState, dann auch die URL sich entsprechend anpasst.

01:09:59.699 --> 01:10:01.979
Da muss man nur noch eine kleine JavaScript-Funktion schreiben,

01:10:02.199 --> 01:10:04.979
die dann das entsprechende Frameset wieder reinlädt.

01:10:05.119 --> 01:10:06.599
Also ich glaube, es steht dem

01:10:06.599 --> 01:10:11.059
nichts im Wege, darüber auch eine tolle Single-Page-Application zu bauen.

01:10:11.219 --> 01:10:13.719
Also ganz ehrlich, wenn das wirklich funktioniert, dann kannst du auch völlig

01:10:13.719 --> 01:10:17.599
problemlos deine Navigationsleiste in einem Hamburger-Menü verschwinden lassen.

01:10:20.759 --> 01:10:23.819
Du meinst jetzt, wenn Grid funktioniert?

01:10:24.519 --> 01:10:26.699
Ja, genau. Wenn Grid oder generell alle sonstige funktioniert,

01:10:26.919 --> 01:10:29.979
dann kannst du hingehen und kannst dieses Hamburger-Menü hier einfach über die

01:10:29.979 --> 01:10:31.959
Popover-API steuern, wenn du auch magst.

01:10:37.719 --> 01:10:45.439
Ideen sind da. Ideen sind da. Ich glaube, es werden alle sich in die Arbeit stürzen. In die,

01:10:47.659 --> 01:10:51.819
naja, wie soll man das nennen? Sinnlos ist vielleicht nicht der triffende Begriff,

01:10:51.899 --> 01:10:56.099
aber vielleicht in einem hellen Raum.

01:10:56.479 --> 01:10:59.779
Es ist nicht sinnlos. Es ist wirklich, was du beschrieben hast,

01:10:59.819 --> 01:11:02.999
hat einen Wert, weil man einfach aus HTML sich was zusammenstückeln kann,

01:11:03.119 --> 01:11:05.599
ohne, du hast gesagt, du warst zu doof für PHP.

01:11:06.019 --> 01:11:09.459
Aber ich meine, vielleicht bist du ja nicht doof, sondern vielleicht hast du einfach keinen Server.

01:11:09.539 --> 01:11:12.679
Vielleicht ist ja deine Idee wirklich, ich will da irgendwie meine Anwendung,

01:11:13.279 --> 01:11:16.819
jemandem geben, als Haufen HTML-Dateien auf einem USB-Stick.

01:11:17.179 --> 01:11:19.899
So. Das heißt, ich hätte auch Server-Site-Includes nehmen können.

01:11:20.079 --> 01:11:22.739
Aber auch da auf die Idee bin ich nicht gekommen.

01:11:23.719 --> 01:11:27.179
Ja, aber du brauchst einen Server. Wie wäre es, wenn das einfach alles so ginge

01:11:27.179 --> 01:11:30.219
mit so Webseiten Vanilla? Ja.

01:11:30.879 --> 01:11:34.239
Das wäre gut. Also, ich meine, Ja.

01:11:36.181 --> 01:11:40.041
Die Idee, die ich noch zum Besten geben wollte, ist, wir können ja einen Wettbewerb

01:11:40.041 --> 01:11:43.681
ausrufen, zum Beispiel für jede Folge Glücksrad.

01:11:43.801 --> 01:11:47.421
Man muss dann immer so all das, was wir jetzt genannt haben,

01:11:47.501 --> 01:11:50.981
darf man nutzen und damit die geilste Experience bauen.

01:11:51.141 --> 01:11:54.341
Ihr erinnert euch vielleicht, früher gab es dieses CSS Tricks,

01:11:54.501 --> 01:12:00.441
was dann auch von dem Chris Collier, der dann irgendwie einmal im Jahr so einen

01:12:00.441 --> 01:12:04.681
CSS Wettbewerb gemacht hat. Mal.

01:12:04.961 --> 01:12:08.561
Genau. Und man hat halt einfach Unmengen an Zeit da reingeballert,

01:12:08.561 --> 01:12:13.681
am besten diese Experience zu bauen, die er da in irgendeinem Screenshot vorgegeben

01:12:13.681 --> 01:12:15.121
hatte oder wie auch immer.

01:12:15.501 --> 01:12:19.841
Ja, und die Leute haben ja auch die Zeit investiert. Also warum nicht auch mal für sowas, ne?

01:12:19.921 --> 01:12:23.981
Auch mal einen Working Draft Glücksrad Wettbewerb.

01:12:24.221 --> 01:12:27.261
Und die beste Einreichung kriegt dann irgendwas.

01:12:28.001 --> 01:12:31.981
Ja. Zum Beispiel die neueste Folge schon einen Tag früher oder.

01:12:33.061 --> 01:12:35.281
Okay, das heißt also Break Inside

01:12:35.281 --> 01:12:40.181
Paint Order On Unload, auch wenn der Back-Forward-Cache dabei kaputt geht.

01:12:40.421 --> 01:12:42.641
MIDI-Access, also mit Keyboard dran.

01:12:43.421 --> 01:12:46.281
Location, das heißt also, wir können nicht History Push machen,

01:12:46.381 --> 01:12:49.021
das muss dann schon Location.Replace oder so was sein.

01:12:50.001 --> 01:12:53.261
Destructuring dürft ihr benutzen. Fetch API Pop Over Target.

01:12:53.741 --> 01:12:59.501
Und wenn ihr Bock habt, könnt ihr noch XRPost da reinbauen, auch wenn ich nicht weiß, wofür es ist.

01:13:00.641 --> 01:13:06.121
Ja und das Frameset nicht zu vergessen also wenn das alles drin ist und je weniger

01:13:06.121 --> 01:13:12.661
andere Sachen man verwendet, desto mehr Punkte und je mehr man halt von dem

01:13:12.661 --> 01:13:14.341
was wir genannt haben verwendet.

01:13:15.701 --> 01:13:24.641
Desto mehr Punkte und je cooler die Experience, desto mehr Punkte Abzug gibt es nur für,

01:13:26.381 --> 01:13:27.361
was genau?

01:13:29.853 --> 01:13:34.493
Überlegen wir uns noch. Mein innerer Rules-Lawier geht schon drauf los und überlegt

01:13:34.493 --> 01:13:38.773
sich, wie man das alles uminterpretieren kann, damit das, damit ich das irgendwie

01:13:38.773 --> 01:13:40.693
dann trotzdem mit React und Angular bauen kann gleichzeitig.

01:13:41.353 --> 01:13:47.693
Du kannst ja ein eigenes JavaScript-Framework schreiben, was genau das hier

01:13:47.693 --> 01:13:51.553
verwendet, ja, und dann sieht das so aus, als würde man das nutzen,

01:13:51.693 --> 01:13:53.213
was wir jetzt vorgegeben haben.

01:13:54.553 --> 01:14:00.053
Aber eigentlich nutzt man was ganz anderes, weil es halt irgendwie halt umgedichtet wurde. Aber ey,

01:14:02.213 --> 01:14:05.853
wenn jemand sich meldet und hat was gebaut, wir freuen uns natürlich und es

01:14:05.853 --> 01:14:07.253
gibt auf jeden Fall einen Shoutout,

01:14:07.333 --> 01:14:10.933
aber einen Wettbewerb vielleicht erst dann in der nächsten Runde.

01:14:11.233 --> 01:14:14.333
Ja, aber ich fände es einen sehr guten Move, irgendwie React-Router zu klonen

01:14:14.333 --> 01:14:16.773
oder sowas und dann ein Priority-Quest zu machen, wo man es einfach alles durch

01:14:16.773 --> 01:14:18.473
Frames ersetzt hat, was die machen.

01:14:19.993 --> 01:14:21.033
Das fände ich schon gut.

01:14:23.473 --> 01:14:27.593
Okay, wir warten. Genau.

01:14:28.753 --> 01:14:31.513
Und zwar mindestens bis zur nächsten Sendung, weil ich würde sagen,

01:14:31.573 --> 01:14:34.653
wir sind hier auch an einem Dead End angekommen.

01:14:35.213 --> 01:14:38.553
Natürlich einem positiven. Ja, genau, wir sind bei Framesets angekommen.

01:14:38.613 --> 01:14:40.493
Ich glaube, wir haben alles gesagt, was es zu sagen gibt.

01:14:41.773 --> 01:14:47.333
Genau. Aber nächste Woche treffen wir uns natürlich wieder hier,

01:14:47.533 --> 01:14:56.573
finden wir uns ein und werden mit dem John Uhlmann über Farbräume sprechen. Oha, das ist super.

01:14:58.173 --> 01:15:02.293
Ja, ehrlich. Das ist ein sehr gutes Thema. Das ist extrem gut.

01:15:02.353 --> 01:15:04.153
Vor allen Dingen muss ich das mal ordentlich verklickert haben und ich habe

01:15:04.153 --> 01:15:05.773
eine ganze Batterie von fiesen Fragen.

01:15:07.293 --> 01:15:12.533
Ja, ich bei mir, also es hat auch sehr, sehr lange vom, ich habe zum ersten

01:15:12.533 --> 01:15:16.633
Mal darüber gehört, bis ich habe es wirklich gerafft, zumindest bin ich der

01:15:16.633 --> 01:15:19.933
Meinung, dass ich es gerafft habe, es hat sehr lange gedauert. Also ich sage mal so.

01:15:22.697 --> 01:15:26.757
So drei Jahre oder so. Hast du es denn schon in deinen Alltag integrieren können?

01:15:28.017 --> 01:15:31.137
Nee, habe ich nicht. Das ist nämlich das größte Ding.

01:15:31.257 --> 01:15:33.157
Also ich habe das Gefühl, immer wenn ich das irgendwem erkläre,

01:15:34.137 --> 01:15:36.037
man kann es ja relativ eindeutig demonstrieren.

01:15:36.377 --> 01:15:39.277
Oder man kann es ja den Leuten auch vorrechnen, wenn sie es wollen.

01:15:40.597 --> 01:15:42.877
Aber dann kommen halt so Fragen wie, okay, wie kriege ich das meinen Kollegen

01:15:42.877 --> 01:15:46.017
beigebogen? Kann das irgendwie die alte Photoshop-Version von vor 50 Jahren,

01:15:46.157 --> 01:15:49.797
die meine Kollegen benutzen, irgendwie so, daran hakt es halt.

01:15:50.577 --> 01:15:54.697
Ja, und auch Auch im Grunde hackt es ja auch bei jedem Vortrag,

01:15:54.697 --> 01:15:58.297
den man sich anguckt zu dem Thema, daran, dass der verdammte Beamer,

01:15:58.397 --> 01:16:04.457
über den diese Slides gezeigt werden, eben keinen erweiterten Farbraum unterstützt.

01:16:04.517 --> 01:16:08.297
Und man halt so, hä? Was ist da jetzt anders als sonst?

01:16:09.677 --> 01:16:13.177
Ja gut, aber den erweiterten Farbraum nicht, aber zumindest die cleverere geometrische

01:16:13.177 --> 01:16:15.697
Konstruktion kannst du ja an so einem Gradient schon demonstrieren.

01:16:15.857 --> 01:16:16.897
An einem Gradient geht das, ja.

01:16:17.897 --> 01:16:22.597
Aber wollen wir nächste Woche vielleicht machen? Hebt ihr euch noch ein bisschen

01:16:22.597 --> 01:16:24.437
Fleisch auf für die nächste Sendung?

01:16:24.897 --> 01:16:28.517
Peter, du bist dann dabei. Ich höre das schon raus. Ich bin dabei.

01:16:30.997 --> 01:16:34.997
Herrlich. Sagen wir auf jeden Fall vielen Dank fürs Zuhören.

01:16:35.357 --> 01:16:41.677
Jawohl. Wenn ihr Anmerkungen, Know-how oder Fragen habt, bitte gerne in unsere Richtung.

01:16:42.757 --> 01:16:50.277
Ihr findet uns auf Twitter, auf Mastodon und natürlich am liebsten auf Slack unter.

01:16:53.137 --> 01:16:59.677
Draft.community Dann hören wir uns nächste Woche wieder zum Thema Farbräume.

01:17:00.177 --> 01:17:05.857
Bis bald, auf Wiedersehen. Bis dann. Tschüssi. Tschüss.

01:17:07.760 --> 01:17:30.800
Music.

01:17:19.177 --> 01:17:25.637
Bis zum nächsten Mal.