Going global

When I announced the release of JS.Class 2.1.5 – the first release to support a CommonJS platform, Node.js – I told you:

If you want JS.Packages to find your object, do not declare it with var.

I also told you I’d explain why, but it turns out the topic is rather more complicated than I thought. So here we are.

First things first: why am I advocating global variables? Well, JS.Packages uses object detection to figure out if a component you want to use is already loaded, and the only way to do this in JavaScript (please correct me in the comments) is to scan the global namespace, starting from the global object. Code in one CommonJS module cannot see what variable bindings exist in another, but both should be able to see the global context, which is why JS.Packages can figure out which global objects your code can see. And, while I admire the various efforts people are going to to improve JavaScript packaging, most of these efforts require special instructions to be added to your source code and I want JS.Packages to be able to load any code off the web without modification.

The upshot of this is that, if you want JS.Packages to be able to load your code, you must place the objects your code defines in the global scope so the package loader can verify that they exist. Which begs the question, how to I make a global variable?

For a long time I thought this was easy. In fact, I know a couple of ways to do it:

GLOBAL_VAR = 'ohai!'
this.I_SEE = 'what you did there'

It turns out that neither of these creates a truly global variable on all JavaScript platforms. They both work in browsers, but that’s about where it stops.

To understand this, we need to revisit how JavaScript performs scoping. In the browser, all code executes in a single context: no matter which file a piece of code is in, any variables it creates in the top level (or without using the var keyword) become global, visible to all other scripts running on the page. Global variables are actually properties of the global object, which in browsers can be accessed using this when outside a method call.

But on systems that use the CommonJS module system, things are a little different. Each file executes in its own context that inherits from the global context: imagine wrapping (function() { ... })() around the file’s contents and you’re close. So variables declared using var in the top level do not become global, they are confined to be visible only within the current file.

So far, so good. Now here’s where things get confusing. That bit about wrapping (function() { ... })() around a file’s content? Lies. If this were strictly true, this at the top level of a file would still refer to the global object, and it turns out that on some platforms this is not the case. In fact, what it refers to is implementation-dependent.

Consider the following script:

var outer = this, inner;
GLOBAL_VAR = 'global';

(function() { inner = this })();

var global = (typeof global === 'undefined')
           ? undefined
           : global;

if (typeof print !== 'function')
  print = function(s) { require('sys').puts(s) };

print('outer === inner:  ' + (outer === inner));
print('outer.hOP():      ' + outer.hasOwnProperty('GLOBAL_VAR'));
print('inner.hOP():      ' + inner.hasOwnProperty('GLOBAL_VAR'));
print('typeof global:    ' + typeof global);
print('outer === global: ' + (outer === global));
print('inner === global: ' + (inner === global));

This script tests several things:

  • The binding of this at the top level
  • The binding of this within a function call
  • Which object var-less assignments add properties to
  • Whether there is a global reference, and what it refers to

Let’s start by running this using the V8 shell, a pretty standard JS environment that’s similar to browsers in terms of scoping:

$ v8 scope.js 
outer === inner:  true
outer.hOP():      true
inner.hOP():      true
typeof global:    undefined
outer === global: false
inner === global: false

So this refers to the same object at the top level and within a function call, and global variable declarations become properties of this object. It’s a safe bet that this is the global object, then. There’s no global reference in this environment. Running this with SpiderMonkey or in browsers will yield roughly similar results.

Let’s try Node:

$ node scope.js 
outer === inner:  false
outer.hOP():      false
inner.hOP():      true
typeof global:    undefined
outer === global: false
inner === global: false

Here, the top-level this is not the same as a function body this, and it looks like global variables are added to the object that’s referenced by this inside a function body: the top-level this is not the global object! So far, it’s looking like this is a pretty good way to get a reference to the global object:

var global = (function() { return this })()

Let’s carry on and try Narwhal:

$ narwhal scope.js 
outer === inner:  true
outer.hOP():      true
inner.hOP():      true
typeof global:    object
outer === global: false
inner === global: false

So now, inner and outer are the same again, and there’s a global object, but it’s not the same as outer or inner. Global variables appear to get added to the latter, so global doesn’t appear to be the global object. Weird. And RingoJS (another Rhino-based platform) produces the same output.

