Aus ProgrammingWiki
| Wissen | Können | Projekt |
|---|
- Synchrone und asynchrone Verarbeitung
- Bedeutung von asynchronen Callback-Funktionen
- Unterschied zum Threading
| - Zeitgesteuertes Ausführen von Aktionen
- Auslagerung von Funktionen in Webworker
| - Sekundenanzeige, startet bei 0 wenn ein neues Sudoku erzeugt wird, stoppt wenn das Sudoku erfolgreich gelöst ist
- Wird 30 Sekunden lang kein Sudoku-Wert geändert, so wird ein Fehler-Feld oder ein eindeutig lösbares Feld hervorgehoben
- Erfolgt weitere 30 Sekunden keine Änderung, so wird ein hervorgehobenes Fehler-Feld geleert bzw. ein eindeutig lösbares Feld aufgelöst
- Auslagerung der Sekundenmessung in einen Webworker
|
Asynchrone Verarbeitung
| - Die Ausführung von Javascript-Code erfolgt immer im gleichen Thread und damit nacheinander. Führen Sie das Beispiel aus und machen Sie sich klar, welche Farbe für welchen Code steht.
- Warum wird der Balken in orange als erstes gezeichnet?
- Machen Sie sich bewusst, was setInterval und setTimeout eigentlich tun und erklären Sie so die Funktionsweise dieses Beispiels
- Erklären Sie warum die Funktionsausführung stoppt
- Modifizieren Sie den Code, sodass zwischen dem blauen und dem dunkelgrünen Balken ein hellblauer erscheint
- Modifizieren Sie den Code, sodass hinter jedem roten Balken sofort ein rosa Balken gezeichnet wird
|
| - Führen Sie das Codebeispiel aus. Versuchen Sie ggf. auch größere Primzahlen. Bemerken Sie den Unterschied? (Achten Sie auch auf die Reaktionsfähigkeit des Browsers)
- Erklären Sie die unterschiedlichen Verhaltensweisen mit Ihrem Wissen über die Funktionsweise von setTimeout
- Erklären Sie den Unterschied in der Laufzeit der Algorithmen
- Modifizieren Sie das Beispiel, sodass anstelle der Primzahlprüfung die entsprechende Fibonacci-Zahl berechnet wird und vergleichen Sie die Methoden
|
Webworker
| - Probieren Sie das Beispiel aus. Wählen Sie ggf. auch größere Primzahlen. Beobachten Sie die Systemauslastung Ihres Rechner und erklären Sie warum der Browser nicht blockiert.
- Kopieren Sie das Beispiel in ein lokales Projekt und führen Sie es mit Firefox aus. Debuggen Sie den Webworker um die Parameterübergabe nachzuverfolgen.
(Hinweis: Unter "about:config" muss der Eintrag "devtools.debugger.workers" auf "true" gesetzt werden, um das Debuggen paralleler Threads zu aktivieren) - In diesem Beispiel wird der Webworker direkt mit dem auszuführenden Code initialisiert. Recherchieren Sie wie Webworker mit eigenständigen Javascript-Dateien initialisiert werden und stellen Sie Ihren Code entsprechend um.
- Recherchieren Sie die Bedeutung von importScripts in diesem Zusammenhang
- Im Code eines Webworker verweist this nicht auf das window Objekt. Welches Objekt wird stattdessen angeboten und welche Möglichkeiten bringt es mit sich?
|