Stream: show and tell

Topic: Roclet notebooks


view this post on Zulip Aurélien Geron (Nov 02 2026 at 06:21):

Hi there,

Introducing Roclet: reactive notebooks in Roc, running in your browser (even offline).

Here's a quick intro video (the top is a bit cropped, sorry about that).
Roclet.mp4

Huge thanks to @Luke Boswell who helped a lot with this! :folded_hands:

view this post on Zulip Anton (Nov 02 2026 at 09:51):

Super cool, it already looks very polished :sparkles:
Cool logo too :)

view this post on Zulip Anton (Nov 02 2026 at 09:54):

We could try porting some examples to see if this is a better format :eyes:

view this post on Zulip Jonathan (Nov 02 2026 at 09:57):

Very excited! It reminds me very strongly of Elixir's Livebook in UI and features. I like how it tells you if an output is stale, although the indicator for this (a kind of stuck loading circle) isn't the most intuitive imo. To expand on the rich outputs, Livebooks have a cool feature called smart cells, which is basically some nice UI over doing graphs, sql queries/results, process monitoring etc. The key feature being that you can 'expand' the cell to convert it into an ordinary Elixir cell with the equivalent function.

view this post on Zulip Jonathan (Nov 02 2026 at 10:09):

I would also love a way to run this in the context of a local project and import modules, or perhaps install local projects.

view this post on Zulip Steve Howell (Nov 02 2026 at 14:11):

