ActionScript Essentials
Transcrição
ActionScript Essentials
ActionScript Essentials Vorlesung: Dynamische Programmiersprachen Sascha Wolter wolter.biz | @saschawolter Mai, 2015 Image source: http://www.comicvine.com/ Was ist Flash? • • • Leistungsfähiges Autorensystem mit den Schwerpunkten Vektoranimation und Webdesign Filmmetapher und objektorientierte Herangehensweise Programmiersprache ActionScript (optional) Rich Applications Image sources: http://en.wikipedia.org/wiki/File:Gateway_Of_India.jpg Rich Application • Rich (Internet) Applications Desktop (Applikationen) Das Beste des Internets (Inhalte) • Austausch • Leistungsfähig • Integration Der englische Begriff „rich“ steht dabei für die „reichhaltigen“ Möglichkeiten wie z.B. Drag-und-Drop-Fähigkeit oder Bedienbarkeit über Tastenkürzel. Außerdem ist auch die Leistungsfähigkeit der Applikation gemeint, die z.B. Berechnungen auf Clientseite ausführen kann, ohne eine Anfrage zum Server starten zu müssen. Dadurch lassen sich RIAs viel flüssiger bedienen und geben Rückmeldungen sofort zurück. • Einfach •Allgegenwärtig • Standart • Verbunden Systemübergreifend (Kommunikation) • Echtzeit • Personalisiert • Übergreifend Man könnte diese Anwendungen auch "intelligente Clients" nennen. Natürlich sind diese Anwendungen Internet-optimiert (durch Komprimierung sowie StreamingTechniken). RIAs müssen zur Laufzeit weniger Anfragen an den Server stellen. LEGO-based Design Process 1. 2. 3. 4. 5. 6. 7. Choose a problem: Build a LEGO ship. Develop a vision: What sort of ship will it be? How big will it be? What will it carry? Build: Build the framework of the ship. Fill in the details: Design and build the details of the ship, ramps, doors, etc. Test: Drive the cars around the ship and sail the ship while exploring the house. Refine: Take parts of the ship apart and make them better. Learn: Take what you learned from building this ship and use it to build a better one next time. 1993, Jonathan Gay: “The human mind is much too limited to capture the entirety of a complex creation all at once. With LEGO, you can start with the vision and work out the details of the design as you progress.” (Quelle: www.adobe.com/macromedia/events/john_gay) Source: http://www.adobe.com/macromedia/events/john_gay/ SmartSketch bis Flash • • • 1994: SmartSketch 1995: SmartKetch Animator, anschließend Umbenennung in CelAnimator und FutureWave bietet Adobe den Kauf an 1996: FutureSplash Animator und Player, anschließend Verkauf an Macromedia und Flash 1 Aktionen 1997: Flash 2 Einfache Aktionen Normalmodus 1999: Flash 4 Einfache Aktionen Variablen und Werte Kontrollstrukturen Normalmodus Screencasts unter https://vimeo.com/channels/swf/ Wie Flash arbeitet! Flash Professional Browser Timeline and ActionScript Flash Player Flash Professional Timeline ActionScript Data Data Web Server Compile XML/HTTP REST SOAP Web Services Flash Remoting (AMF) J2EE Application Server .swf Existing Applications and Infrastructure Java / .NET / PHP / CGI ActionScript 1 2000: Flash 5 ActionScript 1 „Vollwertige“ Programmiersprache ECMA-262 konform XML OOP Debugger Expertenmodus 2002: Flash MX ActionScript 1 (und ActionScript 2) Video 9 Design versus Code - Scripting sucks? Trennen und Verheiraten • Entwurfsmuster – – – – – View Code Behind Model View Controller Presentation Model MVVM usw. • Bindungen – oneway, twoway • Ereignisse – Bubbling – Weiterreichen an das Modell – …oder gleich Methodenaufrufe! • Behaviors Model http://www.martinfowler.com/eaaDev/PresentationModel.html Vererbung 1.0 function Superclass() {} prototype Oberklasse Prototyp Unterklasse.prototype = new Oberklasse() function Subclass () {} Unterklasse prototype Prototyp Instanz = new Klasse() oder super Instanz __proto__ __proto__ ActionScript 2 2004: Flash MX 2004 ActionScript 2 abwärtskompatible zu Flash 6 Basiert auf ECMAScript 4 Klassenorientierte Programmierung Typsicher zur Kompilierzeit Normalmodus entfernt 2004: Flex 1.x und der Flex Builder ActionScript 2 Vererbung 2.0 class Superclass {} prototype Oberklasse Prototyp Unterklasse.prototype = new Oberklasse() class Subclass extends Superclass {} Unterklasse prototype Prototyp Instanz = new Klasse() oder super Instanz __proto__ __proto__ ActionScript 3 2006: Flex 2.x, Flex Builder 2.x MXML/ActionScript 3 2007: Flash CS3 ActionScript 3 AVM2 (ActionScript Virtual Machine, kurz AVM) 2013: Flash CC RIP AS1 und AS2 Screencast unter http://www.vimeo.com/7782849 Flash Player: AVM1 vs. AVM2 “Classic” AVM1 AVM2 Virtual Machine “Classic” Flash Player API AS3 Flash Player API Flash Player Capabilities (Networking, Rendering, Text, Sound, etc.) Browser / Operating System Flash Player: AVM2 • Arbeitsweise des Flash Players – – – – – – – – – – – – – Flash Player 9: AVM1 und AVM2 (komplett neu geschrieben) Neuer Bytecode mit ActionScript 3 ECMA-262/ECMAScript 4 (ActionScript 3) Namespaces Optionale Parameter und rest Argumente (wie in Java 5) Regular Expressions E4X (ECMAScript for XML) DOM Event Model (W3C DOM Events) und Function Closure Low Level API (z. B. Binäre Sockets) DisplayList Effizientere Typen Strenge Typisierung (dynamische Typisierung optional) Verbesserte Performance und weniger Speicherverbrauch durch „echte“ Klassen • Trait-Objekts (speicherschonend, schneller) • Sealed Classes (versiegelte Klassen) – Just In Time Compiler (JIT) – Laufzeitfehler – Laufzeit Typsicherheit Class definition Paket („Verzeichnis“) Klasse Basisklasse Konstruktur Methode Methode Die richtige Version wählen Aktionen ActionScript 1 ActionScript 2 ActionScript 3 2 5 (Flash Lite 1.x) 6 (Flash Lite 2.x) 9 Flash 2 Flash 5 Flash 6, MTASC Flash CS3, Flex SDK - ECMAScript 3 (JavaScript) ECMAScript 4 (JavaScript 2) ECMAScript 4 (JavaScript 2) Bytecode AVM1 AVM1 AVM1 AVM2 Performance mittel mittel mittel hoch steil steil mittel flach - ActionScript for Communication (SSAS) - - Flash Player Compiler Basiert auf Lernkurve Ähnliche Sprachen Finally, why? Reasons and Obstacles Penetration: http://www.adobe.com/products/flashruntimes/statistics.html Danke. ActionScript Essentials Sascha Wolter wolter.biz | @saschawolter Mai, 2015 Image source: http://www.comicvine.com/