Introducing Spider

The Next-Gen programming language for the Web

Spider is a programming language that compiles to JavaScript.

“What, another?” — you might ask. I started Spider because none of the existing languages that compile to JavaScript were perfect.

CoffeeScript has serious issues of ambiguous code, alien syntax and scoping problems.

TypeScript and AtScript try to fix the wrong problem by adding types. In addition, like ES6, they supersets of JavaScript, so they inherit all of its problems.

Dart is such a radical departure from JavaScript that it is not possible to interact directly with JavaScript libraries from Dart.

Spider tries to fix all of these. It clears the JavaScript minefield, and it is fully interoperable with third-party JavaScript code. It embraces prototypes and preserves JavaScript’s dynamic nature. It provides useful syntactic sugar that improve readability. It has a familiar, “boring” syntax. It also has full debugging support using source maps.

It’s just JavaScript, but better.

Spider was highly influenced by the What I Think CoffeeScript Should Have Been article series by Jeff Walker.

Note that spider is currently pre-alpha. It’s not ready yet. The purpose of this article is to see if there’s enough interest in it. Make sure to star the repo if you’re interested!

Safety

Even though Spider preserves JavaScript’s dynamic nature, it provides extra safety.

For example, in Spider, logical operators always result in a boolean value regardless of the types passed to it:

x = false or 5; // x == true;
x = 5 and 4;    // x == true;
x = 1 == "1";   // false (== compiles to ===)

In addition, all uses of global scope must be explicit:

::console.log("message"); // use :: to access global
use $; // pull global variables into the local scope explicitly
// because of 'use', the '$' doesn't need '::' before it
$("#myButton").click();

All code is compiled to JavaScript strict mode and is wrapped in IIFE.

It also has great error reporting:

Syntactic Sugar

Spider provides syntactic sugar that improves readability.

Arrow syntax

app.controller("MyCtrl", ($scope, MyService) -> {
    $scope.ready = () -> !MyService.isLoading;
});

The arrow syntax is a shorthand for the anonymous function syntax.

String Interpolation

console.log("Hello \(name), did you know that 2+2 = \(2+2)?");

You can use \(expression) inside strings to evaluate that expression.

Safe object navigation

var len = getCustomer()?.address?.name?.getFirstName?();

The null propagating operator (?.) allows safe object navigation by returning null if one of the object members is null or undefined.

Existential operator

if game? {
    console.log("Game is available!");
}

The existential operator (?) returns true if the expression is not null or undefined.

Null-Coalescing operator

var name = options.name ?? "default name";

The null-coalescing operator (??) returns the right expression if the left expression is null or undefined.

Prototype Inheritance

Instead of just adding classes, Spider provides an easy way to work with prototypes:

use console; 
func Entity(name, hp) {
    this.toString = () -> "Name: \(name), HP: \(hp)";
}
func Player(hp) extends Entity("John", hp) {
    this.toString = func() {
        return "Player \(super.toString())";
    };
}
var player1 = new Player(100);
var player2 = new Player(200);
console.log(player1.toString());
console.log(player2.toString());

In this example, we have an object called Entity and an object called Player that extends Entity.

The extends keyword is simply compiled into:

func Player(hp) {
    Entity.call(this, "John", hp);
    ...
}
Player.prototype = Object.create(Entity);

The super keyword provides access to the base object (Entity, in this case).

Interested?

Building a programming language is a lot of work, so I need to see if there’s enough interest in it. I’ve built a prototype with all of the above here: https://github.com/alongubkin/spider

If there’s enough interest, here are some of the additional features I’m going to add:

• DOCUMENTATION!!!
• Finish all JS operators
• Splats
• Conditional and loop expressions
• ES6 Classes (?)
• Function Binding
• Lambda/Array Manipulation
• Complex switch statements
• More syntactic sugar, of course!

Make sure to star the repo if you’re interested!