Hacker News Reader

Comment by danso | Hacker News Reader

Just in case people were wondering, the site seems to have been overwhelmed for the past 10-15 minutes. But there's a YouTube demo of the tech https://news.ycombinator.com/item?id=16275040

I guess an oversimplified description would be that this is like a Jupyter Notebook specifically for JavaScript. Libraries like D3 are pre-loaded and immediately accessible. Am definitely interested in hearing the details about what it is built with and medium to long-term plans for the service.

Note that the Jupyter Notebook service generally requires you to be installing and running Python etc. on your own computer. Jumping into an Observable notebook is as easy as opening your browser and signing in via GIthub

View on HN

I wrote more about the motivation for Observable (formerly d3.express) last year: https://medium.com/@mbostock/a-better-way-to-code-2b1d2876a3...

It’s easy to use D3 within Observable, but it’s not pre-loaded or specifically built-in. Any browser library published to npm can be loaded via require (for AMD) or dynamic import (for ES modules). I’ve published a bunch of notebooks with D3 but you’ll find other ones with THREE.js, Vega-Lite, Leaflet and other libraries.

Are the language/syntax differences documented somewhere? It's difficult to tell if something is an obscure early stage ecmascript proposal or a language feature specific to observablehq. For example in https://beta.observablehq.com/@mbostock/introduction-to-note...

  import {canvas as flood} with {height} from "@mbostock/randomized-flood-fill"

or how you define generators

  i = {
    let i = 0;
    while (true) {
      yield ++i;
    }
  }

etc

We’re still writing more documentation, but there’s a bit more detail here (and I’ll be posting more soon): https://beta.observablehq.com/@mbostock/introduction-to-code

To summarize, the body of a cell is typically either an expression or a block statement, akin to the body of an arrow function. If a cell starts with name = …, then it has a name and can be referenced by other cells. So, the name = part is specific to Observable, but the expression and block statement is normal JavaScript.

The import declaration is similar to a normal static ES import, but the with clause allows you to inject local definitions into the imported notebook.

I got a little tripped up because I tried to assign a literal object to a name.

e.g.

    name = { foo: 1 }

doesn't work. I ended up doing:

    name = { return { foo: 1} }

but after your explanation, I guessed that this would also work:

    name = ({ foo: 1})

Yep!

There is mybinder.org to run jupyter notebooks online . For example, https://github.com/norvig/pytudes

There's also some (currently) free cloud version by microsoft available on https://notebooks.azure.com in a preview state, but works great already. (Tested python3 only)

There's a reason why you would want to run Python and that's the huge, well supported scientific computing libraries it has.

Absolutely! We all quite like Python, and there's no denying that JavaScript doesn't have the same caliber and range of scientific code (yet!).

I fully expect plenty of people to do some of the data-crunching in Python, Julia, R, and so on, and bring it into Observable to explore and experiment. And I also expect JavaScript's ecosystem to blossom, especially with WebAssembly & WebGL hitting the mainstream.

What’s the status of d3 ports to Python? I believe plotly, d3py, and Bokeh all offer some amount of support.

I’d expect more python users to bring d3 in that bring python to JavaScript.

No doubt you're right, but I don't think JS is well suited for scientific computing. At least Python gives you operator overloading. Julia and R are designed for this field. It's better for JS to remain on the presentation side for anything sophisticated.

Forgive me if I read the response wrong but that seems like exactly what the author is saying? Do your computing in Python/R, export a generated CSV, and then present it in Observable?

With the possibility that WebAssembly and WebGL will make the libraries in Python/R available to JS. Which might be alright. You probably won't be able to utilize vectorization with operators.

The point wasn't that there is something wrong with Python, the point was that Jupyter requires local installation whereas Observable doesn't require installation of any kind.

Yep, Python is my language for work and teaching, especially for data projects. Doesn't mean I don't envy the interactivity and visualization potential working in JS.

I was just thinking about a proliferation of Javascript statistical libraries popping up... only an NPM away. And I shuddered a little.

And then it occurred to me that CRAN and NPM have a fair bit in common. Both have a package for anything you might imagine, and both have a mix of amazing and less-than-amazing quality.

There are a few ways to open Jupyter notebooks in the cloud pretty easily:

https://aws.amazon.com/sagemaker/

https://cloud.google.com/datalab/

https://gryd.us/

https://kyso.io (disclaimer - I'm a founder)

Do you want it to be so easy that you jump into the notebook immediately upon logging in, the hard part is that javascript will run in your browser - but python or R need a kernel running somewhere?

There are many online services for hosted Jupyter Notebooks. mybinder, Google, Intel, Microsoft etc etc

There's also Anaconda, Dominodatalab, R-Brain, Kyso (currently in the Techstars NYC '18 program) - disclaimer, I'm part of this project.

Google colab allows to create Python notebooks and run them (directly on Google cloud) without paying anything, or setting anything up

Except you need a Google account I presume.

So it's "databricks for JS" ?

if you're going to be using an online hosted service ("sign in via GitHub") then you don't need to install and run Python to use a Jupyter Notebook...

Reply on news.ycombinator.com