diff options
Diffstat (limited to '')
4 files changed, 866 insertions, 2 deletions
diff --git a/2025/captions/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--main--chapters.vtt b/2025/captions/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--main--chapters.vtt new file mode 100644 index 00000000..fb1e557c --- /dev/null +++ b/2025/captions/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--main--chapters.vtt @@ -0,0 +1,26 @@ +WEBVTT + + +00:00:01.120 --> 00:00:49.041 +What are reactive notebooks? + +00:00:49.042 --> 00:02:38.498 +Reactivity demo + +00:02:38.499 --> 00:03:21.079 +Org-Babel + +00:03:21.080 --> 00:03:51.900 +Running the whole buffer + +00:03:51.901 --> 00:04:21.660 +Caching + +00:04:21.760 --> 00:06:04.533 +Computation dependencies + +00:06:04.534 --> 00:07:29.965 +Making this even better + +00:07:29.966 --> 00:08:08.240 +Wrapping up diff --git a/2025/captions/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--main.vtt b/2025/captions/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--main.vtt new file mode 100644 index 00000000..22373ce6 --- /dev/null +++ b/2025/captions/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--main.vtt @@ -0,0 +1,614 @@ +WEBVTT captioned by abhinav + +NOTE What are reactive notebooks? + +00:00:01.120 --> 00:00:03.033 +Hello, everyone. My name is Abhinav, + +00:00:03.034 --> 00:00:03.900 +and I'm going to talk about + +00:00:03.901 --> 00:00:07.140 +how to make Org Babel reactive. So reactivity here + +00:00:07.240 --> 00:00:10.000 +means reactivity in the sense of reactive notebooks. + +00:00:10.001 --> 00:00:11.600 +So if you used Org Babel, + +00:00:11.601 --> 00:00:13.933 +you might also have used Jupyter notebooks, + +00:00:13.934 --> 00:00:16.100 +which are basically notebooks primarily for + +00:00:16.200 --> 00:00:16.933 +Python programming, + +00:00:16.934 --> 00:00:20.100 +where you have these text and code blocks interleaved, + +00:00:20.101 --> 00:00:23.157 +and then you can execute every code block independently, + +00:00:23.158 --> 00:00:25.858 +and then you control the order of execution manually, + +00:00:25.859 --> 00:00:27.199 +or you can just run the code blocks + +00:00:27.200 --> 00:00:29.699 +from top to bottom. But with reactive notebooks, + +00:00:29.700 --> 00:00:32.927 +what happens is that there's another way of running + +00:00:32.928 --> 00:00:35.329 +which is basically by having all these + +00:00:35.330 --> 00:00:36.900 +dependent code blocks automatically get + +00:00:37.000 --> 00:00:38.900 +executed whenever you make a change. + +00:00:38.901 --> 00:00:40.774 +So for example, if you change a variable, + +00:00:40.775 --> 00:00:42.060 +everything else that's dependent on + +00:00:42.160 --> 00:00:44.433 +that variable will be executed automatically. + +00:00:44.434 --> 00:00:49.041 +I'll show you an example of what that looks like. + +NOTE Reactivity demo + +00:00:49.042 --> 00:00:51.762 +Right, here's an example reactive Notebook. + +00:00:51.763 --> 00:00:53.460 +So this is called Observable. + +00:00:53.560 --> 00:00:54.863 +Observable is this tool made by + +00:00:54.864 --> 00:00:57.679 +the creator of d3.js which is + +00:00:57.680 --> 00:01:01.499 +a famous JavaScript charting library. So here, the + +00:01:01.500 --> 00:01:03.667 +interface is very similar to Jupyter Notebook. + +00:01:03.668 --> 00:01:06.407 +You basically are having these cells + +00:01:06.408 --> 00:01:08.508 +and each cell could be a text cell, like here, + +00:01:08.509 --> 00:01:09.588 +this is a Markdown cell + +00:01:09.589 --> 00:01:11.609 +and then there are these code blocks. + +00:01:11.610 --> 00:01:15.250 +Now each code cell is basically defining a variable. + +00:01:15.251 --> 00:01:17.740 +This is important in reactive notebooks because + +00:01:17.840 --> 00:01:21.140 +each cell is connected to other cell via this variable + +00:01:21.240 --> 00:01:23.552 +usage. So here data is defined, + +00:01:23.553 --> 00:01:25.012 +then there is filtered which is defined + +00:01:25.013 --> 00:01:27.620 +which is dependent on data, and then this plot is + +00:01:27.720 --> 00:01:29.133 +dependent on filtered. + +00:01:29.134 --> 00:01:31.153 +So now, in a classical notebook, what I will do is + +00:01:31.154 --> 00:01:34.394 +if I change something here, let's say from 1 to 2, + +00:01:34.395 --> 00:01:34.854 +I will have to run this, and then run this plot block again + +00:01:34.855 --> 00:01:40.335 +to make the change be visible. + +00:01:40.336 --> 00:01:42.055 +But in a reactive notebook, what happens is + +00:01:42.056 --> 00:01:44.396 +I can just change this from some value + +00:01:44.397 --> 00:01:46.256 +to some value, and then execute, + +00:01:46.257 --> 00:01:48.817 +and then every descendant is also executed, + +00:01:48.818 --> 00:01:50.940 +because that's how the reactivity works. + +00:01:51.040 --> 00:01:51.937 +You change this variable, + +00:01:51.938 --> 00:01:53.080 +so this should also be changed, + +00:01:53.081 --> 00:01:55.238 +because this is dependent on this variable. + +00:01:55.239 --> 00:01:56.858 +Now this is really helpful + +00:01:56.859 --> 00:01:58.900 +if you have a very complex and messy notebook + +00:01:59.000 --> 00:02:01.199 +which is what actually happens in reality. + +00:02:01.200 --> 00:02:03.480 +You end up doing an exploratory analysis, + +00:02:03.481 --> 00:02:05.959 +and you have these code blocks lying here and there. + +00:02:05.960 --> 00:02:07.101 +Then you change something + +00:02:07.102 --> 00:02:09.281 +and then you have to keep something in your mind + +00:02:09.282 --> 00:02:11.362 +that if I change this, I need to run + +00:02:11.363 --> 00:02:13.023 +these five code blocks again + +00:02:13.024 --> 00:02:15.604 +to finally get to the result that I want to see. + +00:02:15.605 --> 00:02:20.467 +Stale state causes a lot of issues in Jupyter Notebooks. + +00:02:20.468 --> 00:02:23.788 +So this is really good for reactivity, sorry reproducibility, + +00:02:23.789 --> 00:02:26.630 +but this is also really good for + +00:02:26.631 --> 00:02:28.599 +just having this exploration + +00:02:28.600 --> 00:02:30.117 +that you're trying to do. For example, + +00:02:30.118 --> 00:02:31.761 +you're changing something and it's really easy + +00:02:31.762 --> 00:02:34.887 +to just see that change happening in real time + +00:02:34.888 --> 00:02:38.498 +in your outcome variables, right? + +NOTE Org-Babel + +00:02:38.499 --> 00:02:41.920 +So I was wondering how to introduce this reactivity in Org Mode. + +00:02:41.921 --> 00:02:43.200 +And here's how it will look like. + +00:02:43.201 --> 00:02:46.302 +So this is a demo Org Mode file. + +00:02:46.303 --> 00:02:48.603 +There are many Org Babel blocks here. + +00:02:48.604 --> 00:02:49.563 +So you start from here. + +00:02:49.564 --> 00:02:52.085 +Let's say this is a code block. It has a name. + +00:02:52.086 --> 00:02:53.665 +And then there's another code block, + +00:02:53.666 --> 00:02:55.426 +which is dependent on the previous one, + +00:02:55.427 --> 00:02:57.807 +as you can see here, and so on. + +00:02:57.808 --> 00:02:59.368 +And then finally, there's a plot here, + +00:02:59.369 --> 00:03:00.889 +which is a gnuplot code. + +00:03:00.890 --> 00:03:02.550 +And you can see the image here. + +00:03:02.551 --> 00:03:04.131 +Now, what happens usually is that + +00:03:04.132 --> 00:03:05.196 +if I change this value from, + +00:03:05.197 --> 00:03:09.199 +let's say, 113 to 112, nothing happens on its own right? + +00:03:09.200 --> 00:03:12.199 +There's an extra step of execution that I will have to do + +00:03:12.200 --> 00:03:15.079 +so I will do that, and then the value is changed. + +00:03:15.080 --> 00:03:17.699 +Now the problem is that only this value is changed and + +00:03:17.700 --> 00:03:21.079 +if I go down and see the image, nothing will have changed. + +NOTE Running the whole buffer + +00:03:21.080 --> 00:03:23.079 +So what I can do is basically, + +00:03:23.080 --> 00:03:24.818 +a really simple thing is that, + +00:03:24.819 --> 00:03:26.500 +a simple trick is to basically + +00:03:26.600 --> 00:03:29.445 +enable a hook, like, add a hook + +00:03:29.446 --> 00:03:30.525 +whenever you're saving the buffer, + +00:03:30.526 --> 00:03:31.866 +you just run the full buffer again, + +00:03:31.867 --> 00:03:34.287 +like run all the code blocks automatically. + +00:03:34.288 --> 00:03:36.849 +Now if you do that, you can basically make a change somewhere + +00:03:36.850 --> 00:03:37.889 +and then you can, you know, + +00:03:37.890 --> 00:03:41.071 +see how everything else is changing + +00:03:41.072 --> 00:03:42.712 +which gives you some sort of reactivity, + +00:03:42.713 --> 00:03:43.972 +but there's still a lot of computation + +00:03:43.973 --> 00:03:45.973 +that's being wasted. + +00:03:45.974 --> 00:03:49.595 +You might not want to change or run this code block again + +00:03:49.596 --> 00:03:51.900 +when something down there is changing. + +NOTE Caching + +00:03:51.901 --> 00:03:54.567 +So to counter that, you can actually add caching. + +00:03:54.568 --> 00:03:57.133 +So if you add caching to any code block, + +00:03:57.134 --> 00:03:59.800 +that code block will only be executed again + +00:03:59.801 --> 00:04:02.300 +if that code has changed or + +00:04:02.400 --> 00:04:04.755 +the input variables have changed. + +00:04:04.756 --> 00:04:06.336 +But the other problem is that + +00:04:06.337 --> 00:04:08.659 +you don't want caching to be enabled for a lot of cases + +00:04:08.660 --> 00:04:10.840 +where the code block is actually dependent on + +00:04:10.841 --> 00:04:12.722 +external state, like for example, + +00:04:12.723 --> 00:04:15.024 +some sort of randomness or time. + +00:04:15.025 --> 00:04:17.433 +So caching also is, you know, kind of, + +00:04:17.434 --> 00:04:18.967 +it's, like, an important thing to use, + +00:04:18.968 --> 00:04:21.660 +but it's probably not giving you the complete answer. + +NOTE Computation dependencies + +00:04:21.760 --> 00:04:25.973 +So what we can instead do is basically figure out + +00:04:25.974 --> 00:04:28.554 +the whole computation dependencies here. + +00:04:28.555 --> 00:04:31.275 +So let's say if I look at this buffer, + +00:04:31.276 --> 00:04:35.076 +here's how all the blocks are connected. + +00:04:35.077 --> 00:04:37.656 +So as you can see the plot code block + +00:04:37.657 --> 00:04:40.117 +is dependent on c and then legendpg, + +00:04:40.118 --> 00:04:43.918 +and they themselves are dependent on these other nodes. + +00:04:43.919 --> 00:04:47.279 +So when I make a change in b, I only want b to run + +00:04:47.280 --> 00:04:50.844 +and then c and then plot. I don't want anything else to run. + +00:04:50.845 --> 00:04:54.267 +So what I did was I wrote a small minor mode for Org Mode + +00:04:54.268 --> 00:04:55.368 +which does exactly this. + +00:04:55.369 --> 00:04:57.769 +So whenever you are in a code block + +00:04:57.770 --> 00:04:59.871 +and you are making a change and then you save it, + +00:04:59.872 --> 00:05:01.913 +it will just follow the trail from that code block + +00:05:01.914 --> 00:05:05.355 +to every other descendant which is going to be impacted, + +00:05:05.356 --> 00:05:09.719 +and it just runs all of them, and nothing else gets executed. + +00:05:09.720 --> 00:05:13.119 +So to see it in action, I will just enable that mode. + +00:05:13.120 --> 00:05:17.021 +Yeah, right. So now here, if I change this 113 to 112 + +00:05:17.022 --> 00:05:21.243 +and I save, this code, this variable gets changed. + +00:05:21.244 --> 00:05:23.744 +It's the same value because I did not update it again. + +00:05:23.745 --> 00:05:25.719 +And you can also see b also got changed + +00:05:25.720 --> 00:05:29.667 +because it's just following all the execution order and so on. + +00:05:29.668 --> 00:05:31.727 +The plot also got updated. + +00:05:31.728 --> 00:05:34.068 +We will be able to see more clearly + +00:05:34.069 --> 00:05:36.402 +once I change something more substantial. + +00:05:36.402 --> 00:05:36.402 +So here's another variable. + +00:05:36.403 --> 00:05:41.332 +So I added a small toggle button here, + +00:05:41.333 --> 00:05:43.468 +which is again part of the minor mode. + +00:05:43.469 --> 00:05:45.209 +So since this is nil, if I toggle it, + +00:05:45.210 --> 00:05:49.300 +it will become true. And this variable dictates whether + +00:05:49.400 --> 00:05:51.174 +the plot will have the legend or not. + +00:05:51.175 --> 00:05:54.457 +So if I toggle it to be t, now it's t + +00:05:54.458 --> 00:05:57.900 +and you can see that the plot has legend that's visible. + +00:05:57.901 --> 00:06:03.139 +If I toggle it back again to nil, the legend is gone. + +00:06:03.140 --> 00:06:04.533 +Now this is nice, this... + +NOTE Making this even better + +00:06:04.534 --> 00:06:06.380 +This is already pretty helpful for me + +00:06:06.480 --> 00:06:10.179 +but what we can do is we can make it even better. + +00:06:10.180 --> 00:06:11.400 +So one of the nicer ideas + +00:06:11.401 --> 00:06:13.015 +from these reactive notebooks + +00:06:13.016 --> 00:06:16.078 +is this idea of having an infinite canvas + +00:06:16.079 --> 00:06:19.022 +where you don't look at the document model, + +00:06:19.023 --> 00:06:20.623 +you look at the whole document + +00:06:20.624 --> 00:06:25.008 +as a canvas of multiple connected documents. + +00:06:25.009 --> 00:06:26.589 +One good thing that happens there is that + +00:06:26.590 --> 00:06:29.550 +you can basically have a piece of code somewhere + +00:06:29.551 --> 00:06:30.410 +and then piece of code + +00:06:30.411 --> 00:06:32.499 +somewhere very different position in the document, + +00:06:32.500 --> 00:06:34.732 +but you can put them together in the canvas + +00:06:34.733 --> 00:06:36.933 +and then see them side by side. + +00:06:36.934 --> 00:06:38.294 +So here also, let's say + +00:06:38.295 --> 00:06:41.996 +if I want to just have this image shown up at the top, + +00:06:41.997 --> 00:06:45.857 +what I can do is like I can pop this out, + +00:06:45.858 --> 00:06:49.938 +which opens a child frame, and then I can just go here. + +00:06:49.939 --> 00:06:52.460 +This child frame is showing the same image. + +00:06:52.461 --> 00:06:55.502 +So there's no change. So if I toggle this variable here, + +00:06:55.503 --> 00:06:58.423 +you can see that the image is updated. + +00:06:58.424 --> 00:07:02.199 +If I toggle it back to nil, the image, the legend is gone. + +00:07:02.200 --> 00:07:03.367 +And you can obviously, you know, + +00:07:03.368 --> 00:07:08.690 +you can make a lot of things come up as child frames. + +00:07:08.691 --> 00:07:09.430 +This is the same image. + +00:07:09.431 --> 00:07:11.291 +So even if you go down to the document, + +00:07:11.292 --> 00:07:13.810 +you will see the same image. + +00:07:13.811 --> 00:07:18.174 +So yeah, this is what I have right now. + +00:07:18.175 --> 00:07:21.956 +I'm definitely looking forward to making it more useful, + +00:07:21.957 --> 00:07:25.599 +probably including more kinds of child frames, + +00:07:25.600 --> 00:07:29.965 +maybe like making the whole document an infinite canvas. + +NOTE Wrapping up + +00:07:29.966 --> 00:07:32.099 +Alright, so that's the talk. + +00:07:32.100 --> 00:07:33.346 +If you're interested in the codebase, + +00:07:33.347 --> 00:07:34.446 +here's the homepage + +00:07:34.447 --> 00:07:35.546 +for the project [https://dev.lepisma.xyz/git/ob-rx]. + +00:07:35.547 --> 00:07:37.566 +So the next steps for me are basically + +00:07:37.567 --> 00:07:40.647 +making my workflow easier in matplotlib, + +00:07:40.648 --> 00:07:42.587 +which is a Python-based library, + +00:07:42.588 --> 00:07:45.348 +and d3.js, which is for JavaScript. + +00:07:45.349 --> 00:07:47.888 +For the JS thing, I might have to add + +00:07:47.889 --> 00:07:49.540 +the interactive JS child frames, + +00:07:49.640 --> 00:07:51.829 +and I am also looking forward to building something + +00:07:51.830 --> 00:07:53.969 +which can replicate the work + +00:07:53.970 --> 00:07:56.750 +of the Observable's infinite canvas, + +00:07:56.751 --> 00:07:57.490 +because that's something + +00:07:57.491 --> 00:08:00.619 +which I found really useful in my work with + +00:08:00.620 --> 00:08:02.240 +just JS visualizations. + +00:08:02.340 --> 00:08:05.540 +So yeah, happy to take questions on Etherpad + +00:08:05.560 --> 00:08:08.240 +and thank you for your time. diff --git a/2025/info/org-babel-after.md b/2025/info/org-babel-after.md index bd4b56cd..f788e2a1 100644 --- a/2025/info/org-babel-after.md +++ b/2025/info/org-babel-after.md @@ -1,6 +1,220 @@ <!-- Automatically generated by emacsconf-publish-after-page --> +<div class="transcript transcript-mainVideo"><a name="org-babel-mainVideo-transcript"></a><h1>Transcript</h1> + + +<div class="transcript-heading">[[!template new="1" text="""What are reactive notebooks?""" start="00:00:01.120" video="mainVideo-org-babel" id="subtitle"]]</div>[[!template text="""Hello, everyone. My name is Abhinav,""" start="00:00:01.120" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and I'm going to talk about""" start="00:00:03.034" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""how to make Org Babel reactive. So reactivity here""" start="00:00:03.901" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""means reactivity in the sense of reactive notebooks.""" start="00:00:07.240" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So if you used Org Babel,""" start="00:00:10.001" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""you might also have used Jupyter notebooks,""" start="00:00:11.601" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""which are basically notebooks primarily for""" start="00:00:13.934" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""Python programming,""" start="00:00:16.200" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""where you have these text and code blocks interleaved,""" start="00:00:16.934" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and then you can execute every code block independently,""" start="00:00:20.101" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and then you control the order of execution manually,""" start="00:00:23.158" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""or you can just run the code blocks""" start="00:00:25.859" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""from top to bottom. But with reactive notebooks,""" start="00:00:27.200" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""what happens is that there's another way of running""" start="00:00:29.700" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""which is basically by having all these""" start="00:00:32.928" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""dependent code blocks automatically get""" start="00:00:35.330" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""executed whenever you make a change.""" start="00:00:37.000" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So for example, if you change a variable,""" start="00:00:38.901" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""everything else that's dependent on""" start="00:00:40.775" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""that variable will be executed automatically.""" start="00:00:42.160" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""I'll show you an example of what that looks like.""" start="00:00:44.434" video="mainVideo-org-babel" id="subtitle"]] + +<div class="transcript-heading">[[!template new="1" text="""Reactivity demo""" start="00:00:49.042" video="mainVideo-org-babel" id="subtitle"]]</div>[[!template text="""Right, here's an example reactive Notebook.""" start="00:00:49.042" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So this is called Observable.""" start="00:00:51.763" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""Observable is this tool made by""" start="00:00:53.560" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""the creator of d3.js which is""" start="00:00:54.864" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""a famous JavaScript charting library. So here, the""" start="00:00:57.680" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""interface is very similar to Jupyter Notebook.""" start="00:01:01.500" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""You basically are having these cells""" start="00:01:03.668" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and each cell could be a text cell, like here,""" start="00:01:06.408" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""this is a Markdown cell""" start="00:01:08.509" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and then there are these code blocks.""" start="00:01:09.589" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""Now each code cell is basically defining a variable.""" start="00:01:11.610" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""This is important in reactive notebooks because""" start="00:01:15.251" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""each cell is connected to other cell via this variable""" start="00:01:17.840" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""usage. So here data is defined,""" start="00:01:21.240" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""then there is filtered which is defined""" start="00:01:23.553" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""which is dependent on data, and then this plot is""" start="00:01:25.013" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""dependent on filtered.""" start="00:01:27.720" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So now, in a classical notebook, what I will do is""" start="00:01:29.134" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""if I change something here, let's say from 1 to 2,""" start="00:01:31.154" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""I will have to run this, and then run this plot block again""" start="00:01:34.395" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""to make the change be visible.""" start="00:01:34.855" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""But in a reactive notebook, what happens is""" start="00:01:40.336" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""I can just change this from some value""" start="00:01:42.056" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""to some value, and then execute,""" start="00:01:44.397" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and then every descendant is also executed,""" start="00:01:46.257" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""because that's how the reactivity works.""" start="00:01:48.818" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""You change this variable,""" start="00:01:51.040" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""so this should also be changed,""" start="00:01:51.938" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""because this is dependent on this variable.""" start="00:01:53.081" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""Now this is really helpful""" start="00:01:55.239" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""if you have a very complex and messy notebook""" start="00:01:56.859" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""which is what actually happens in reality.""" start="00:01:59.000" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""You end up doing an exploratory analysis,""" start="00:02:01.200" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and you have these code blocks lying here and there.""" start="00:02:03.481" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""Then you change something""" start="00:02:05.960" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and then you have to keep something in your mind""" start="00:02:07.102" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""that if I change this, I need to run""" start="00:02:09.282" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""these five code blocks again""" start="00:02:11.363" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""to finally get to the result that I want to see.""" start="00:02:13.024" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""Stale state causes a lot of issues in Jupyter Notebooks.""" start="00:02:15.605" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So this is really good for reactivity, sorry reproducibility,""" start="00:02:20.468" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""but this is also really good for""" start="00:02:23.789" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""just having this exploration""" start="00:02:26.631" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""that you're trying to do. For example,""" start="00:02:28.600" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""you're changing something and it's really easy""" start="00:02:30.118" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""to just see that change happening in real time""" start="00:02:31.762" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""in your outcome variables, right?""" start="00:02:34.888" video="mainVideo-org-babel" id="subtitle"]] + +<div class="transcript-heading">[[!template new="1" text="""Org-Babel""" start="00:02:38.499" video="mainVideo-org-babel" id="subtitle"]]</div>[[!template text="""So I was wondering how to introduce this reactivity in Org Mode.""" start="00:02:38.499" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""And here's how it will look like.""" start="00:02:41.921" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So this is a demo Org Mode file.""" start="00:02:43.201" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""There are many Org Babel blocks here.""" start="00:02:46.303" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So you start from here.""" start="00:02:48.604" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""Let's say this is a code block. It has a name.""" start="00:02:49.564" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""And then there's another code block,""" start="00:02:52.086" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""which is dependent on the previous one,""" start="00:02:53.666" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""as you can see here, and so on.""" start="00:02:55.427" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""And then finally, there's a plot here,""" start="00:02:57.808" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""which is a gnuplot code.""" start="00:02:59.369" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""And you can see the image here.""" start="00:03:00.890" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""Now, what happens usually is that""" start="00:03:02.551" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""if I change this value from,""" start="00:03:04.132" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""let's say, 113 to 112, nothing happens on its own right?""" start="00:03:05.197" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""There's an extra step of execution that I will have to do""" start="00:03:09.200" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""so I will do that, and then the value is changed.""" start="00:03:12.200" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""Now the problem is that only this value is changed and""" start="00:03:15.080" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""if I go down and see the image, nothing will have changed.""" start="00:03:17.700" video="mainVideo-org-babel" id="subtitle"]] + +<div class="transcript-heading">[[!template new="1" text="""Running the whole buffer""" start="00:03:21.080" video="mainVideo-org-babel" id="subtitle"]]</div>[[!template text="""So what I can do is basically,""" start="00:03:21.080" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""a really simple thing is that,""" start="00:03:23.080" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""a simple trick is to basically""" start="00:03:24.819" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""enable a hook, like, add a hook""" start="00:03:26.600" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""whenever you're saving the buffer,""" start="00:03:29.446" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""you just run the full buffer again,""" start="00:03:30.526" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""like run all the code blocks automatically.""" start="00:03:31.867" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""Now if you do that, you can basically make a change somewhere""" start="00:03:34.288" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and then you can, you know,""" start="00:03:36.850" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""see how everything else is changing""" start="00:03:37.890" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""which gives you some sort of reactivity,""" start="00:03:41.072" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""but there's still a lot of computation""" start="00:03:42.713" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""that's being wasted.""" start="00:03:43.973" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""You might not want to change or run this code block again""" start="00:03:45.974" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""when something down there is changing.""" start="00:03:49.596" video="mainVideo-org-babel" id="subtitle"]] + +<div class="transcript-heading">[[!template new="1" text="""Caching""" start="00:03:51.901" video="mainVideo-org-babel" id="subtitle"]]</div>[[!template text="""So to counter that, you can actually add caching.""" start="00:03:51.901" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So if you add caching to any code block,""" start="00:03:54.568" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""that code block will only be executed again""" start="00:03:57.134" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""if that code has changed or""" start="00:03:59.801" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""the input variables have changed.""" start="00:04:02.400" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""But the other problem is that""" start="00:04:04.756" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""you don't want caching to be enabled for a lot of cases""" start="00:04:06.337" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""where the code block is actually dependent on""" start="00:04:08.660" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""external state, like for example,""" start="00:04:10.841" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""some sort of randomness or time.""" start="00:04:12.723" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So caching also is, you know, kind of,""" start="00:04:15.025" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""it's, like, an important thing to use,""" start="00:04:17.434" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""but it's probably not giving you the complete answer.""" start="00:04:18.968" video="mainVideo-org-babel" id="subtitle"]] + +<div class="transcript-heading">[[!template new="1" text="""Computation dependencies""" start="00:04:21.760" video="mainVideo-org-babel" id="subtitle"]]</div>[[!template text="""So what we can instead do is basically figure out""" start="00:04:21.760" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""the whole computation dependencies here.""" start="00:04:25.974" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So let's say if I look at this buffer,""" start="00:04:28.555" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""here's how all the blocks are connected.""" start="00:04:31.276" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So as you can see the plot code block""" start="00:04:35.077" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""is dependent on c and then legendpg,""" start="00:04:37.657" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and they themselves are dependent on these other nodes.""" start="00:04:40.118" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So when I make a change in b, I only want b to run""" start="00:04:43.919" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and then c and then plot. I don't want anything else to run.""" start="00:04:47.280" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So what I did was I wrote a small minor mode for Org Mode""" start="00:04:50.845" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""which does exactly this.""" start="00:04:54.268" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So whenever you are in a code block""" start="00:04:55.369" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and you are making a change and then you save it,""" start="00:04:57.770" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""it will just follow the trail from that code block""" start="00:04:59.872" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""to every other descendant which is going to be impacted,""" start="00:05:01.914" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and it just runs all of them, and nothing else gets executed.""" start="00:05:05.356" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So to see it in action, I will just enable that mode.""" start="00:05:09.720" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""Yeah, right. So now here, if I change this 113 to 112""" start="00:05:13.120" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and I save, this code, this variable gets changed.""" start="00:05:17.022" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""It's the same value because I did not update it again.""" start="00:05:21.244" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""And you can also see b also got changed""" start="00:05:23.745" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""because it's just following all the execution order and so on.""" start="00:05:25.720" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""The plot also got updated.""" start="00:05:29.668" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""We will be able to see more clearly""" start="00:05:31.728" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""once I change something more substantial.""" start="00:05:34.069" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So here's another variable.""" start="00:05:36.402" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So I added a small toggle button here,""" start="00:05:36.403" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""which is again part of the minor mode.""" start="00:05:41.333" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So since this is nil, if I toggle it,""" start="00:05:43.469" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""it will become true. And this variable dictates whether""" start="00:05:45.210" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""the plot will have the legend or not.""" start="00:05:49.400" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So if I toggle it to be t, now it's t""" start="00:05:51.175" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and you can see that the plot has legend that's visible.""" start="00:05:54.458" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""If I toggle it back again to nil, the legend is gone.""" start="00:05:57.901" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""Now this is nice, this...""" start="00:06:03.140" video="mainVideo-org-babel" id="subtitle"]] + +<div class="transcript-heading">[[!template new="1" text="""Making this even better""" start="00:06:04.534" video="mainVideo-org-babel" id="subtitle"]]</div>[[!template text="""This is already pretty helpful for me""" start="00:06:04.534" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""but what we can do is we can make it even better.""" start="00:06:06.480" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So one of the nicer ideas""" start="00:06:10.180" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""from these reactive notebooks""" start="00:06:11.401" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""is this idea of having an infinite canvas""" start="00:06:13.016" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""where you don't look at the document model,""" start="00:06:16.079" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""you look at the whole document""" start="00:06:19.023" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""as a canvas of multiple connected documents.""" start="00:06:20.624" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""One good thing that happens there is that""" start="00:06:25.009" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""you can basically have a piece of code somewhere""" start="00:06:26.590" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and then piece of code""" start="00:06:29.551" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""somewhere very different position in the document,""" start="00:06:30.411" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""but you can put them together in the canvas""" start="00:06:32.500" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and then see them side by side.""" start="00:06:34.733" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So here also, let's say""" start="00:06:36.934" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""if I want to just have this image shown up at the top,""" start="00:06:38.295" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""what I can do is like I can pop this out,""" start="00:06:41.997" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""which opens a child frame, and then I can just go here.""" start="00:06:45.858" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""This child frame is showing the same image.""" start="00:06:49.939" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So there's no change. So if I toggle this variable here,""" start="00:06:52.461" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""you can see that the image is updated.""" start="00:06:55.503" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""If I toggle it back to nil, the image, the legend is gone.""" start="00:06:58.424" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""And you can obviously, you know,""" start="00:07:02.200" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""you can make a lot of things come up as child frames.""" start="00:07:03.368" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""This is the same image.""" start="00:07:08.691" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So even if you go down to the document,""" start="00:07:09.431" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""you will see the same image.""" start="00:07:11.292" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So yeah, this is what I have right now.""" start="00:07:13.811" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""I'm definitely looking forward to making it more useful,""" start="00:07:18.175" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""probably including more kinds of child frames,""" start="00:07:21.957" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""maybe like making the whole document an infinite canvas.""" start="00:07:25.600" video="mainVideo-org-babel" id="subtitle"]] + +<div class="transcript-heading">[[!template new="1" text="""Wrapping up""" start="00:07:29.966" video="mainVideo-org-babel" id="subtitle"]]</div>[[!template text="""Alright, so that's the talk.""" start="00:07:29.966" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""If you're interested in the codebase,""" start="00:07:32.100" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""here's the homepage""" start="00:07:33.347" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""for the project [https://dev.lepisma.xyz/git/ob-rx].""" start="00:07:34.447" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So the next steps for me are basically""" start="00:07:35.547" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""making my workflow easier in matplotlib,""" start="00:07:37.567" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""which is a Python-based library,""" start="00:07:40.648" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and d3.js, which is for JavaScript.""" start="00:07:42.588" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""For the JS thing, I might have to add""" start="00:07:45.349" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""the interactive JS child frames,""" start="00:07:47.889" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and I am also looking forward to building something""" start="00:07:49.640" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""which can replicate the work""" start="00:07:51.830" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""of the Observable's infinite canvas,""" start="00:07:53.970" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""because that's something""" start="00:07:56.751" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""which I found really useful in my work with""" start="00:07:57.491" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""just JS visualizations.""" start="00:08:00.620" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""So yeah, happy to take questions on Etherpad""" start="00:08:02.340" video="mainVideo-org-babel" id="subtitle"]] +[[!template text="""and thank you for your time.""" start="00:08:05.560" video="mainVideo-org-babel" id="subtitle"]] + +</div> + +Captioner: abhinav + Questions or comments? Please e-mail [abhinav@lepisma.xyz](mailto:abhinav@lepisma.xyz?subject=Comment%20for%20EmacsConf%202023%20org-babel%3A%20Making%20Org-Babel%20reactive) diff --git a/2025/info/org-babel-before.md b/2025/info/org-babel-before.md index 765d728a..5f6c267e 100644 --- a/2025/info/org-babel-before.md +++ b/2025/info/org-babel-before.md @@ -1,19 +1,29 @@ <!-- Automatically generated by emacsconf-publish-before-page --> The following image shows where the talk is in the schedule for Sat 2025-12-06. Solid lines show talks with Q&A via BigBlueButton. Dashed lines show talks with Q&A via IRC or Etherpad.<div class="schedule-in-context schedule-svg-container" data-slug="org-babel"> -<svg width="700" height="150" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><title>Schedule for Saturday</title><rect width="700" height="150" x="0" y="0" fill="white"></rect><text font-size="10" fill="black" y="12" x="3">Saturday</text><a href="/2025/talks/sat-open" title="Saturday opening remarks" data-slug="sat-open"><title> 9:00- 9:10 Saturday opening remarks</title><rect x="0" y="15" opacity="0.5" width="13" height="59" stroke="black" stroke-dasharray="5,5,5" fill="peachpuff"></rect><g transform="translate(11,73)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">sat-open</text></g></a><a href="/2025/talks/org-babel" title="Making Org-Babel reactive" data-slug="org-babel"><title> 9:10- 9:20 Making Org-Babel reactive</title><rect stroke-width="3" x="13" y="15" opacity="0.8" width="13" height="59" stroke="black" stroke-dasharray="5,5,5" fill="peachpuff"></rect><g transform="translate(24,73)"><text font-weight="bold" fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">org-babel</text></g></a><a href="/2025/talks/reference" title="Emacs as a fully-fledged reference manager" data-slug="reference"><title> 9:30- 9:55 Emacs as a fully-fledged reference manager</title><rect x="41" y="15" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="" fill="peachpuff"></rect><g transform="translate(73,73)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">reference</text></g></a><a href="/2025/talks/gmail" title="org-gmail: A deep integration of Gmail into your Org Mode" data-slug="gmail"><title>10:15-10:40 org-gmail: A deep integration of Gmail into your Org Mode</title><rect x="102" y="15" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="5,5,5" fill="peachpuff"></rect><g transform="translate(134,73)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">gmail</text></g></a><a href="/2025/talks/gnus" title="Reading and writing emails in GNU Emacs with Gnus" data-slug="gnus"><title>10:50-11:15 Reading and writing emails in GNU Emacs with Gnus</title><rect x="150" y="15" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="5,5,5" fill="peachpuff"></rect><g transform="translate(182,73)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">gnus</text></g></a><a href="/2025/talks/latex" title="LaTeX export in org-mode: the overhaul" data-slug="latex"><title>11:25-11:45 LaTeX export in org-mode: the overhaul</title><rect x="199" y="15" opacity="0.5" width="27" height="59" stroke="black" stroke-dasharray="" fill="peachpuff"></rect><g transform="translate(224,73)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">latex</text></g></a><a href="/2025/talks/calc" title="Basic Calc functionality for engineering or electronics" data-slug="calc"><title> 1:00- 1:25 Basic Calc functionality for engineering or electronics</title><rect x="329" y="15" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="5,5,5" fill="peachpuff"></rect><g transform="translate(361,73)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">calc</text></g></a><a href="/2025/talks/blee-lcnt" title="Blee-LCNT: An Emacs-centered content production and self-publication framework" data-slug="blee-lcnt"><title> 1:35- 2:15 Blee-LCNT: An Emacs-centered content production and self-publication framework</title><rect x="377" y="15" opacity="0.5" width="54" height="59" stroke="black" stroke-dasharray="" fill="peachpuff"></rect><g transform="translate(429,73)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">blee-lcnt</text></g></a><a href="/2025/talks/greader" title="GNU Emacs Greader (Gnamù Reader) mode is the best Emacs mode in existence" data-slug="greader"><title> 2:35- 2:40 GNU Emacs Greader (Gnamù Reader) mode is the best Emacs mode in existence</title><rect x="459" y="15" opacity="0.5" width="6" height="59" stroke="black" stroke-dasharray="5,5,5" fill="peachpuff"></rect><g transform="translate(463,73)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">greader</text></g></a><a href="/2025/talks/open-mic" title="Open session" data-slug="open-mic"><title> 2:50- 3:40 Open session</title><rect x="480" y="15" opacity="0.5" width="68" height="59" stroke="black" stroke-dasharray="" fill="peachpuff"></rect><g transform="translate(546,73)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">open-mic</text></g></a><a href="/2025/talks/sat-close" title="Saturday closing remarks / open session" data-slug="sat-close"><title> 4:00- 4:10 Saturday closing remarks / open session</title><rect x="576" y="15" opacity="0.5" width="13" height="59" stroke="black" stroke-dasharray="" fill="peachpuff"></rect><g transform="translate(587,73)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">sat-close</text></g></a><a href="/2025/talks/schemacs" title="One year progress update Schemacs (formerly Gypsum)" data-slug="schemacs"><title> 9:30- 9:55 One year progress update Schemacs (formerly Gypsum)</title><rect x="41" y="75" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="" fill="skyblue"></rect><g transform="translate(73,133)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">schemacs</text></g></a><a href="/2025/talks/juicemacs" title="Juicemacs: exploring speculative JIT compilation for ELisp in Java" data-slug="juicemacs"><title>10:15-10:35 Juicemacs: exploring speculative JIT compilation for ELisp in Java</title><rect x="102" y="75" opacity="0.5" width="27" height="59" stroke="black" stroke-dasharray="5,5,5" fill="skyblue"></rect><g transform="translate(127,133)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">juicemacs</text></g></a><a href="/2025/talks/swanky" title="Swanky Python: Interactive development for Python" data-slug="swanky"><title>10:45-11:10 Swanky Python: Interactive development for Python</title><rect x="144" y="75" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="5,5,5" fill="skyblue"></rect><g transform="translate(176,133)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">swanky</text></g></a><a href="/2025/talks/python" title="Interactive Python programming in Emacs" data-slug="python"><title>11:20-11:40 Interactive Python programming in Emacs</title><rect x="192" y="75" opacity="0.5" width="27" height="59" stroke="black" stroke-dasharray="" fill="skyblue"></rect><g transform="translate(217,133)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">python</text></g></a><a href="/2025/talks/llm" title="Emacs, editors, and LLM driven workflows" data-slug="llm"><title> 1:00- 1:25 Emacs, editors, and LLM driven workflows</title><rect x="329" y="75" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="" fill="skyblue"></rect><g transform="translate(361,133)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">llm</text></g></a><a href="/2025/talks/private-ai" title="Emacs and private AI: a great match" data-slug="private-ai"><title> 1:45- 2:05 Emacs and private AI: a great match</title><rect x="391" y="75" opacity="0.5" width="27" height="59" stroke="black" stroke-dasharray="" fill="skyblue"></rect><g transform="translate(416,133)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">private-ai</text></g></a><a href="/2025/talks/commonlisp" title="Common Lisp images communicating like-a-human through shared Emacs slime and eev" data-slug="commonlisp"><title> 2:25- 2:55 Common Lisp images communicating like-a-human through shared Emacs slime and eev</title><rect x="446" y="75" opacity="0.5" width="41" height="59" stroke="black" stroke-dasharray="5,5,5" fill="skyblue"></rect><g transform="translate(485,133)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">commonlisp</text></g></a><a href="/2025/talks/graphics" title="Modern Emacs/Elisp hardware/software accelerated graphics" data-slug="graphics"><title> 3:05- 3:30 Modern Emacs/Elisp hardware/software accelerated graphics</title><rect x="500" y="75" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="" fill="skyblue"></rect><g transform="translate(532,133)"><text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)">graphics</text></g></a><g transform="translate(0,3)"><line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line><text fill="black" x="0" y="140" font-size="10" text-anchor="left">9 AM</text></g><g transform="translate(82,3)"><line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line><text fill="black" x="0" y="140" font-size="10" text-anchor="left">10 AM</text></g><g transform="translate(164,3)"><line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line><text fill="black" x="0" y="140" font-size="10" text-anchor="left">11 AM</text></g><g transform="translate(247,3)"><line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line><text fill="black" x="0" y="140" font-size="10" text-anchor="left">12 PM</text></g><g transform="translate(329,3)"><line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line><text fill="black" x="0" y="140" font-size="10" text-anchor="left">1 PM</text></g><g transform="translate(411,3)"><line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line><text fill="black" x="0" y="140" font-size="10" text-anchor="left">2 PM</text></g><g transform="translate(494,3)"><line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line><text fill="black" x="0" y="140" font-size="10" text-anchor="left">3 PM</text></g><g transform="translate(576,3)"><line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line><text fill="black" x="0" y="140" font-size="10" text-anchor="left">4 PM</text></g><g transform="translate(658,3)"><line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line><text fill="black" x="0" y="140" font-size="10" text-anchor="left">5 PM</text></g></svg> +<svg width="700" height="150" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <title> Schedule for Saturday</title> <rect width="700" height="150" x="0" y="0" fill="white"></rect> <text font-size="10" fill="black" y="12" x="3"> Saturday</text> <a href="/2025/talks/sat-open" title="Saturday opening remarks" data-slug="sat-open"> <title> 9:00- 9:10 Saturday opening remarks</title> <rect x="0" y="15" opacity="0.5" width="13" height="59" stroke="black" stroke-dasharray="5,5,5" fill="peachpuff"></rect> <g transform="translate(11,73)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> sat-open</text></g></a> <a href="/2025/talks/org-babel" title="Making Org-Babel reactive" data-slug="org-babel"> <title> 9:10- 9:20 Making Org-Babel reactive</title> <rect stroke-width="3" x="13" y="15" opacity="0.8" width="13" height="59" stroke="black" stroke-dasharray="5,5,5" fill="peachpuff"></rect> <g transform="translate(24,73)"> <text font-weight="bold" fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> org-babel</text></g></a> <a href="/2025/talks/reference" title="Emacs as a fully-fledged reference manager" data-slug="reference"> <title> 9:30- 9:55 Emacs as a fully-fledged reference manager</title> <rect x="41" y="15" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="" fill="peachpuff"></rect> <g transform="translate(73,73)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> reference</text></g></a> <a href="/2025/talks/gmail" title="org-gmail: A deep integration of Gmail into your Org Mode" data-slug="gmail"> <title> 10:15-10:40 org-gmail: A deep integration of Gmail into your Org Mode</title> <rect x="102" y="15" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="5,5,5" fill="peachpuff"></rect> <g transform="translate(134,73)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> gmail</text></g></a> <a href="/2025/talks/gnus" title="Reading and writing emails in GNU Emacs with Gnus" data-slug="gnus"> <title> 10:50-11:15 Reading and writing emails in GNU Emacs with Gnus</title> <rect x="150" y="15" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="5,5,5" fill="peachpuff"></rect> <g transform="translate(182,73)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> gnus</text></g></a> <a href="/2025/talks/latex" title="LaTeX export in org-mode: the overhaul" data-slug="latex"> <title> 11:25-11:45 LaTeX export in org-mode: the overhaul</title> <rect x="199" y="15" opacity="0.5" width="27" height="59" stroke="black" stroke-dasharray="" fill="peachpuff"></rect> <g transform="translate(224,73)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> latex</text></g></a> <a href="/2025/talks/calc" title="Basic Calc functionality for engineering or electronics" data-slug="calc"> <title> 1:00- 1:25 Basic Calc functionality for engineering or electronics</title> <rect x="329" y="15" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="5,5,5" fill="peachpuff"></rect> <g transform="translate(361,73)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> calc</text></g></a> <a href="/2025/talks/blee-lcnt" title="Blee-LCNT: An Emacs-centered content production and self-publication framework" data-slug="blee-lcnt"> <title> 1:35- 2:15 Blee-LCNT: An Emacs-centered content production and self-publication framework</title> <rect x="377" y="15" opacity="0.5" width="54" height="59" stroke="black" stroke-dasharray="" fill="peachpuff"></rect> <g transform="translate(429,73)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> blee-lcnt</text></g></a> <a href="/2025/talks/greader" title="GNU Emacs Greader (Gnamù Reader) mode is the best Emacs mode in existence" data-slug="greader"> <title> 2:35- 2:40 GNU Emacs Greader (Gnamù Reader) mode is the best Emacs mode in existence</title> <rect x="459" y="15" opacity="0.5" width="6" height="59" stroke="black" stroke-dasharray="5,5,5" fill="peachpuff"></rect> <g transform="translate(463,73)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> greader</text></g></a> <a href="/2025/talks/open-mic" title="Open session" data-slug="open-mic"> <title> 2:50- 3:40 Open session</title> <rect x="480" y="15" opacity="0.5" width="68" height="59" stroke="black" stroke-dasharray="" fill="peachpuff"></rect> <g transform="translate(546,73)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> open-mic</text></g></a> <a href="/2025/talks/sat-close" title="Saturday closing remarks / open session" data-slug="sat-close"> <title> 4:00- 4:10 Saturday closing remarks / open session</title> <rect x="576" y="15" opacity="0.5" width="13" height="59" stroke="black" stroke-dasharray="" fill="peachpuff"></rect> <g transform="translate(587,73)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> sat-close</text></g></a> <a href="/2025/talks/schemacs" title="One year progress update Schemacs (formerly Gypsum)" data-slug="schemacs"> <title> 9:30- 9:55 One year progress update Schemacs (formerly Gypsum)</title> <rect x="41" y="75" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="" fill="skyblue"></rect> <g transform="translate(73,133)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> schemacs</text></g></a> <a href="/2025/talks/juicemacs" title="Juicemacs: exploring speculative JIT compilation for ELisp in Java" data-slug="juicemacs"> <title> 10:15-10:35 Juicemacs: exploring speculative JIT compilation for ELisp in Java</title> <rect x="102" y="75" opacity="0.5" width="27" height="59" stroke="black" stroke-dasharray="5,5,5" fill="skyblue"></rect> <g transform="translate(127,133)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> juicemacs</text></g></a> <a href="/2025/talks/swanky" title="Swanky Python: Interactive development for Python" data-slug="swanky"> <title> 10:45-11:10 Swanky Python: Interactive development for Python</title> <rect x="144" y="75" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="5,5,5" fill="skyblue"></rect> <g transform="translate(176,133)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> swanky</text></g></a> <a href="/2025/talks/python" title="Interactive Python programming in Emacs" data-slug="python"> <title> 11:20-11:40 Interactive Python programming in Emacs</title> <rect x="192" y="75" opacity="0.5" width="27" height="59" stroke="black" stroke-dasharray="" fill="skyblue"></rect> <g transform="translate(217,133)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> python</text></g></a> <a href="/2025/talks/llm" title="Emacs, editors, and LLM driven workflows" data-slug="llm"> <title> 1:00- 1:25 Emacs, editors, and LLM driven workflows</title> <rect x="329" y="75" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="" fill="skyblue"></rect> <g transform="translate(361,133)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> llm</text></g></a> <a href="/2025/talks/private-ai" title="Emacs and private AI: a great match" data-slug="private-ai"> <title> 1:45- 2:05 Emacs and private AI: a great match</title> <rect x="391" y="75" opacity="0.5" width="27" height="59" stroke="black" stroke-dasharray="" fill="skyblue"></rect> <g transform="translate(416,133)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> private-ai</text></g></a> <a href="/2025/talks/commonlisp" title="Common Lisp images communicating like-a-human through shared Emacs slime and eev" data-slug="commonlisp"> <title> 2:25- 2:55 Common Lisp images communicating like-a-human through shared Emacs slime and eev</title> <rect x="446" y="75" opacity="0.5" width="41" height="59" stroke="black" stroke-dasharray="5,5,5" fill="skyblue"></rect> <g transform="translate(485,133)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> commonlisp</text></g></a> <a href="/2025/talks/graphics" title="Modern Emacs/Elisp hardware/software accelerated graphics" data-slug="graphics"> <title> 3:05- 3:30 Modern Emacs/Elisp hardware/software accelerated graphics</title> <rect x="500" y="75" opacity="0.5" width="34" height="59" stroke="black" stroke-dasharray="" fill="skyblue"></rect> <g transform="translate(532,133)"> <text fill="black" x="0" y="0" font-size="10" transform="rotate(-90)"> graphics</text></g></a> <g transform="translate(0,3)"> <line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line> <text fill="black" x="0" y="140" font-size="10" text-anchor="left"> 9 AM</text></g> <g transform="translate(82,3)"> <line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line> <text fill="black" x="0" y="140" font-size="10" text-anchor="left"> 10 AM</text></g> <g transform="translate(164,3)"> <line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line> <text fill="black" x="0" y="140" font-size="10" text-anchor="left"> 11 AM</text></g> <g transform="translate(247,3)"> <line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line> <text fill="black" x="0" y="140" font-size="10" text-anchor="left"> 12 PM</text></g> <g transform="translate(329,3)"> <line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line> <text fill="black" x="0" y="140" font-size="10" text-anchor="left"> 1 PM</text></g> <g transform="translate(411,3)"> <line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line> <text fill="black" x="0" y="140" font-size="10" text-anchor="left"> 2 PM</text></g> <g transform="translate(494,3)"> <line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line> <text fill="black" x="0" y="140" font-size="10" text-anchor="left"> 3 PM</text></g> <g transform="translate(576,3)"> <line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line> <text fill="black" x="0" y="140" font-size="10" text-anchor="left"> 4 PM</text></g> <g transform="translate(658,3)"> <line stroke="darkgray" x1="0" y1="0" x2="0" y2="120"></line> <text fill="black" x="0" y="140" font-size="10" text-anchor="left"> 5 PM</text></g></svg> </div> [[!toc ]] Format: 9-min talk ; Q&A: Etherpad <https://pad.emacsconf.org/2025-org-babel> Etherpad: <https://pad.emacsconf.org/2025-org-babel> Discuss on IRC: [#emacsconf-gen](https://chat.emacsconf.org/?join=emacsconf,emacsconf-gen) -Status: Ready to stream +Status: Now playing on the conference livestream <div>Times in different time zones:</div><div class="times" start="2025-12-06T14:10:00Z" end="2025-12-06T14:20:00Z"><div class="conf-time">Saturday, Dec 6 2025, ~9:10 AM - 9:20 AM EST (US/Eastern)</div><div class="others"><div>which is the same as:</div>Saturday, Dec 6 2025, ~8:10 AM - 8:20 AM CST (US/Central)<br />Saturday, Dec 6 2025, ~7:10 AM - 7:20 AM MST (US/Mountain)<br />Saturday, Dec 6 2025, ~6:10 AM - 6:20 AM PST (US/Pacific)<br />Saturday, Dec 6 2025, ~2:10 PM - 2:20 PM UTC <br />Saturday, Dec 6 2025, ~3:10 PM - 3:20 PM CET (Europe/Paris)<br />Saturday, Dec 6 2025, ~4:10 PM - 4:20 PM EET (Europe/Athens)<br />Saturday, Dec 6 2025, ~7:40 PM - 7:50 PM IST (Asia/Kolkata)<br />Saturday, Dec 6 2025, ~10:10 PM - 10:20 PM +08 (Asia/Singapore)<br />Saturday, Dec 6 2025, ~11:10 PM - 11:20 PM JST (Asia/Tokyo)</div></div><div><strong><a href="/2025/watch/gen/">Find out how to watch and participate</a></strong></div> +<div class="vid mainVideo"><video controls preload="none" id="mainVideo-org-babel"><source src="https://media.emacsconf.org/2025/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--main.webm" />captions="""<track label="English" kind="captions" srclang="en" src="/2025/captions/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--main.vtt" default />"""<track kind="chapters" label="Chapters" src="/2025/captions/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--main--chapters.vtt" /><p><em>Your browser does not support the video tag. Please download the video instead.</em></p></video>[[!template id="chapters" vidid="mainVideo-org-babel" data=""" +00:01.120 What are reactive notebooks? +00:49.042 Reactivity demo +02:38.499 Org-Babel +03:21.080 Running the whole buffer +03:51.901 Caching +04:21.760 Computation dependencies +06:04.534 Making this even better +07:29.966 Wrapping up +"""]]<div></div>Duration: 08:08 minutes<div class="files resources"><ul><li><a href="https://pad.emacsconf.org/2025-org-babel">Open Etherpad</a></li><li><a href="https://pad.emacsconf.org/2025-org-babel">Open public Q&A</a></li><li><a href="https://media.emacsconf.org/2025/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--edited.vtt">Download --edited.vtt</a></li><li><a href="https://media.emacsconf.org/2025/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--intro.vtt">Download --intro.vtt</a></li><li><a href="https://media.emacsconf.org/2025/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--intro.webm">Download --intro.webm</a></li><li><a href="https://media.emacsconf.org/2025/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--main--chapters.vtt">Download --main--chapters.vtt</a></li><li><a href="https://media.emacsconf.org/2025/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--main.opus">Download --main.opus (7.1MB)</a></li><li><a href="https://media.emacsconf.org/2025/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--main.png">Download --main.png</a></li><li><a href="https://media.emacsconf.org/2025/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--main.vtt">Download --main.vtt</a></li><li><a href="https://media.emacsconf.org/2025/emacsconf-2025-org-babel--making-orgbabel-reactive--abhinav-tushar--main.webm">Download --main.webm (17MB)</a></li><li><a href="https://youtu.be/1dWWi3xfmug">View on Youtube</a></li></ul></div></div> # Description <!-- End of emacsconf-publish-before-page -->
\ No newline at end of file |