Skip to content

System Implementation in Source Implementations

Bryan Loh edited this page Apr 19, 2021 · 7 revisions

This page contains developer information regarding the interaction between the Source Modules system and Source implementations js-slang.

Source Module Bundle

The Source Module Bundle is the core of the logic related to the Source Module provided functions. As explained in the Source Modules Implementation page here, the Source Module Bundle is served as an IIFE.

In the evaluation of the function application of the Source Implementation js-slang's runInContext method, the Source Module Bundle is consumed in both the interpretation step and transpilation step, only one of which will be used at any one time.

The following two subsections assumes that the reader understands the content highlighted in the System Implementation introduction to js-slang section here.

Transpiler

Source Modules System Transpiler Implementation

The transpilation step of the Source Implementations js-slang takes in a Source abstract syntax tree (Source AST) and performs some operations using the Source AST. The Source AST consists of import nodes that are the nodes that concerns the Source Modules system. These import nodes are converted from import statements in the Source program string. An example of such an import statement is shown below.

import { foo } from "bar";

As part of the Source program transpiler, the import nodes in the AST is used to determine which Source Modules the Source program requires and thereafter, for each import node, the corresponding Source Module, bundle and tabs, is fetched from the Source Module static server. The Source Module bundle is retrieved in the form of a JavaScript program string to be evaluated in the evaluation step of the transpilation process.

While the JavaScript Source Module files are being retrieved from the static server, the transpiler converts all the import declaration nodes in the Source AST into constant declarations. This is achieved by first assigning each imported Source Module to a unique identifier (eg. 0), and thereafter converting the imported variables to constant declaration statements. For example, the Source AST equivalent of the import statment above will be converted to the Source AST equivalent of the following.

const foo = __module_0__.foo;

When the transpilation process of the Source AST is completed, the resulting Source AST will be converted into a JavaScript program string through a process which generates the JavaScript code from the Source AST. The resulting JavaScript program string will thus include the above constant declaration statements at the front of the program string.

At this point, the Source Module bundle's JavaScript IIFE will be prepended with a constant declaration that assigns the result of evaluating the IIFE to the symbol corresponding to the Source Module. An example is shown below.

const __module_0__ = (function () { ... })());

This statement will then be prepended to the front of the JavaScript program string, resulting in the following.

const __module_0__ = (function () { ... })());
const foo = __module_0__.foo;

At the evaluation stage of the transpilation process, the JavaScript program string is evaluated by the Browser's built-in JavaScript evaluator, to return the result of the evaluation of the Source program string passed as an argument to the Source Implementation js-slang's runInContext.

Interpreter

Source Module Tab

The Source Module Bundle is the core of the code related to the Source Module's user interface in the Source Academy side content tabs.

Clone this wiki locally