Looks great! What do you do use for rendering markdown? (see https://ageron.github.io/roclet/web/edit.html)

view this post on Zulip notramo (Nov 02 2026 at 14:39):

Cool project! What prevents the packages to loaded automatically? Why is the manual download and upload needed?

view this post on Zulip Aurélien Geron (Nov 02 2026 at 17:44):

Jonathan said:

Very excited! It reminds me very strongly of Elixir's Livebook in UI and features. I like how it tells you if an output is stale, although the indicator for this (a kind of stuck loading circle) isn't the most intuitive imo. To expand on the rich outputs, Livebooks have a cool feature called smart cells, which is basically some nice UI over doing graphs, sql queries/results, process monitoring etc. The key feature being that you can 'expand' the cell to convert it into an ordinary Elixir cell with the equivalent function.

Thanks Jonathan! Yes, Livebook was one of the main sources of inspiration.
You're right about the stale result indicator, I'll try to improve that. Any suggestions?
I like smart cells too, good idea.

view this post on Zulip Aurélien Geron (Nov 02 2026 at 17:47):

Jonathan said:

I would also love a way to run this in the context of a local project and import modules, or perhaps install local projects.

You can install the Roclet server: this solves the package download hassle, and allows you to open a folder and access it's notebooks more easily (UI to be improved).

view this post on Zulip Aurélien Geron (Nov 02 2026 at 17:53):

Steve Howell said:

Looks great! What do you do use for rendering markdown? (see https://ageron.github.io/roclet/web/edit.html)

Thanks Steve! Roclet uses CodeMirror 6 for the editor, with different highlighting sources:

view this post on Zulip Aurélien Geron (Nov 02 2026 at 18:11):

notramo said:

Cool project! What prevents the packages to loaded automatically? Why is the manual download and upload needed?

Thanks notramo! Yeah, that's the most annoying limitation of serverless Roclet: it's due to CORS–the browser prevents a script on one website from reading data from a different website—unless that website explicitly grants permission using CORS headers.

The simplest solution is to make the server fetch the packages, but this is not possible on a static website (currently Roclet is hosted on Github Pages = static). For now you can install the Roclet server locally, it solves the problem.

In the short term I can make all the most common packages (including all the ones used in the demos) available on the website, so at least users won't get the download/load experience while trying out Roclet. Or we could provide bundles containing notebooks + package dependencies.

view this post on Zulip notramo (Nov 02 2026 at 18:52):

I thought the Github API allows any origin.
A small Cloudflare worker could solve this. What about adding a default, centralized worker for serverless deployments? There's plenty of bandwidth in the Cloudflare free plan, and Vercel too. Maybe Netlify also, but they had issues with uncapped billing, so be sure to check the auto-recharge option, and set to "off". This does not exist on older Netlify accounts, those are uncapped!

view this post on Zulip Ian McLerran (Nov 03 2026 at 02:58):

This is incredibly cool! I agree with Anton - this could be a great format for publishing examples and tutorials.

view this post on Zulip Aurélien Geron (Nov 03 2026 at 06:51):

Thanks for the tips @notramo , I'm more of an ML & backend guy, so I'm grateful for any advice you can give me regarding web stuff. :+1:

view this post on Zulip Luke Boswell (Nov 03 2026 at 07:09):

notramo said:

A small Cloudflare worker could solve this. What about adding a default, centralized worker for serverless deployments? There's plenty of bandwidth in the Cloudflare free plan, and Vercel too.

I considered this and thought it would be good to have the option for it to be completely static, to avoid the hug of death. :smile:

I didn't think the UX was too bad if users have to download a package for the free web experience.

view this post on Zulip notramo (Nov 03 2026 at 12:28):

I considered this and thought it would be good to have the option for it to be completely static, to avoid the hug of death. :smile:

Then maybe add graceful degradation.
So if traffic is low, it works automatically, and if the quota is exhausted, it falls back to the current behavior. Set the spending limit to $0, so it won't cause any unexpected costs if the free plan is fully used.

view this post on Zulip notramo (Nov 03 2026 at 12:29):

However, I find it highly unlikely that Roc would suddenly get that much popular.

view this post on Zulip Richard Feldman (Nov 03 2026 at 15:42):

the hug of death comes from something getting on hacker news (such as the 0.1.0 announcement, which I plan to link to various community projects from, such as this one :smile:)

view this post on Zulip Richard Feldman (Nov 03 2026 at 15:43):

avoiding the hug of death is one of the reasons we have a web repl on roc-lang.org that runs completely in the browser, where most languages kick out to a server for something like that

view this post on Zulip Richard Feldman (Nov 03 2026 at 15:43):

the main problem with the hug of death is that right when you have the most people trying to check out what you've made, that's exactly when it goes down and prevents them from checking it out!

view this post on Zulip notramo (Nov 03 2026 at 15:44):

The free plans are more than enough, even if it gets on Hacker News.

view this post on Zulip Richard Feldman (Nov 03 2026 at 15:44):

are you sure about that? :face_with_raised_eyebrow:

view this post on Zulip notramo (Nov 03 2026 at 15:44):

But more importantly: if graceful degradation is added, the worst case scenario is the current default behavior.

view this post on Zulip Richard Feldman (Nov 03 2026 at 15:45):

how many concurrent requests do they permit?

view this post on Zulip notramo (Nov 03 2026 at 15:48):

I don't know, but it doesn't really matters. If the quota is exhausted, it falls back to the current manual upload.

view this post on Zulip notramo (Nov 03 2026 at 15:49):

Without a worker: manual upload for everyone.
With a worker: automatic for some people, then manual upload only for some.

view this post on Zulip notramo (Nov 03 2026 at 21:50):

I just found an important info: the Cloudflare caching terms forbids a disproportionate amount of non-HTML content, so it may not be allowed.

view this post on Zulip notramo (Nov 03 2026 at 21:54):

Need to check the Vercel and Netlify terms, they may have similar rules.

view this post on Zulip Luke Boswell (Nov 04 2026 at 02:14):

Anton said:

We could try porting some examples to see if this is a better format :eyes:

Roclet supports loading from a gh gist. One of the examples (the garden plan one) is just pointing at a gist I made. So anyone could make a gist and share a link like this

https://ageron.github.io/roclet/web/edit.html?gist=ab17cb796239be901ec0436f919d39bb

Which corresponds to this gist

https://gist.github.com/lukewilliamboswell/ab17cb796239be901ec0436f919d39bb

view this post on Zulip Luke Boswell (Nov 04 2026 at 02:15):

That example was intentionally using a local package, to show how you might organise information to hide implementation details -- they're still there just not polluting the notebook reader view


Last updated: Nov 04 2026 at 18:54 UTC