masterarbeitsabschlussvortrag - Parallele Systeme
masterarbeitsabschlussvortrag - Parallele Systeme
masterarbeitsabschlussvortrag - Parallele Systeme
Erfolgreiche ePaper selbst erstellen
Machen Sie aus Ihren PDF Publikationen ein blätterbares Flipbook mit unserer einzigartigen Google optimierten e-Paper Software.
C A R L<br />
V O N<br />
O S S I E T Z K Y<br />
C A R L<br />
V O N<br />
O S S I E T Z K Y<br />
Vortrag<br />
FAKULTÄT II<br />
Jérôme Agater<br />
Transpilierte Sprachen<br />
JavaScript als Compiler-Ziel<br />
07. Juni 2011<br />
DEPARTMENT FÜR INFORMATIK<br />
ABTEILUNG FÜR PARALLELE SYSTEME
TRANSPILIERTE SPRACHEN<br />
VORSTELLUNG DES THEMAS<br />
Vorstellung des Themas<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
3
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
0. Vorstellung des Themas<br />
Was ist eine ‚Transpilierte Sprache‘ eigentlich?<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
4
TRANSPILIERTE SPRACHEN<br />
VORSTELLUNG DES THEMAS<br />
Was ist eine ‚transpilierte Sprache‘?<br />
▪ transpiliert – Kunstwort<br />
▪ lat. „trans“ für „herüber, über, über hinaus”<br />
▪ „compiler“ hier: für „Übersetzer”<br />
➡ Programmiersprache, die – anstatt in Maschinencode – in eine andere<br />
Programmiersprache (hier: JavaScript) übersetzt wird.<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
5
TRANSPILIERTE SPRACHEN<br />
VORSTELLUNG DES THEMAS<br />
Transpiler – Ein Spezialfall Frontend des Compilers<br />
Quellsprache<br />
Quellsprache<br />
Quellsprache<br />
Compiler<br />
Compiler<br />
Transpiler<br />
Compiler<br />
Zwischensprache<br />
Maschinensprache<br />
Zielsprache<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
.js<br />
JavaScript<br />
Backend<br />
Javascript-Engine<br />
Zielsprache<br />
08. JUNI 2012<br />
6
TRANSPILIERTE SPRACHEN<br />
VORSTELLUNG DES THEMAS<br />
Transpiler – Ein Spezialfall Frontend des Compilers<br />
Quellsprache<br />
Quellsprache<br />
Quellsprache<br />
Compiler<br />
Compiler<br />
Transpiler<br />
Compiler<br />
Zwischensprache<br />
Maschinensprache<br />
Zielsprache<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
.js<br />
JavaScript<br />
Backend<br />
Javascript-Engine<br />
Zielsprache<br />
Compiler-Ziel<br />
08. JUNI 2012<br />
7
TRANSPILIERTE SPRACHEN<br />
VORSTELLUNG DES THEMAS<br />
Transpiler – Ein Spezialfall Frontend des Compilers<br />
Quellsprache<br />
Quellsprache<br />
Quellsprache<br />
Compiler<br />
Compiler<br />
Transpiler<br />
Compiler<br />
Zwischensprache<br />
Maschinensprache<br />
Zielsprache<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
.js<br />
JavaScript<br />
Backend<br />
Javascript-Engine<br />
Zielsprache<br />
08. JUNI 2012<br />
Compiler-Ziel<br />
meist: Maschinencode<br />
8
TRANSPILIERTE SPRACHEN<br />
VORSTELLUNG DES THEMAS<br />
Transpiler – Ein Spezialfall Frontend des Compilers<br />
Quellsprache<br />
Quellsprache<br />
Quellsprache<br />
Compiler<br />
Compiler<br />
Transpiler<br />
Compiler<br />
Zwischensprache<br />
Maschinensprache<br />
Zielsprache<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
.js<br />
JavaScript<br />
Backend<br />
Javascript-Engine<br />
Zielsprache<br />
08. JUNI 2012<br />
9
TRANSPILIERTE SPRACHEN<br />
VORSTELLUNG DES THEMAS<br />
Transpiler – Ein Spezialfall Frontend des Compilers<br />
Quellsprache<br />
Quellsprache<br />
Quellsprache<br />
Compiler<br />
Compiler<br />
Transpiler<br />
Compiler<br />
Zwischensprache<br />
Maschinensprache<br />
Zielsprache<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
.js<br />
JavaScript<br />
Backend<br />
Javascript-Engine<br />
Zielsprache<br />
08. JUNI 2012<br />
Compiler-Ziel JavaScript<br />
10
TRANSPILIERTE SPRACHEN<br />
VORSTELLUNG DES THEMAS<br />
Transpiler – Ein Spezialfall Frontend des Compilers<br />
transpilierte<br />
Sprache<br />
Quellsprache<br />
Quellsprache<br />
Quellsprache<br />
Compiler<br />
Compiler<br />
Transpiler<br />
Compiler<br />
Zwischensprache<br />
Maschinensprache<br />
Zielsprache<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
.js<br />
JavaScript<br />
Backend<br />
Javascript-Engine<br />
Zielsprache<br />
08. JUNI 2012<br />
Compiler-Ziel JavaScript<br />
11
TRANSPILIERTE SPRACHEN<br />
VORSTELLUNG DES THEMAS<br />
Transpiler – Realisierung für eine Sprache<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
12
TRANSPILIERTE SPRACHEN<br />
VORSTELLUNG DES THEMAS<br />
Transpiler – Realisierung für eine Sprache<br />
‣ Backend für bestehende Compiler verwenden<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
12
TRANSPILIERTE SPRACHEN<br />
VORSTELLUNG DES THEMAS<br />
Transpiler – Realisierung für eine Sprache<br />
‣ Backend für bestehende Compiler verwenden<br />
‣ allgemeinen Transpiler verwenden<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
12
TRANSPILIERTE SPRACHEN<br />
VORSTELLUNG DES THEMAS<br />
Transpiler – Realisierung für eine Sprache<br />
‣ Backend für bestehende Compiler verwenden<br />
‣ allgemeinen Transpiler verwenden<br />
‣ eigenen Transpiler schreiben<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
12
TRANSPILIERTE SPRACHEN<br />
VORSTELLUNG DES THEMAS<br />
Transpiler – Realisierung für eine Sprache<br />
‣ Backend für bestehende Compiler verwenden<br />
‣ allgemeinen Transpiler verwenden<br />
‣ eigenen Transpiler schreiben<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
✔<br />
08. JUNI 2012<br />
12
TRANSPILIERTE SPRACHEN<br />
VORSTELLUNG DES THEMAS<br />
Masterarbeit<br />
1. Motivation – Warum nach JavaScript compilieren?<br />
2. Betrachtung der Compiler-Zielsprache JavaScript<br />
3. Untersuchung von drei transpilierten Sprachen<br />
4. Entwicklung der Web-Anwendung Collabri<br />
(Anfängliche Idee)<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
13
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
1. Motivation<br />
Warum nach JavaScript compilieren?<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
14
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivation = Web-Anwendungen entwickeln<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
15
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivation = Web-Anwendungen entwickeln<br />
‣ hohes Maß an Interaktion => clientseitig<br />
‣ Möglichkeiten<br />
▪ Plug-Ins<br />
▪ Java<br />
▪ Browser-eigene Programmiersprache<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
16
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivation = Web-Anwendungen entwickeln<br />
‣ hohes Maß an Interaktion => clientseitig<br />
‣ Möglichkeiten<br />
▪ Plug-Ins<br />
▪ Plug-Ins laufen nicht überall<br />
▪ Flash Plug-Ins nicht auf Mobile-Devices<br />
▪ Plug-Ins nicht ubiquitär verbreitet<br />
▪ Installation: Vorteile einer Web-Anwendung gehen verloren<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
17
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivation = Web-Anwendungen entwickeln<br />
‣ hohes Maß an Interaktion => clientseitig<br />
‣ Möglichkeiten<br />
▪ Java<br />
▪ Verbreitung sinkt<br />
▪ oft deaktiviert<br />
▪ braucht lange zum Start<br />
▪ langsam für GUIs<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
18
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivation = Web-Anwendungen entwickeln<br />
‣ hohes Maß an Interaktion => clientseitig<br />
‣ Möglichkeiten<br />
▪ Browser eigene Programmiersprache<br />
▪ nahezu immer verfügbar<br />
▪ braucht nicht lange zum Start<br />
▪ schnell<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
19
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivation = Web-Anwendungen entwickeln<br />
‣ hohes Maß an Interaktion => clientseitig<br />
‣ Möglichkeiten<br />
▪ Browser eigene Programmiersprache<br />
▪ nahezu immer verfügbar<br />
▪ braucht nicht lange zum Start<br />
▪ schnell<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
✔<br />
08. JUNI 2012<br />
19
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivation = Web-Anwendungen entwickeln<br />
‣ hohes Maß an Interaktion => clientseitig<br />
‣ Möglichkeiten<br />
▪ Browser eigene Programmiersprache<br />
▪ nahezu immer verfügbar<br />
▪ braucht nicht lange zum Start<br />
▪ schnell<br />
▪ einzige Programmiersprache im Browser: JavaScript<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
✗<br />
08. JUNI 2012<br />
20
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivation = Web-Anwendungen entwickeln<br />
‣ JavaScript hat einige ‚gute‘ Aspekte<br />
▪ alles ist ein Objekt*<br />
▪ Closures<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
21
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivation = Web-Anwendungen entwickeln<br />
‣ JavaScript hat einige ‚gute‘ Aspekte<br />
▪ alles ist ein Objekt*<br />
▪ Closures<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
21
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivation = kein JavaScript<br />
✗ JavaScript hat viele ‚schlechte‘ Aspekte*<br />
✗ keine alternativen Optionen<br />
✗ weitere Programmiersprache lernen<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
22
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivation = kein JavaScript<br />
✗ JavaScript hat viele ‚schlechte‘ Aspekte*<br />
✗ keine alternativen Optionen<br />
✗ weitere Programmiersprache lernen<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
✗<br />
22
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivation = kein JavaScript = andere Sprache<br />
‣ Ziel<br />
▪ bessere oder bereits bekannte Sprache verwenden können<br />
▪ keine Plug-Ins verwenden, kein Java verwenden<br />
‣ Mittel<br />
▪ auf die Programmierbarkeit zurückgreifen, dh. JavaScript<br />
‣ Strategien<br />
✗ Interpreter für diese Sprache in JavaScript schreiben<br />
✔ Diese Sprache nach JavaScript übersetzen (= transpilieren)<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
23
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivation = kein JavaScript = andere Sprache<br />
‣ Ziel<br />
▪ bessere oder bereits bekannte Sprache verwenden können<br />
▪ keine Plug-Ins verwenden, kein Java verwenden<br />
‣ Mittel<br />
▪ auf die Programmierbarkeit zurückgreifen, dh. JavaScript<br />
‣ Strategien<br />
✗ Interpreter für diese Sprache in JavaScript schreiben<br />
✔ Diese Sprache nach JavaScript übersetzen (= transpilieren)<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
✔<br />
23
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivation = Web-Anwendungen in<br />
anderer Sprache als JavaScript entwickeln können<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
24
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
2. JavaScript<br />
Was ist das eigentlich für eine Sprache?<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
25
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript – Zusammenfassend<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
26
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript – Zusammenfassend<br />
‣ Browser verfügbare Sprache<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
26
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript – Zusammenfassend<br />
‣ Browser verfügbare Sprache<br />
‣ heißt eigentlich ECMAScript<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
26
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript – Zusammenfassend<br />
‣ Browser verfügbare Sprache<br />
‣ heißt eigentlich ECMAScript<br />
‣ Script-Sprache<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
26
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript – Zusammenfassend<br />
‣ Browser verfügbare Sprache<br />
‣ heißt eigentlich ECMAScript<br />
‣ Script-Sprache<br />
‣ dynamische Programmiersprache<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
26
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript – Zusammenfassend<br />
‣ Browser verfügbare Sprache<br />
‣ heißt eigentlich ECMAScript<br />
‣ Script-Sprache<br />
‣ dynamische Programmiersprache<br />
‣ Java-ähnliche Syntax<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
26
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript – Zusammenfassend<br />
‣ Browser verfügbare Sprache<br />
‣ heißt eigentlich ECMAScript<br />
‣ Script-Sprache<br />
‣ dynamische Programmiersprache<br />
‣ Java-ähnliche Syntax<br />
‣ keine primitiven Datentypen, alles ist ein Objekt<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
26
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript – Zusammenfassend<br />
‣ Browser verfügbare Sprache<br />
‣ heißt eigentlich ECMAScript<br />
‣ Script-Sprache<br />
‣ dynamische Programmiersprache<br />
‣ Java-ähnliche Syntax<br />
‣ keine primitiven Datentypen, alles ist ein Objekt<br />
‣ Closures<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
26
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript – Zusammenfassend<br />
‣ Browser verfügbare Sprache<br />
‣ heißt eigentlich ECMAScript<br />
‣ Script-Sprache<br />
‣ dynamische Programmiersprache<br />
‣ Java-ähnliche Syntax<br />
‣ keine primitiven Datentypen, alles ist ein Objekt<br />
‣ Closures<br />
‣ Prototyp-basiert*<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
26
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript – Zusammenfassend<br />
‣ Browser verfügbare Sprache<br />
‣ heißt eigentlich ECMAScript<br />
‣ Script-Sprache<br />
‣ dynamische Programmiersprache<br />
‣ Java-ähnliche Syntax<br />
‣ keine primitiven Datentypen, alles ist ein Objekt<br />
‣ Closures<br />
‣ Prototyp-basiert*<br />
‣ Problembehaftet*<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
26
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript – Zusammenfassend<br />
‣ Browser verfügbare Sprache<br />
‣ heißt eigentlich ECMAScript<br />
‣ Script-Sprache<br />
‣ dynamische Programmiersprache<br />
‣ Java-ähnliche Syntax<br />
‣ keine primitiven Datentypen, alles ist ein Objekt<br />
‣ Closures<br />
‣ Prototyp-basiert*<br />
‣ Problembehaftet*<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
* gleich mehr…<br />
26
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript als Prototypen-basierte Sprache<br />
‣ Objekte sind nicht Instanzen von Klassen<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
‣ Ein Objekte erbt Methoden und Attribute direkt von einem anderen Objekt,<br />
seinem Prototyp (SELF).<br />
▪ dieser Prototyp kann wieder einen eigenen Prototypen besitzen<br />
▪ dadurch entsteht eine Verkettung von Prototypen<br />
▪ Die Wurzel aller Ketten ist das Objekt Object.prototype.<br />
27
TRANSPILIERTE SPRACHEN<br />
ERBT VON<br />
INSTANZ VON<br />
Prototypisch Klassisch<br />
.farbe<br />
.sorte<br />
.farbe<br />
.sorte<br />
Klasse Fruit<br />
def ivar: farbe<br />
Klasse Apfel<br />
def ivar: sorte<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
28
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript als Prototypen-basierte Sprache<br />
‣ Erzeugung dieser Prototypen-Verkettung:<br />
▪ Objekte werden durch Konstruktor-Funktionen erzeugt<br />
▪ var%anApple%=%new%Apple();<br />
▪ Konstruktor-Funktionen besitzen ein Attribut prototype<br />
▪ das darin abgelegte Objekt wird zum Prototyp von durch die<br />
Konstruktor-Funktion neu erzeugten Objekten<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
✗<br />
▪ d.h. der Prototyp von anApple ist das Objekt Apple.prototype<br />
▪ Der Prototype einer Konstruktor-Funktion kann geändert werden<br />
▪ Apple.prototype%=%new%Fruit();%//Äpfel%sind%nun%Früchte<br />
29
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
Prototypen-Beispiel<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
30
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
Prototypen-Beispiel<br />
function%Fruit()%{};<br />
Fruit.prototype.farbe%=%”rot”;<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
30
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
Prototypen-Beispiel<br />
function%Fruit()%{};<br />
Fruit.prototype.farbe%=%”rot”;<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
Object Konstruktor-Funktion<br />
.prototype =<br />
08. JUNI 2012<br />
Fruit Konstruktor-Funktion<br />
.prototype = .farbe<br />
30
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
Prototypen-Beispiel<br />
function%Fruit()%{};<br />
Fruit.prototype.farbe%=%”rot”;<br />
function%Apple()%{};<br />
Apple.prototype%=%new%Fruit();<br />
Apple.prototype.sorte%=%”Jonagold”<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
Object Konstruktor-Funktion<br />
.prototype =<br />
08. JUNI 2012<br />
Fruit Konstruktor-Funktion<br />
.prototype = .farbe<br />
30
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
Prototypen-Beispiel<br />
function%Fruit()%{};<br />
Fruit.prototype.farbe%=%”rot”;<br />
function%Apple()%{};<br />
Apple.prototype%=%new%Fruit();<br />
Apple.prototype.sorte%=%”Jonagold”<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
Object Konstruktor-Funktion<br />
.prototype =<br />
08. JUNI 2012<br />
Fruit Konstruktor-Funktion<br />
.prototype = .farbe<br />
Apple Konstruktor-Funktion<br />
.prototype = .sorte<br />
30
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
Prototypen-Beispiel<br />
function%Fruit()%{};<br />
Fruit.prototype.farbe%=%”rot”;<br />
function%Apple()%{};<br />
Apple.prototype%=%new%Fruit();<br />
Apple.prototype.sorte%=%”Jonagold”<br />
var%anApple%=%new%Apple();<br />
anApple.farbe;%//%rot<br />
anApple.sorte;%%//%Jonagold<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
Object Konstruktor-Funktion<br />
.prototype =<br />
08. JUNI 2012<br />
Fruit Konstruktor-Funktion<br />
.prototype = .farbe<br />
Apple Konstruktor-Funktion<br />
.prototype = .sorte<br />
30
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
Prototypen-Beispiel<br />
function%Fruit()%{};<br />
Fruit.prototype.farbe%=%”rot”;<br />
function%Apple()%{};<br />
Apple.prototype%=%new%Fruit();<br />
Apple.prototype.sorte%=%”Jonagold”<br />
var%anApple%=%new%Apple();<br />
anApple.farbe;%//%rot<br />
anApple.sorte;%%//%Jonagold<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
Object Konstruktor-Funktion<br />
.prototype =<br />
08. JUNI 2012<br />
Fruit Konstruktor-Funktion<br />
.prototype = .farbe<br />
Apple Konstruktor-Funktion<br />
.prototype = .sorte<br />
anApple<br />
30
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript als Problem<br />
✗ Globale Variablen<br />
▪ Konstruktor-Aufruf ohne new? anApple%=%Apple();<br />
➡ Alle neu-denierten Attribute werden globale Variablen<br />
▪ var vergessen? x%=%10;<br />
➡ Alle denierten Variablen werden zu globalen Variablen<br />
✗ Namensräume gibt es nicht<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
31
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript als Problem<br />
✗ Mangelnde Privatheit, denn Attribute sind immer public<br />
➡ Verletzte Kapselung<br />
✗ Attribute werden von außen gesetzt,<br />
➡ Kenntnis über Gültigkeitsbereichnotwendig<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
➡ Abhängigkeit nicht ersichtlich, Fehler wenn Gültigkeitsbereich sich<br />
ändert<br />
32
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript als Problem<br />
✗ Mangelnde Privatheit, denn Attribute sind immer public<br />
➡ Starke Kopplung<br />
✗ Attribute werden zur Implementationsschnittstelle<br />
✗ Änderungen der Implementierung eines Objekts<br />
➡ weitere Änderungen in anderen Bereichen notwendig<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
33
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript als Problem<br />
✗ Mangelnde Verläßlichkeit<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
✗ Die Prototypen-Ketten aller Objekte enden beim Objekt Object.prototype<br />
✗ Nur nicht, wenn Frames oder iFrames zum Einsatz kommen.<br />
✗ Jeder Frame enhält eine eigene Version von Object.prototype<br />
➡ Die Veränderung eines Object.prototype wirkt sich auf die anderen<br />
nicht aus.<br />
➡ Abjekte entsehen: Objekte, die nicht an der erwarteten Objekt-<br />
Hierarchie partizipieren<br />
34
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript als Problem<br />
✗ Mangelnde Fehlerbehandlung dynamischen Methodenaufruf<br />
✗ anObject.notExistingMethod()<br />
➡ TypeError<br />
✗ Keine Möglichkeit, anObject zu überlassen, wie darauf reagiert wird<br />
✗ (anders als bei anderen, dynamischen Sprachen wie Ruby, Smalltalk,<br />
Objective-C, …)<br />
✗ Im Prinzip try-catch-Block bei jedem Methoden-Aufruf notwendig,<br />
da Abjekte auftreten können<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
35
TRANSPILIERTE SPRACHEN<br />
S.O.<br />
Transpilierte Sprachen<br />
Eine Abhilfe?<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
36
TRANSPILIERTE SPRACHEN<br />
TRANSPILIERTE SPRACHEN<br />
Masterarbeit<br />
‣ Drei Sprachen betrachtet:<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
37
TRANSPILIERTE SPRACHEN<br />
TRANSPILIERTE SPRACHEN<br />
Masterarbeit<br />
‣ Drei Sprachen betrachtet:<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
37
TRANSPILIERTE SPRACHEN<br />
TRANSPILIERTE SPRACHEN<br />
Masterarbeit<br />
‣ Drei Sprachen betrachtet:<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
37
TRANSPILIERTE SPRACHEN<br />
TRANSPILIERTE SPRACHEN<br />
Masterarbeit<br />
‣ Drei Sprachen betrachtet:<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
Objective-J<br />
08. JUNI 2012<br />
37
TRANSPILIERTE SPRACHEN<br />
TRANSPILIERTE SPRACHEN<br />
Masterarbeit<br />
‣ Drei Sprachen betrachtet:<br />
‣ In diesem Vortrag nur eine<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
Objective-J<br />
08. JUNI 2012<br />
37
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Amber Transpiler<br />
‣ Zwei Phasen<br />
▪ Parsing<br />
▪ baut abstrakten Syntax Baum (abstract syntax tree, AST)<br />
▪ Code-Erzeugung<br />
▪ erzeugt aus AST JavaScript-Code<br />
Quellsprache Maschinensprache<br />
Amber-Smalltalk<br />
Quellsprache<br />
Quellsprache<br />
Transpiler<br />
Compiler<br />
Frontend<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
.js<br />
JavaScript<br />
Zwischensprache<br />
08. JUNI 2012<br />
Javascript-Engine<br />
39
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Amber Transpiler<br />
‣ Parsing<br />
▪ Parsing Expression Grammar (PEG)<br />
▪ formale Beschreibung eines Top-Down-Parsers<br />
▪ verwendet wird dazu Library peg.js (JavaScript)<br />
▪ früher verwendet: PetitParser (Amber)<br />
▪ linerare Zeit durch Memoisation<br />
▪ erzeugt AST<br />
Quellsprache Maschinensprache<br />
Amber-Smalltalk<br />
Quellsprache<br />
Quellsprache<br />
Transpiler<br />
Compiler<br />
Frontend<br />
▪ AST aus Amber-Objekten (Subklassen von Node) aufgebaut<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
.js<br />
JavaScript<br />
Zwischensprache<br />
08. JUNI 2012<br />
Javascript-Engine<br />
40
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Amber Transpiler<br />
‣ Code-Erzeugung<br />
▪ Compiler realisiert Entwurfsmuster Besucher (Visitor)<br />
▪ läuft Knoten des AST ab<br />
▪ für jeden Knoten wird zugehöriger JavaScript-Code erzeugt<br />
▪ direkte Umsetzung der Semantik wenn möglich<br />
▪ Variablenzuweisung<br />
Quellsprache Maschinensprache<br />
Amber-Smalltalk<br />
Quellsprache<br />
Quellsprache<br />
Transpiler<br />
Compiler<br />
Frontend<br />
▪ ansonsten Aufrufe ins JavaScript-Laufzeitsystem von Amber<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
.js<br />
JavaScript<br />
Zwischensprache<br />
08. JUNI 2012<br />
Javascript-Engine<br />
41
TRANSPILIERTE SPRACHEN<br />
BEISPIEL<br />
Beispiel<br />
|"a"|<br />
a":="5.<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
42
TRANSPILIERTE SPRACHEN<br />
BEISPIEL<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
43
TRANSPILIERTE SPRACHEN<br />
BEISPIEL<br />
‣ peg.js<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
assignment%%%%%=%variable:variable%ws%':='%ws%expression:expression%{<br />
% %%%%%%%% %%%%%return%smalltalk.AssignmentNode._new()<br />
% %%%%%%%% %%%%%% ._left_(variable)<br />
% %%%%%%%% %%%%%% ._right_(expression)<br />
% % %}<br />
expression%%%%%=%assignment%/%cascade%/%keywordSend%/%binarySend%/%…<br />
43
TRANSPILIERTE SPRACHEN<br />
BEISPIEL<br />
‣ peg.js<br />
‣ AssignmentNode<br />
left:"aNode<br />
% left%:=%aNode.<br />
% left%assigned:%true<br />
right:"aNode<br />
% right%:=%aNode<br />
accept:"aVisitor<br />
% aVisitor%visitAssignmentNode:%self<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
assignment%%%%%=%variable:variable%ws%':='%ws%expression:expression%{<br />
% %%%%%%%% %%%%%return%smalltalk.AssignmentNode._new()<br />
% %%%%%%%% %%%%%% ._left_(variable)<br />
% %%%%%%%% %%%%%% ._right_(expression)<br />
% % %}<br />
expression%%%%%=%assignment%/%cascade%/%keywordSend%/%binarySend%/%…<br />
43
TRANSPILIERTE SPRACHEN<br />
BEISPIEL<br />
‣ peg.js<br />
‣ AssignmentNode<br />
‣ Compiler<br />
left:"aNode<br />
% left%:=%aNode.<br />
% left%assigned:%true<br />
right:"aNode<br />
% right%:=%aNode<br />
accept:"aVisitor<br />
% aVisitor%visitAssignmentNode:%self<br />
visitAssignmentNode:"aNode<br />
% stream%nextPutAll:%'('.<br />
% self%visit:%aNode%left.<br />
% stream%nextPutAll:%'='.<br />
% self%visit:%aNode%right.<br />
% stream%nextPutAll:%')'<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
assignment%%%%%=%variable:variable%ws%':='%ws%expression:expression%{<br />
% %%%%%%%% %%%%%return%smalltalk.AssignmentNode._new()<br />
% %%%%%%%% %%%%%% ._left_(variable)<br />
% %%%%%%%% %%%%%% ._right_(expression)<br />
% % %}<br />
expression%%%%%=%assignment%/%cascade%/%keywordSend%/%binarySend%/%…<br />
43
TRANSPILIERTE SPRACHEN<br />
BEISPIEL<br />
‣ peg.js<br />
‣ AssignmentNode<br />
‣ Compiler<br />
‣ Resultat<br />
left:"aNode<br />
% var"a=nil; left%:=%aNode.<br />
% (a=(5)); left%assigned:%true<br />
right:"aNode<br />
% right%:=%aNode<br />
accept:"aVisitor<br />
% aVisitor%visitAssignmentNode:%self<br />
visitAssignmentNode:"aNode<br />
% stream%nextPutAll:%'('.<br />
% self%visit:%aNode%left.<br />
% stream%nextPutAll:%'='.<br />
% self%visit:%aNode%right.<br />
% stream%nextPutAll:%')'<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
assignment%%%%%=%variable:variable%ws%':='%ws%expression:expression%{<br />
% %%%%%%%% %%%%%return%smalltalk.AssignmentNode._new()<br />
% %%%%%%%% %%%%%% ._left_(variable)<br />
% %%%%%%%% %%%%%% ._right_(expression)<br />
% % %}<br />
expression%%%%%=%assignment%/%cascade%/%keywordSend%/%binarySend%/%…<br />
43
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Amber Laufzeitsystem<br />
‣ Nutzt prototypische Vererbung für Vererbung zwischen Klassen<br />
‣ eigene Routine für den dynamischen Methodenaufruf<br />
▪ smalltalk.send<br />
‣ eigene Routine für das Erzeugen einer Klasse<br />
▪ smalltalk.createClass<br />
‣ eigene Routine für das Hinzufügen von Methoden<br />
▪ smalltalk.addMethod<br />
‣ …<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
44
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Abhilfe für JavaScripts Probleme<br />
✗ ‚Quirky‘ Syntax & Semantik<br />
‣ simple Regeln<br />
‣ wenige Regeln<br />
‣ keine Sonderfälle<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
45
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Abhilfe für JavaScripts Probleme<br />
✗ ‚Quirky‘ Syntax & Semantik<br />
‣ simple Regeln<br />
‣ wenige Regeln<br />
‣ keine Sonderfälle<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
✔<br />
45
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Abhilfe für JavaScripts Probleme<br />
✗ Globale Variablen<br />
‣ gobale Objekte durch Laufzeitsystem<br />
‣ ansonsten genau ein globales Objekt smalltalk<br />
▪ Namensraum für alle Klassen und einige Hilfsmethoden<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
46
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Abhilfe für JavaScripts Probleme<br />
✗ Globale Variablen<br />
‣ gobale Objekte durch Laufzeitsystem<br />
‣ ansonsten genau ein globales Objekt smalltalk<br />
▪ Namensraum für alle Klassen und einige Hilfsmethoden<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
✔<br />
46
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Abhilfe für JavaScripts Probleme<br />
✗ Mangelnde Privatheit, denn Attribute sind immer public<br />
‣ Instanzvariablen von Amber sind Attribute in JavaScript,<br />
➡ Zugri auf Attribute möglich (über Methode basicAt: ),<br />
▪ aber kompliziert<br />
▪ wird nur für Implementierungszwecke genutzt<br />
▪ nicht jedoch allgemein<br />
‣ stattdessen Akzessor-Methoden<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
47
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Abhilfe für JavaScripts Probleme<br />
✗ Mangelnde Privatheit, denn Attribute sind immer public<br />
‣ Instanzvariablen von Amber sind Attribute in JavaScript,<br />
➡ Zugri auf Attribute möglich (über Methode basicAt: ),<br />
▪ aber kompliziert<br />
▪ wird nur für Implementierungszwecke genutzt<br />
▪ nicht jedoch allgemein<br />
‣ stattdessen Akzessor-Methoden<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
✔<br />
47
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Abhilfe für JavaScripts Probleme<br />
✗ Mangelnde Verläßlichkeit<br />
✗ Die Prototypen-Ketten aller Objekte enden beim Objekt Object.prototype<br />
➡ auch in Amber<br />
‣ Methoden-Aufruf wird über Routine smalltalk.send durchgeführt<br />
➡ prinzipiell ließen sich Abjekte abfangen<br />
✗ passiert aber nicht<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
48
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Abhilfe für JavaScripts Probleme<br />
✗ Mangelnde Verläßlichkeit<br />
✗ Die Prototypen-Ketten aller Objekte enden beim Objekt Object.prototype<br />
➡ auch in Amber<br />
‣ Methoden-Aufruf wird über Routine smalltalk.send durchgeführt<br />
➡ prinzipiell ließen sich Abjekte abfangen<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
✗ passiert aber nicht ✗<br />
48
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Abhilfe für JavaScripts Probleme<br />
✗ Mangelnde Fehlerbehandlung dynamischen Methodenaufruf<br />
▪ Methoden-Aufruf wird über Routine smalltalk.send durchgeführt<br />
➡ nicht existente Methoden werden entdeckt<br />
▪ Objekt wird durch Aufruf seiner Methode<br />
doesNotUnderstand: informiert und kann angemessen<br />
reagieren.<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
49
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Abhilfe für JavaScripts Probleme<br />
✗ Mangelnde Fehlerbehandlung dynamischen Methodenaufruf<br />
▪ Methoden-Aufruf wird über Routine smalltalk.send durchgeführt<br />
➡ nicht existente Methoden werden entdeckt<br />
▪ Objekt wird durch Aufruf seiner Methode<br />
doesNotUnderstand: informiert und kann angemessen<br />
reagieren.<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
✔<br />
49
TRANSPILIERTE SPRACHEN<br />
AMBER SMALLTALK<br />
Amber als Abhilfe für JavaScripts Probleme<br />
✗ Fazit:<br />
‣ Besser, aber noch nicht richtig gut.<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
50
TRANSPILIERTE SPRACHEN<br />
WEB-ANWENDUNG COLLABRI<br />
4. Web-Anwendung Collabri<br />
Entwickelt mit Amber Smalltalk<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
51
TRANSPILIERTE SPRACHEN<br />
WEB-ANWENDUNG COLLABRI<br />
Collabri<br />
‣ Gemeinsam an einer Pinnwand für Notizen arbeiten<br />
‣ Gruppen-Chat<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
52
TRANSPILIERTE SPRACHEN<br />
WEB-ANWENDUNG COLLABRI<br />
Collabri<br />
‣ Event-basierte Architektur (socket.io)<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
53
TRANSPILIERTE SPRACHEN<br />
WEB-ANWENDUNG COLLABRI<br />
Collabri<br />
‣ Event-basierte Architektur (socket.io)<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
‣ Model, ServerController<br />
in Amber<br />
53
TRANSPILIERTE SPRACHEN<br />
WEB-ANWENDUNG COLLABRI<br />
Collabri<br />
‣ Event-basierte Architektur (socket.io)<br />
‣ Model, View, Controller<br />
in Amber<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
‣ Model, View, Controller<br />
in Amber<br />
08. JUNI 2012<br />
‣ Model, ServerController<br />
in Amber<br />
53
TRANSPILIERTE SPRACHEN<br />
WEB-ANWENDUNG COLLABRI<br />
Collabri<br />
‣ Event-basierte Architektur (socket.io)<br />
‣ Model, View, Controller<br />
in Amber<br />
JSON<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
‣ Model, View, Controller<br />
in Amber<br />
JSON<br />
08. JUNI 2012<br />
‣ Model, ServerController<br />
in Amber<br />
53
TRANSPILIERTE SPRACHEN<br />
WEB-ANWENDUNG COLLABRI<br />
DEMO<br />
Collabri<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
54
TRANSPILIERTE SPRACHEN<br />
END OF LINE.<br />
Thanks for listening!<br />
Collabri<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
55
TRANSPILIERTE SPRACHEN<br />
CONTINUE<br />
Anhang!<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
56
Point3D<br />
TRANSPILIERTE SPRACHEN<br />
KLASSENHIERARCHIE<br />
Instanz<br />
Instanz<br />
x, y<br />
Instanz<br />
x, y, z<br />
Konstruktor-Funktion<br />
Prototyp<br />
z<br />
Klasse<br />
Point<br />
x<br />
y<br />
Klasse<br />
Point3D<br />
z<br />
Metaklasse<br />
Klasse der<br />
Klasse Point<br />
Metaklasse<br />
Klasse der<br />
Klasse Point3D<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
Klasse<br />
Metaklasse<br />
Klasse von …<br />
Oberklasse von …<br />
08. JUNI 2012<br />
57
TRANSPILIERTE SPRACHEN<br />
PROTOTYPEN-CHAOS<br />
Instanz<br />
Instanz<br />
Konstruktor-Funktion<br />
Point<br />
Prototyp<br />
x, y<br />
Konstruktor-Funktion<br />
Point3D<br />
Prototyp<br />
z<br />
Konstruktor-Funktion<br />
Function<br />
Prototyp<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
Konstruktor-Funktion<br />
Object<br />
Prototyp<br />
Prototyp von …<br />
bzw. vererbt an …<br />
08. JUNI 2012<br />
58
TRANSPILIERTE SPRACHEN<br />
AUSTAUCH EINES BACKENDS<br />
Quellsprache Zwischensprache Zielsprache<br />
Quellsprache<br />
Quellsprache<br />
Quellsprache<br />
Quellsprache<br />
Quellsprache<br />
Quellsprache<br />
Compiler<br />
Compiler<br />
Transpiler<br />
Compiler<br />
Compiler<br />
Transpiler<br />
Frontend<br />
Maschinensprache<br />
Anhang!<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
Compiler<br />
Frontend<br />
.js<br />
Zwischensprache<br />
JavaScript<br />
Maschinensprache<br />
Zwischensprache<br />
.js<br />
JavaScript<br />
Javascript-Engine<br />
Maschinensprache<br />
Backend<br />
Backend .js<br />
Javascript-Engine<br />
JavaScript<br />
Zielsprache<br />
JavaScript<br />
08. JUNI 2012<br />
59
TRANSPILIERTE SPRACHEN<br />
OMETA<br />
Genereller Transpiler OMeta<br />
‣ OO-Sprache für Pattern-Matching<br />
▪ subklassieren von bestehenden Parsern<br />
‣ variante der Parsing Expression Grammer<br />
▪ kann jede Form von Daten verarbeiten<br />
▪ linerare Zeit über Memoation<br />
‣ tokenizer, parser, visitor tree transformers<br />
‣ erweiterbar über objekt-orientierte Mechanismen<br />
‣<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
OMeta<br />
08. JUNI 2012<br />
60
TRANSPILIERTE SPRACHEN<br />
OMETA<br />
Genereller Transpiler OMeta<br />
Beispiele und Grafiken von:<br />
http://www.moserware.com/2008/06/ometa-who-what-when-where-why.html<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
61
TRANSPILIERTE SPRACHEN<br />
OMETA<br />
Genereller Transpiler OMeta<br />
Beispiele und Grafiken von:<br />
http://www.moserware.com/2008/06/ometa-who-what-when-where-why.html<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
61
TRANSPILIERTE SPRACHEN<br />
OMETA<br />
Genereller Transpiler OMeta<br />
Beispiele und Grafiken von:<br />
http://www.moserware.com/2008/06/ometa-who-what-when-where-why.html<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
61
TRANSPILIERTE SPRACHEN<br />
MOTIVATION<br />
Motivations-Beispiel<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
62
TRANSPILIERTE SPRACHEN<br />
MOTIVATIONSBEISPIEL<br />
Bachelorarbeit KerMod Web (2009)<br />
‣ webbasiertes Werkzeug zur Unterstützung der Moderation<br />
von Arbeit in Gruppen<br />
‣ Setzt serverseitig die Programmiersprache Smalltalk ein<br />
‣ Model-View-Controller-Architektur<br />
‣ View im Server, Browser ist nur…<br />
▪ Darstellungsmedium (HTML-Leinwand)<br />
▪ Informant für die View (‚Benutzer klickte da hin‘)<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
63
TRANSPILIERTE SPRACHEN<br />
MOTIVATIONSBEISPIEL<br />
Bachelor-Arbeit KerMod Web (2009)<br />
‣ webbasiertes Werkzeug zur Unterstützung der Moderation<br />
von Arbeit in Gruppen<br />
‣ Setzt serverseitig die Programmiersprache Smalltalk ein<br />
‣ Model-View-Controller-Architektur<br />
‣ View im Server, Browser ist nur…<br />
▪ Darstellungsmedium (HTML-Leinwand)<br />
▪ Informant für die View (‚Benutzer klickte da hin‘)<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
64
TRANSPILIERTE SPRACHEN<br />
MOTIVATIONSBEISPIEL<br />
Bachelorarbeit KerMod Web (2009)<br />
‣ Server hält für jeden Anwender gesamte Applikation bereit<br />
▪ Belastung (100 Requests/sec) :[<br />
▪ Client ist ‚dumm‘<br />
‣ Besser<br />
▪ Verzögerung<br />
▪ wenig elegant<br />
▪ Anwendung in jedem Client<br />
▪ nur Speicherung und Synchronisierung über Server<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
65
TRANSPILIERTE SPRACHEN<br />
MOTIVATIONSBEISPIEL<br />
Masterarbeit Collabri (2012)<br />
‣ Besser<br />
▪ Anwendung in jedem Client<br />
▪ nur Speicherung und Synchronisierung über Server<br />
‣ Problem<br />
▪ Client kann nur in JavaScript programmiert werden<br />
▪ Ich möchte auch für den Client in Smalltalk entwickeln<br />
‣ Abhilfe: Transpilierung von Smalltalk nach JavaScript<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
66
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript als Script-Sprache<br />
‣ Quelltext wird von ausführendem System verarbeitet<br />
‣ ausführendes System JS-Engine<br />
▪ Interpretierung<br />
▪ Bytecode-Compilierung & Interpretierung<br />
▪ Just-In-Time Compilierung zu Maschinencode<br />
‣ Geschwindigkeit von<br />
▪ Interpreter < Bytecode-Interpreter < JIT < nativem Programm<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
67
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript als Script-Sprache<br />
‣ Native Compilierung<br />
Quellsprache<br />
.js<br />
JavaScript<br />
Compiler<br />
Frontend<br />
JavaScript-Engine<br />
Zwischensprache<br />
Frontend Interpreter<br />
JavaScript-Engine<br />
Backend<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
Zielsprache<br />
08. JUNI 2012<br />
68
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript als Script-Sprache<br />
‣ Interpretierung<br />
Quellsprache<br />
.js<br />
JavaScript<br />
.js<br />
JavaScript<br />
Compiler<br />
Frontend<br />
JavaScript-Engine<br />
Zwischensprache<br />
Frontend Interpreter<br />
JavaScript-Engine<br />
Frontend<br />
JavaScript-Engine<br />
Bytecode<br />
Backend<br />
Interpreter<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
Zielsprache<br />
Zielsprache<br />
08. JUNI 2012<br />
69
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
Quellsprache<br />
JavaScript als Script-Sprache<br />
.js<br />
‣ Bytecode-Compilierung & Interpretierung<br />
JavaScript<br />
.js<br />
JavaScript<br />
.js<br />
JavaScript<br />
Compiler<br />
Frontend<br />
JavaScript-Engine<br />
Zwischensprache<br />
Frontend Interpreter<br />
JavaScript-Engine<br />
Frontend<br />
JavaScript-Engine<br />
Frontend<br />
Bytecode<br />
Bytecode<br />
Backend<br />
Interpreter<br />
Interpreter<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
JIT<br />
Zielsprache<br />
Zielsprache<br />
08. JUNI 2012<br />
70
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
Quellsprache Zwischensprache Zielsprache<br />
.js<br />
JavaScript<br />
JavaScript als Script-Sprache<br />
.js<br />
‣ Just-In-Time-Compilierung<br />
JavaScript<br />
.js<br />
JavaScript<br />
.js<br />
JavaScript-Engine<br />
Frontend Interpreter<br />
JavaScript-Engine<br />
Frontend<br />
JavaScript-Engine<br />
Frontend<br />
JavaScript-Engine<br />
Frontend<br />
Bytecode<br />
Bytecode<br />
Assembler<br />
Interpreter<br />
Interpreter<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
JIT<br />
Zielsprache<br />
Maschinencode<br />
08. JUNI 2012<br />
71
TRANSPILIERTE SPRACHEN<br />
JAVASCRIPT ALS COMPILERZIEL<br />
JavaScript als Prototypen-basierte Sprache<br />
‣ Vererbungs-Algorithmus<br />
▪ Wenn ein Attribut bei einem Objekt nicht vorhanden ist<br />
MASTERARBEITSABSCHLUSSVORTRAG JÉRÔME AGATER<br />
08. JUNI 2012<br />
▪ sucht das Laufzeitsystem beim Prototypen des Objekts nach dem Attribut<br />
▪ dann beim Prototypen des Prototypen usw.<br />
▪ bis die Methode gefunden wurde oder das Wurzel-Objekt Object.prototype<br />
erreicht wurde<br />
▪ andernfalls ist das Resultat der Wert ‚undenied‘<br />
72