Ideas from other notebooks

[sashmit]

Hi, I've found Pluto a joy to use, great work, I'll try and contribute some examples of integrating some other javascript-ish libs that might be useful for the julia community (or perhaps it would be better to write a julia wrapper, but first I gotta learn julia better).

Some ideas from RunKit, which I absolutely love (I've tinkered with RunKit, Obserables, Jupyter, knitr, etc):

• good integration with npm
• time travel debug
• being able to both freeze a notebook (for hosting on some server) to make it read only so I can host it on my own server
• automatically being able to bind cells to http endpoints (using http.jl etc) so that you can easily host a notebook as a prototyped
• basic git integration
• when exceptions happen, render them in the notebook (runkit does this)
• in text/html rendered content, be able to flip between some raw representation of the dom elements and the rendered html.

Recent thread on HN also has some good links:
https://news.ycombinator.com/item?id=22164916

and some other stuff from the python world:
https://www.intelligencerefinery.io/post/making-python-apps/

https://deepnote.com/ also has some cool ideas.

[sashmit]

small example to embed runkit directly inside of pluto, should be trivial to also interchange data:

html"""
<script defer src="https://embed.runkit.com"></script>

<div id="my-element"></div>
<script>var notebook = RunKit.createNotebook({
    // the parent element for the new notebook
    element: document.getElementById("my-element"),
    // specify the source of the notebook
    source: "// GeoJSON!\nvar getJSON = require('async-get-json');\n\nawait getJSON('https://storage.googleapis.com/maps-devrel/google.json');"
})</script>
"""

(run twice to make sure that libs are loaded - #108)

[fonsp]

Woah this is amazing!

Some of these are on my todo list, others I had never thought about! I actually read the article from the HN thread a few weeks ago, but I didn't know about this discussion, there's lots of good stuff there!

JS execution has always been a sort of hidden feature, so it's really cool to see you experiment with it! I definitely want to work on it more though - the Julia back-end of pluto is pretty much done, it's mostly a very exciting javascript project from now on :) So if you are interested in working on Pluto itself, there is lots that can be done! For example, @dralletje is interested in making a notebook-inside-notebooks system, either in Julia with Pluto or purely JS.

Another long term goal is one-click deployment to heroku (or similar). It already runs on heroku, but I want to make it accessible to people who don't understand dependencies and web stuff! (The idea here is that every visitor gets a clean fork of the original notebook, with the option to export and continue work locally.)

Let's talk more! How about a video call sometime? (email)

[dralletje]

good integration with npm

@fonsp 😏

[sashmit]

I've been busy moving but I'll reach out to ya over email sometime next week @fonsp

Finally got a chance to play around some more, was trying to get some obserablehq-ish examples working, where things were run lazily from JS code, ultimately with the goal of being available to a julia variable via whatever chain of cells. So, got a better feel for the code paths in the dataflow engine (and obserablehq's!) and what can be currently done easily and not done.

Some observations:
Right now, there are strong assumptions being made in RawHTMLContainer/execute_scripttags/Bond.connect_bonds on what can be waited for (mostly because of the explicit invocation of observablehq.Generators.input) such that it has to be a HTMLInputElement-like element. It would be nice to weaken it to something like observablehq's assumptions (an abstract "generatorish"). I think this is the most relevant code in observeable's runtime: https://github.com/observablehq/runtime/blob/master/src/runtime.js#L205

I'll have to grok a better mental model of the interplay of ExploreExpression and the interactions with the preact vdom (and even mathjax) some more by trying various things.

[fonsp]

Sounds like you're on to something!

The difficult thing with having reactivity both in Julia and in their JavaScript output is that the JavaScript code is only available for reactivity analysis after the Julia code has computed it. A contrived example:

if rand(Bool)
    html"<script>a = b</script>"
else
    html"<script>b = a</script>"
end

and a second cell with exactly the same Julia code. The reactivity graph of those two cells is random!

It's also just that the focus right now is making things simpler :)

About the Generators.input limitation: Yes! That's definitely a strong assumption on my part, but it's not limited to just input elements! The rectangle demo in the Interactivity sample shows how you can turn any JS event handler into a bindable thing - it also works for generators/iterators. In the demo, it is dispatching the input CustomEvent on a <canvas>, but you could also dispatch on the script tag itself! (Although I am still unsure about the API for making the running script element accessible inside JS - currently it's this.currentScript.) I'm working on a sample notebook about all of this.

[fonsp]

@sashmit Send me an email if you'd like to chat! fonsvdplas@gmail.com

We also do weekly calls with anyone who would like to join: https://julialang.zulipchat.com/#narrow/stream/257776-Pluto.2Ejl-development/topic/Weekly.20Pluto.20meetups