View Transition API und Scroll-Driven Animations: Gamechanger für die hybride App-Entwicklung

Durch die rasend schnelle Weiterentwicklung von Web-APIs (Stichwort "Projekt Fugu") hat sich die Lücke, die zwischen Progressive Web Apps (PWA) oder hybriden Entwicklungsansätzen und den nativen Apps bestand, mehr und mehr geschlossen. Wenn es jedoch um das Thema Animationen geht, waren native Apps durch die Verfügbarkeit nativer Animations-APIs immer einen Schritt voraus. Komplexe Animationen wie Container Transforms waren bisher ohne immensen Aufwand in Web-Apps praktisch nicht zu realisieren.

Auch diese Lücke kann nun dank der neuen View Transition API und der Scroll-Driven Animations geschlossen werden. Und das beste daran: Alles geschieht fast ausschließlich per CSS.

Vorkenntnisse

• Grundlegende Kenntnisse in JavaScript und CSS

Lernziele

• Was bietet die View Transition API und wie funktioniert sie?
  
• Was bieten die Scroll-Driven Animations und wie funktionieren sie?
  
• Wie setzt man komplexe Animationen damit um?
  
• Wo liegen die aktuellen Grenzen der Technologien?