Now all this seems kind of irrelevant, since we know putting an assignment without a var produces a global variable. Except, it might not. Or at least, it might add the variable as a property to an object you don’t expect, which makes various object detection techniques fail. For example, creating a global variable in some Rhino frameworks adds a property to the global object, not the top-level this object. Except in the Rhino shell, global actually refers to a function, and top-level this is the global object.

So to cut a long story short, here’s how I’m currently getting a reference to the global object. You must place this code inside a function body, to deal with Node-like CommonJS implementations.

(function() {
  var GLOBAL = (typeof global === 'object') ? global : this
})()

You can store a reference to it for future use to make things easier, for example this is how I initialize JS.Class these days:

(function() {
  var GLOBAL = (typeof global === 'object') ? global : this
  GLOBAL.JS = GLOBAL.JS || {}
  JS.ENV = GLOBAL
})()

Assigning to GLOBAL.JS makes a new global variable, and I then store a reference to the global object as JS.ENV, which is where JS.Packages begins its search for objects. You now have a globally visible reference to the global object, and any properties you add to it will become global variables that you can refer to without the GLOBAL prefix.

Loading the right implementation using JS.Packages

Following on from my talk on cross-platform JavaScript testing, I got a question on loading platform-specific code without wasting bandwidth. In the example, I went through building a Twitter API client that works in browsers and in Node, and ended up factoring toward a design that looks like this:

Twitter = new JS.Class('Twitter', {
  search: function(query, callback) {
    var resource = 'http://search.twitter.com' +
                   '/search.json?q=' + query

    Net.getJSON(resource, callback)
  }
})

where Net would encapsulate the logic for how to do HTTP on different platforms. That is, it would look something like this:

Net = {
  getJSON: function(url, callback) {
    if (typeof document === 'object')
      // make call using JSONP
    else
      // make call using Node HTTP library
  }
}

The problem with this is that, if you’re using such a library in a browser, you don’t want to waste bandwidth on loading code that isn’t applicable to the current environment. This is true for server-side code, and for code for other browsers. For example you don’t want to load a lot of code for dealing with Internet Explorer if your application is running on a phone.

So a common refactoring we can use is to split this module into two objects with an identical interface but different implementations. We can put each implementation in its own file so it can be loaded separately.

// source/net/jsonp.js
Net = {
  getJSON: function(url, callback) {
    // make call using JSONP
  }
}

// source/net/node.js
Net = {
  getJSON: function(url, callback) {
    // make call using Node HTTP
  }
}

This has the added benefit of removing the overhead of an if statement from the code, and makes it easier to maintain each implementation independently.

With the code split out like this, we can use JS.Packages to pick the right implementation to load:

JS.Packages(function() { with(this) {
  file('source/twitter.js')
    .provides('Twitter')
    .requires('Net')
  
  var netpath = (typeof document === 'object')
              ? 'source/net/jsonp.js'
              : 'source/net/node.js'

  file(netpath).provides('Net')
}})

This is one advantage of basing a package system on object names: the package manager can figure out the best way to satisfy an object requirement so this logic doesn’t clutter your application code.

Also, because JS.Packages uses object detection to figure out whether an object needs to be loaded, we can use it to simply fill in missing browser APIs. For example, I have a toy project called Pathology, which is a bug-ridden slow implementation of half of the document.evaluate() API for Internet Explorer, letting you use XPath to query the DOM. Most other browsers have this built-in, but loading an implementation just for IE is as simple as:

JS.Packages(function() { with(this) {
  file('/lib/pathology.js').provides('document.evaluate')
}})

Then, when you JS.require('document.evaluate'), no extra files will be loaded in browsers that already support this interface natively. In browsers without this API, the external file will be loaded to fill in the functionality.

Whether you use conditional code to pick a file path to load, or use a more complex loader function is a question of taste and of the complexity of detecting which components you need to load on your target platforms. Either way, this system is a nice example of why in many cases I prefer executable code with a simple DSL over static data for configuration tasks.

Cross-platform JavaScript testing

Last week I gave a talk at the London Ajax User Group on testing JavaScript software across different platforms. I wanted to share the talk with a wider audience so what follows is an essay version of the talk; it’s what I planned on saying before I got nervous, fluffed my lines and spoke too fast.

