Ich habe mehrere Open-Source-Tools zur visuellen Programmierung wie Blockly and Friends und andere bei Github gehostete Projekte gefunden, konnte jedoch keine finden, die direkt mit dem abstrakten Syntaxbaum zusammenarbeiten.
Warum das?
Ich frage, denn als ich herausfand, dass jeder Compiler eine Phase im Kompilierungsprozess durchläuft, in der er den Quellcode zu einem AST analysiert, war mir klar, dass einige visuelle Programmierwerkzeuge dies nutzen könnten, um dem Programmierer Möglichkeiten zu eröffnen um den AST direkt visuell zu bearbeiten und auch den Roundtrip von der Quelle zum Knotengraphen und bei Bedarf wieder zurück zur Quelle durchzuführen.
Zum Beispiel könnte man denken, dass es vom JavaScript AST Visualizer bis zum eigentlichen JavaSript Visual Programming Tool keinen allzu großen Unterschied gibt.
Also, was fehle ich?
Antworten:
Viele dieser Tools tun Arbeit direkt mit der abstrakten Syntaxbaum (oder besser gesagt, eine direkte Eins-zu-Eins - Visualisierung davon). Dazu gehören Blockly, die Sie gesehen haben, und die anderen blockbasierten Sprachen und Editoren wie es ( Scratch , Bleistift - Code / Droplet , Snap! , GP , Fliesen- Gnade , und so weiter).
Diese Systeme zeigen aus Gründen, die an anderer Stelle erläutert wurden (Platzbedarf und auch Interaktionsschwierigkeiten), keine herkömmliche Darstellung von Scheitelpunkten und Kanten, sondern stellen direkt einen Baum dar. Ein Knoten oder Block ist ein untergeordnetes Element eines anderen Knotens, wenn er sich direkt physisch im übergeordneten Element befindet.
Ich habe eines dieser Systeme gebaut ( Tiled Grace , Papier , Papier ). Ich kann Ihnen versichern, dass es sehr viel mit dem AST direkt zu tun hat: Was Sie auf dem Bildschirm sehen, ist eine exakte Darstellung des Syntaxbaums als verschachtelte DOM-Elemente (also ein Baum!).
Dies ist der AST eines Codes. Die Wurzel ist ein Methodenaufrufknoten "for ... do". Dieser Knoten hat einige untergeordnete Knoten, beginnend mit "_ .. _", der selbst zwei untergeordnete Knoten hat, einen "1" -Knoten und einen "10" -Knoten. Was auf dem Bildschirm erscheint, ist genau das, was das Compiler-Backend während des Prozesses ausgibt - im Grunde funktioniert das System so.
Wenn Sie möchten, können Sie sich das als ein Standard-Baumlayout vorstellen, bei dem die Kanten aus dem Bildschirm in Ihre Richtung zeigen (und durch den Block vor ihnen verdeckt sind). Verschachtelung ist jedoch eine ebenso gültige Möglichkeit, einen Baum als Scheitelpunkt darzustellen Diagramm.
Es wird auch "die Rundreise von der Quelle zum Knoten-Graphen und dann bei Bedarf wieder zurück zur Quelle" machen. Tatsächlich können Sie das sehen, wenn Sie unten auf "Codeansicht" klicken. Wenn Sie den Text ändern, wird er erneut analysiert und der resultierende Baum zur erneuten Bearbeitung gerendert. Wenn Sie die Blöcke ändern, geschieht dasselbe mit der Quelle.
Pencil Code macht im Wesentlichen dasselbe mit einer besseren Benutzeroberfläche . Die verwendeten Blöcke sind eine grafische Ansicht des CoffeeScript AST. Dies gilt auch für die anderen block- oder fliesenbasierten Systeme im Großen und Ganzen, obwohl einige von ihnen den Verschachtelungsaspekt in der visuellen Darstellung nicht so deutlich machen und viele keine tatsächliche Textsprache hinter sich haben, so dass " "Syntaxbaum" kann ein bisschen illusorisch sein, aber das Prinzip ist da.
Was Sie fehlen, dann ist, dass diese Systeme wirklich sind direkt mit dem abstrakten Syntaxbaum zu arbeiten. Was Sie sehen und manipulieren, ist eine platzsparende Darstellung eines Baums, in vielen Fällen wörtlich der AST, den ein Compiler oder Parser erzeugt.
quelle
Mindestens zwei Gründe:
Weil der Quellcode eine viel prägnantere Darstellung ist. Ein AST als Diagramm auszulegen, würde viel mehr visuelle Immobilien in Anspruch nehmen.
Programmierer schätzen, dass so viel Kontext wie möglich vorhanden ist, dh dass gleichzeitig so viel Code auf dem Bildschirm angezeigt wird. Der Kontext hilft ihnen, die Komplexität besser zu managen. (Das ist einer der Gründe, warum viele Programmierer diese verrückten kleinen Schriftarten und riesigen 30-Zoll-Bildschirme verwenden.)
Wenn wir versuchen würden, den AST als Grafik oder Baum anzuzeigen, wäre die Codemenge, die Sie auf einem einzelnen Bildschirm anzeigen könnten, viel geringer als bei der Darstellung als Quellcode. Dies ist ein großer Verlust für die Entwicklerproduktivität.
ASTs sind für die Compiler-Programmierung gedacht, nicht für das einfache Verständnis durch Programmierer. Wenn Sie eine vorhandene AST-Darstellung übernehmen und visuell darstellen, ist es für Entwickler wahrscheinlich schwieriger zu verstehen, da ASTs nicht so konzipiert sind, dass sie für Entwickler einfach zu erlernen sind.
Im Gegensatz dazu ist der Quellcode in der Regel so konzipiert, dass er von Entwicklern gelesen und verstanden werden kann. Dies ist normalerweise ein kritisches Designkriterium für Quellcode, aber nicht für ASTs. ASTs müssen nur von den Compiler-Autoren verstanden werden, nicht von alltäglichen Entwicklern.
Und in jedem Fall wäre die AST-Sprache eine zweite Sprache, die Entwickler zusätzlich zur Ausgangssprache lernen müssen. Kein Sieg.
Weitere mögliche Gründe finden Sie unter https://softwareengineering.stackexchange.com/q/119463/34181 .
quelle
Das typische AST von Compilern ist ziemlich komplex und ausführlich. Die gerichtete Graphendarstellung würde schnell schwer zu verfolgen sein. Es gibt jedoch zwei große Bereiche von CS, in denen ASTs verwendet werden.
quelle