Tom MacWright

2025@macwright.com

Observable Notebooks 2.0

Observable just announced a new product: Notebooks 2.0.

If I were to sketch out the phases of Observable so far, they would be:

  1. Observable notebooks: basically this is the phase that I helped build. Similar to Jupyter notebooks, but in JavaScript and with reactive cells. Reactivity is kind of the core, first idea, implemented really early on by Mike, back when it was called d3.express and hadn't really become a company or a product yet.
  2. Evolution: After I left, the two biggest evolutions of notebooks in my opinion were live as-you-type collaboration and Observable Plot. Plot was the fulfillment of a long-held idea that charting could be a lot easier if it was a little more declarative. A lot of d3's complexity was in service of super-flexible animations and totally limitless customizability, and by sacrificing a little of those it would be possible to make charting a lot simpler. And while Observable had real-time collaboration designed into it from day one - in particular, operational transforms, it couldn't do the fancy character-by-character collaboration. That got implemented and it was really cool. There was also some AI integration into notebooks, but it was a pretty light touch.
  3. Observable framework. One of the things that we really struggled with early on was editor preference and language preference. Framework targeted both of these things: you could use it from the comfort of your editor and with any kind of language that you want. In this way it's like Quarto and Streamlit.
    1. Observable has a nice customized CodeMirror-powered editor experience but a lot of people are attached to their VS Code, Neovim, or nowadays fill-in-the-blank-AI-powered-VS-Code-fork-editor setup.
    2. Observable is often used for Exploratory data analysis and a lot of the people doing data analysis are using Python or R for their number-crunching. Observable started out just handling JavaScript, which was problematic for some people who really like Python and its lovely libraries like polars and pandas. The JavaScript equivalents to these libraries are pretty far behind.
  4. Observable Canvas. Canvas is a more radical change to the Observable data model: it keeps the reactivity and uses Observable Plot, but replaces the vertical-layout notebook format with a 2D infinite canvas. This is recognizably a tldraw-based system, which makes sense. That gives you a lot of good interaction patterns right off the bat. And it also digs into the idea that most business-intelligence-ish customers have database-centric needs: they want to connect to Snowflake or another data warehouse and write SQL queries. Canvas has a lot of fancy query magic in it, which in broad strokes reminds me of Mosaic, the tool from University of Washington that auto-generates queries that yield just enough data to show charts. Canvas also introduced some more heavyweight AI which was able to create documents from scratch.
  5. Notebooks 2.0. This comprises Notebook Kit, an open source project, and Observable Desktop. Desktop looks like a Tauri-based desktop app that uses many of the ingredients of the original Notebooks interface - an iframe for sandboxing, a CodeMirror-based editor. This is an interesting new move.
    • Observable Desktop combines the interface of the original Observable Notebooks system with the file-over-app philosophy of Observable Framework. The file format is a dialect of HTML. Which is cool: definitely a lot cleaner than a JSON or YAML-based format would have been with all of the quote-escaping that JSON requires or footguns of YAML. On first glance, I wondered if it could be interpreted by a web component, but it seems like it's a preprocessing system instead.
    • Notebook Kit and Desktop support vanilla JavaScript, which is excellent and cool. The Observable changes to JavaScript were always tricky and meant that we struggled to use off-the-shelf parsers, and users couldn't use standard JavaScript tooling like eslint. This is stuff like the viewof operator which meant that Observable was not JavaScript. Unlike Framework, though, there's no support for Python or shelling out to a language like R. Sidenote: I now work on Val Town, which is also a platform based on writing JavaScript, and when I joined it also had a tweaked version of JavaScript. We used the @ character to let you 'mention' other vals and implicitly import them. This was, like it was in Observable, not worth it and we switched to standard syntax: don't mess with language standards folks!

The current state is Canvas being the SaaS-oriented offering with real-time collaboration and tight integration into databases, and Notebooks 2.0 being the open source-oriented offering with developer-friendly file access and lots of ways to customize and build. Canvas feels like what businesses want and Notebooks 2.0 feels like what developers want. Both have a decent AI angle. Maybe they'll eventually connect, or Observable will become a multi-product company, like Posit. I'm feeling pretty optimistic about it.

ProductLaunchedLocal/hostedLanguagesOSSLayoutCollaboration
Notebooks~2018Hostedojs, md, html, sqlno*notebooklive
Framework2024Hybridjs, md, sql, many othersyesmixednone/github
Canvas2025Hostedjs, sqlnocanvaslive
Notebooks 2.02025Local*ojs, js, md, html, tex, dotyes*mixednone/github

Backstory/full disclosure: I was the first hire at Observable and hold equity in the company.