I want to start with a quick history lesson. Cast your mind back to 2006. We had a few browsers out in the wild, not as many as are in mainstream use as today but enough to give us a headache, especially with IE6 still dominating the stats. The problem we had back then was that all the browsers behaved in slightly (sometimes vastly) different ways and had different scripting APIs. Standards were being slowly rolled out but the overhead of dealing with browser quirks was still very high.

So, around 2005 and 2006 we see two projects that try to fix the situation: Prototype and jQuery. They both aimed to normalize and improve the scripting API across all browsers, so you could be more productive and be more confident that your code would work across the board. They’ve both been really successful and since then we’ve seen a lot more projects that have their own take on how we should tame the browsers; projects like YUI, MooTools and Dojo.

Skip forward five years, and the landscape looks quite different. We’ve got a few more browsers in mainstream use, especially with the mobile web becoming a mainstream platform, but we’ve also got JavaScript being used all over the place. People are finally taking it seriously for server-side work, it’s being embedded in databases, it’s everywhere. Node has kick-started this, but there’s a ton of frameworks based on Rhino.

So what’s the problem this time? Well, it’s not so obvious. These platforms all have different APIs but that’s largely because they’re used for different things; you probably don’t care that your web front-end won’t run on CouchDB. But one of the promises we’ve heard for years and years about server-side JavaScript is that it’ll amplify code reuse. You’ll be able to share business logic between the client and the server. Remember ‘write once, run anywhere’? We were actually going to make that work.

But what we’re actually seeing is needless specialization. Application frameworks for Node, testing libraries for Node, template languages for Node, API clients for Node. I don’t mean to pick on Node; it’s been the same with jQuery, although fortunately jQuery became so pervasive that depending on it wasn’t so much of a problem. But we’re seeing the same pattern all over again with Node and this seems like a wasted opportunity to me. Node’s popularity is bringing client-side developers onto the server, and it would be great of this helped unify our efforts.

Now I didn’t want to single any particular project out for criticism, because really I’m just as guilty as anybody else. I maintain a project called Faye which bills itself as a pub/sub messaging server for Node. But the truth is, most of the internal logic about managing clients and subscriptions is just pure JavaScript, Node is just used to make this logic accessible over the Internet. You could probably tear the Node part out and run the server in a browser, if you felt like it.

So we have a problem with portabilty, we’re wasting time reinventing the same wheels on every platform we migrate to. And to solve this, to help us share more code, I don’t think we need to normalize APIs like we did in the browser. Variety and innovation are good things, and people should have some choice about which platforms they target. But for those of us that want to write cross-platform code, I think we’re going to need testing tools that work everywhere.

Now, some back story. Since 2007 I’ve been working on this project called JS.Class. It’s an object system for JavaScript that’s based on Ruby, so it gives you classes and mixins and a few of Ruby’s object methods. It comes with a class library of common object-oriented idioms and data structures, and it tries to establish some conventions for things like how to compare objects for equality, how to sort them, store them in hash tables, and what-have-you.

OrderedHash = new JS.Class('OrderedHash', {
  include: JS.Enumerable,
  
  initialize: function() {
    // ...
  },
  
  forEach: function(callback, context) {
    // ...
  }
})

It lets you make a class like this. Say I want a new data structure, which we’ll call an ordered hash. I can create it, add the Enumerable methods to it, give an initializer, tell the Enumerable module how to iterate over it, and add other methods. Pretty standard stuff.

Then some time in around 2009, I added JS.Packages. It’s a package manager, and the aim is to seperate out the logic of how to load code and dependencies from the code itself. So you say I’ve got this file /lib/ordered_hash.js, it defines OrderedHash, and it depends on JS.Class and JS.Enumerable. You can use local files or files off other domains. Then when you need to use an object you just require() it and JS.Packages will make sure it’s loaded then run your code.

JS.Packages(function() { with(this) {
  
  file('/lib/js/ordered_hash.js')
    .provides('OrderedHash')
    .requires('JS.Class', 'JS.Enumerable')
  
  file('http://cdn.google.com/jquery.js')
    .provides('jQuery', '$')
}})

JS.require('jQuery', 'OrderedHash', function() {
  var links = $('a'),
      hash  = new OrderedHash()
  
  // ...
})

