Statusreport 06.05.2024

Bearbeitete Arbeitspakete

1. Entwurf & Durchführung erster Orientierungs-Experimente
2. Design der Beispielanwendung “Instagram-Klon” mit 6 JS-Frameworks (Astro [+ React], Angular, Next JS, Nuxt JS, React und Vue)
3. Optimierung (5/6 Frameworks abgeschlossen, Astro fehlt noch)
4. Performance-Messunge per Skript angefangen

Aufgetretene Schwierigkeiten & Erfolge

Erfolge:

1. Eine Beispielanwendung konnte mit allen Frameworks umgesetzt werden und Messungen konnten per Skript umgesetzt werden.
2. Es zeigen sich bereits erste Lücken im Plugin-Angebot für meherere Frameworks auf.
3. Der Performanceunterschied und Unterschied in der Developer-Experience im Optimierungsprozess wird bereits deutlich.

Probleme:

1. In kleinen Anwendungen ist das Verhältnis von Optimierungspotential bzgl. HTML, JS, CSS und Medien sehr stark auf Medien beschränkt.
2. Die automatische Optimierung und das Laden von Bilddateien, die dynamische Pfade haben ist für Nicht-SSR (Server-side Rendering) Framworks nur schwer umzusetzen.
3. Die häufig genutzten Tools Lighthouse CLI und Playwright zur Performancemessung bieten entweder nur stark schwankende oder schwer auslesbare Messergebnisse (Bsp: Lighthouse Performance Score schwankt um bis zu 30 von 100 Punkten in lokaler Umgebung).

Einfluss auf den Projektplan: mögl. Verzögerung des Milestones 3. Presentable Information um ca. 9 Tage

Erreichte Milestones & Status des aktuellen Milestones

erreichte Milestones: 2. Experimenterahmen festgestellt

aktueller Milestone: 3. Presentable Information

Status: ausstehend (um ca. 9 Tage verzögert)

Anstehende Aufgaben in der nächsten Reportperiode

1. Fertigstellung der optimierten Anwendung mit Astro
2. Wiederholung der Experimente mit Optimierungen
3. Auswertung und Vergleich der Ergebnisse
4. Fokussierung auf Schwerpunkt der Arbeit
5. 2.Recherchephase

Evtl. notwendiges Handeln & Meetings

Meeting zur Festlegung des Schwerpunkts

Zur Auswahl stehen (soweit ich es jetzt einsehen kann):

1. Entwurf & Entwicklung eines Plugins zur Optimierung von Bild- und Videodateien
2. Untersuchung des JavaScripts in dynamischen Komponenten, Stichwort: Reactivity
3. Evaluation / Entwicklung einer Testumgebung, die die “echte” Performance (z.B. Page Load Time) misst und Entwicklern leicht ermöglicht, bspw. als HTML-Attribut load-budget="1500ms"