The reason it focuses on object names rather than file paths is because I also wanted to use it to load code from libraries with their own loaders. For example, Google has this thing where you include a seed file, and then use the google.load() function to load more components. Using JS.Packages, you can have custom loader functions that bridge to other platforms’ loading systems, so I can use the same system to load all the objects I want to use. This abstraction also means I can use the same configuration to load code on non-browser platforms; JS.Packages can figure out how to load external files based on the environment.

JS.Packages(function() { with(this) {
  
  file('https://www.google.com/jsapi?key=INSERT-YOUR-KEY')
    .provides('google.load')
  
  loader(function(onload) {
    google.load('maps', '2', {callback: onload})
  })
    .provides('google.maps')
    .requires('google.load')
}})

JS.require('google.maps', function() {
  var node = document.getElementById("map"),
      map  = new google.maps.Map2(node)
})

Finally there’s this autoload() function, which lets you say if I require an object whose name matches this regex, try to load it from this directory. It’ll turn the object name into a path and then try to load that file for you. You can also use the matches from the regex to generate a dependency, for example if I’m testing and I load the TwitterSpec, I probably want to load the Twitter class as well, and I can use the match from the regex to specify that.

JS.Packages(function() { with(this) {
  
  autoload(/^(.*)Spec$/, {
           from: 'test/specs',
           require: '$1' })
  
  // e.g. TwitterSpec
  //      defined in test/specs/twitter_spec.js
  //      requires Twitter
}})

So I’d been using this for months and all was good with the world until this landed in my inbox:

Does it work on Node?

And it turned out that it didn’t. There are some environment differences in Node that meant that JS.Class wouldn’t run. I patched them up and had a play around with it and everything looked okay. But still, all I could legitimately say at the time was, “I don’t know.” All my tests at the time were written with Scriptaculous, which I loved because it’s really simple to get going with, but it meant my tests were confined to the browser. I needed something new.

So I had a look around to see what was out there, and there are a few really nice frameworks around that work on a few platforms. But none of them seemed to Just Work out of the box on all the platforms people were asking me to support. A few of them you can hack to override their platform bindings but it’s not a great first-time experience. So I did what any self-respecting nerd with a GitHub account does, and wrote a whole new testing library.

The next version of JS.Class will ship with a package called JS.Test. It’s a testing library, and it looks pretty much like most other testing libraries you’ve seen, but with a few explicit goals. First, it should run everywhere, without modification or configuration. I shouldn’t have to tell it how to load files or print results, it should figure that out based on the environment. It should remove as much boilerplate as possible, because setting up a new test suite is always a drag and I constantly forget how to do it. And, it should hide any platform differences – you should just be able to use a single API to write, load and execute your tests across all supported platforms.

Now rather than pore over the API details, which aren’t that interesting since they’re similar to stuff you’ve already seen, I thought I’d take you through an example. We’re going to build a little Twitter API client that works in Node and in web browsers.

Twitter has a search API, which you don’t need to sign up or do any OAuth leg-work to use, it’s a great place to get started. It looks like this, you make a request to search.twitter.com/search.json with your query and you get back a JSON document with some tweets matching the search.

$ curl 'http://search.twitter.com/search.json?q=@jcoglan'
    
{
    "results": [{
        "id": 23843942428577792,
        "created_at": "Sat, 08 Jan 2011 20:50:13 +0000",
        "from_user_id": 4393058,
        "from_user": "extralogical",
        "to_user_id": 86308,
        "to_user": "jcoglan",
        "text": "@jcoglan I need to write some JS testing code...",
    }
    ...
    ]
}

Now, let’s say I want to access this with a JavaScript API. I make a new client, tell it to search for something, then process the results with a callback function. This is what we’re going to build.

var client = new Twitter()

client.search('@jcoglan', function(tweets) {
  // tweets == [{to_user: 'jcoglan', ...}, ...]
})

So first we need to set up a project structure for this. JS.Test doesn’t require any particular file layout, this is just how I’ve settled on doing things. You see we have a source directory that contains the project’s source code, we have a vendor directory where I’ve installed JS.Class, and we have a test directory. This test directory needs a few items in it.

twitter/
    source/
        twitter.js            : source code
    test/
        browser.html          : runs in browsers
        console.js            : runs on command line
        run.js                : loads and runs all tests
        specs/
            twitter_spec.js   : test definitions
    vendor/
        jsclass/
            core.js           |
            loader.js         | -> Framework code
            test.js           |
            (etc)             |

browser.html is what we’ll load up in a web browser to run the tests, and console.js is a script we’ll run in the terminal. They both do exactly the same thing, which is to load the JS.Class seed file, and load the test runner. The test runner, that’s run.js, is a cross-platform script that loads the project’s code, loads all the tests, and runs them. The tests themselves live in the specs directory, one spec file for each source file. Again, this is just convention, you can change this easily once you’re familiar with the setup.

I’m going to start with the console setup first, because it’s slightly simpler. As I said the job of console.js is to load the JS.Class seed file and then load the test runner. Here we’re using Node’s require() function to load the files, some platforms use load() but it’s easy to detect what’s available and pick the right one.

// test/console.js

JSCLASS_PATH = 'vendor/jsclass'
require('../' + JSCLASS_PATH + '/loader')
require('./run')

So with that done we move onto the runner file, this is the script that’s used in all environments to load the project and execute its tests. Notice we can do away with require() vs. load() here, since we’ve got JS.Packages loaded now we can use it to load everything. We start with an autoload() statement to tell it where to find Spec objects, then we tell it where our source code is: file source/twitter.js provides Twitter and requires JS.Class. Finally we load JS.Test, load all our specs and tell JS.Test to run the test suite.

// test/run.js

JS.Packages(function() { with(this) {
  autoload(/^(.*)Spec$/, {
           from: 'test/specs',
           require: '$1' })
  
  file('source/twitter.js')
    .provides('Twitter')
    .requires('JS.Class')
}})

JS.require('JS.Test', function() {
  JS.require('TwitterSpec',
             function() { JS.Test.autorun() })
})

Now onto the spec itself. In our spec file, we create a spec. This is almost the same API is Jasmine, or JSpec, or any number of things so it should be familiar. We have a before block that creates a new Twitter client, then a test for it: when I call search() with "@jcoglan", the client should yield tweets mentioning me. That resume() business is there because we’re running an asynchronous test; JS.Test passes this function to the test block, and we call it when the test is ready to continue, passing any assertions we want to make. It you leave the resume argument out, JS.Test assumes it’s a synchronous test and won’t suspend running when the outer test block completes.

// test/specs/twitter_spec.js

TwitterSpec = JS.Test.describe("Twitter", function() {
  before(function() {
    this.client = new Twitter()
  })

  it("yields matching tweets", function(resume) {
    client.search("@jcoglan", function(tweets) {
      resume(function() {
        assertEqual( "jcoglan", tweets[0].to_user )
      })
    })
  })
})

Let’s go and run our test suite. We immediately get a helpful error message from Node: it couldn’t find our source code.

$ node test/console.js

Error: Cannot find module './source/twitter'

Great, let’s go and create a blank file to get rid of this error. Now we’ve created the file, Node finds it but JS.Pacakges starts complaining.

$ mkdir source
$ touch source/twitter.js
$ node test/console.js

Error: Expected package at ./source/twitter.js
       to define Twitter

You said twitter.js would define the Twitter class, but it doesn’t! Better go and add that.

// source/twitter.js

Twitter = new JS.Class('Twitter')

Now we’ve made the package loader happy and we start to get some meaningful output.

$ node test/console.js

Loaded suite Twitter
Started
E
Finished in 0.072 seconds.

1) Error:
test: Twitter returns tweets matching the search:
TypeError: Object #<Twitter> has no method 'search'

1 tests, 0 assertions, 0 failures, 1 errors

We get an error because our Twitter class doesn’t have the method we need. So, let’s go and implement it. I won’t go through the whole TDD cycle here, let’s just assume I prepared some Node code earlier that does what we want.

// source/twitter.js

Twitter = new JS.Class('Twitter', {
  search: function(query, callback) {
    var http   = require('http'),
        host   = 'search.twitter.com',
        client = http.createClient(80, host)

    var request = client.request('GET',
                  '/search.json?q=' + query,
                  {host: host})
    
    request.addListener('response', function(response) {
      var data = ''
      response.addListener('data', function(c) { data += c })
      response.addListener('end', function() {
        var tweets = JSON.parse(data).results
        callback(tweets)
      })
    })
    request.end()
  }
})

And run the test again:

$ node test/console.js 

Loaded suite Twitter
Started
.
Finished in 2.684 seconds.

1 tests, 1 assertions, 0 failures, 0 errors

We’re all good! Except… this won’t run in a browser. All the network code we wrote only works on Node, and we want this to work client-side too. We’re going to need tests for this. Thankfully, JS.Test makes this easy: all we need is a web page that, just like our terminal script, loads the JS.Class seed file, and loads the test runner. All the test code we wrote earlier will work just fine in the browser.

<html>
  <head>
    <meta http-equiv="Content-type" content="text/html">
    <title>Twitter test suite</title>
  </head>
  <body>
    <script src="../vendor/jsclass/loader.js"></script>
    <script src="../test/run.js"></script>
  </body>
</html>

If we load this up in a browser, we see something like this. “ReferenceError: require is not defined”. Okay, it’s hitting our Node implementation where we load the Node HTTP library, we want to avoid that. So what do we do? Easy, just detect whether we’re in a DOM environment and switch to using JSONP to talk to Twitter instead of Node’s HTTP libraries. Again, here’s one I made earlier, this is just the usual JSONP hackery, nothing fancy, and we’ve moved the Node version into the nodeSearch() method that will be called if we’re not in a DOM environment.

Twitter = new JS.Class('Twitter', {
  search: function(query, callback) {
    if (typeof document === 'object')
      this.jsonpSearch(query, callback)
    else
      this.nodeSearch(query, callback)
  },
  
  jsonpSearch: function(query, callback) {
    var script  = document.createElement('script')
    script.type = 'text/javascript'
    script.src  = 'http://search.twitter.com/search.json?' +
                  'callback=__twitterCB__&' +
                  'q=' + query
    
    window.__twitterCB__ = function(tweets) {
      window.__twitterCB__ = undefined
      callback(tweets.results)
    }
    var head = document.getElementsByTagName('head')[0]
    head.appendChild(script)
  },
  
  nodeSearch: function(query, callback) {
    // ...
  }
})

Reload the page, and fantastic – we’ve got a green build. Quick side-note, in the browser UI, JS.Test will print out a tree of all your nested context blocks that you can browse, which can be more useful than the terminal UI for finding errors. It’ll also notify TestSwarm if that’s where you’re running your tests, so you can use it for continuous integration.

The final piece of the process is to refactor. We’ve got a bunch of networking code gunking up our API client. Maybe we should move the networking code into its own module that’s a generic interface for making HTTP calls in any environment we support. Then we could call it like this:

// source/twitter.js

Twitter = new JS.Class('Twitter', {
  search: function(query, callback) {
    var resource = 'http://search.twitter.com' +
                   '/search.json?q=' + query
    
    Twitter.Net.getJSON(resource, callback)
  }
})

Because the logic for how to do networking is now isolated in one module, it’s easier for a user to replace if they want to make the Twitter client run in another environment: they just have to replace the implementation of Twitter.Net.getJSON() with the HTTP code for their platform. It also means that the network is easier to stub out, since we don’t want to rely on the real Internet during testing:

// test/specs/twitter_spec.js

TwitterSpec = JS.Test.describe("Twitter", function() {
  before(function() {
    this.client = new Twitter()
    
    stub(Twitter.Net, "getJSON")
        .given("http://search.twitter.com/...")
        .yields([{to_user: "jcoglan"}])
  })
  
  it("yields matching tweets", function() {
    // ...
  })
})

This approach also means we can run the test in any platform because we don’t need to actually talk to the network. We’d then write unit tests for the Twitter.Net module to make sure it worked on the right platforms.

So what I wanted to get across here isn’t that you should all go and use my code, but try to follow some of the same patterns. If we want highly reusable software we’re going to need to test it everywhere. If you’re building libraries to support your work, and it looks like the abstraction would be useful in other contexts, consider making it available to users of other platforms. If you do have platform-specific code, try to isolate it in one place and hide it behind abstractions. Remember how in Faye I’ve isolated the Node bindings to make it easy to run and test the internal components in other environments. Make it easy to replace the platform bindings, so if someone wants to run it somewhere you didn’t expect it’s easy to swap in new bindings.

And finally, write usage documentation. If someone’s trying to get your code running somewhere new, step-by-step tutorials are great for showing people the ropes and getting them comfortable with how your stuff works, so they feel more confident hacking it to their needs. You’ll be amazed what people do with your code when you make it easy to use and write nice docs for it.