[Weekend Drop] Sunil Pai: React and the Meta of the Web

A wideranging convo with Sunil covering the future of React, the Third Age of JavaScript, and the Meta of online discourse.

Watch on YouTube: https://www.youtube.com/watch?v=H3h1WICelqs
Follow Sunil: https://twitter.com/threepointone

Chapters:

• [00:01:40] React and Temporal, Declarative vs Imperative
  • My Temporal Explainer: https://twitter.com/swyx/status/1417165270641045505
  • https://www.solidjs.com/ 
• [00:12:57] State Charts and Lucylang
  • https://lucylang.org/
  • XState and Stately https://stately.ai/viz
• [00:17:08] The Future of React
• [00:25:03] React Streaming Server Rendering vs SSR/JAMstack/DSG/DPR/ISR
  • ReactDOMServer.renderToNodeStream()
  • Sunil's Slides: https://www.icloud.com/keynote/0MyOJkDIOVfFit76PqJFLvPVg#react-advanced
  • https://react-lazy.coolcomputerclub.com/ 
• [00:33:13] Next.js and the Open Source Commons
• [00:38:46] The Third Age of JavaScript
  • Third Age of JS 
  • Benedict Evans (not Sinofsky) on Word Processors: https://www.ben-evans.com/benedictevans/2020/12/21/google-bundling-and-kill-zones
• [00:45:16] ESbuild vs SWC vs Bun
  • Bun (Jarred Sumner) https://twitter.com/jarredsumner/status/1390084458724741121 
• [00:50:46] Let Non-X Do X: Figma vs Canva, Webflow vs Wix/Squarespace 
  • Canva vs Figma valuations https://twitter.com/swyx/status/1438102616156917767
• [00:52:42] JavaScript Twitter and Notion's 9mb Marketing Site
  • Notion 9mb JS Site Tweet
  • mrmrs' Components.ai
• [01:06:33] React Server Components and Shopify Hydrogen/Oxygen
  • https://twitter.com/swyx/status/1410103013885108229 
• [01:09:18] Categorical Imperatives of Web Platforms: Cloudflare vs AWS, MongoDB vs Auth0, Gatsby vs Netlify
  • https://auth0.com/blog/introducing-auth0-actions/ 
• [01:18:34] Wrap-up 

Transcript

 

[00:01:40] React and Temporal, Declarative vs Imperative 
 

[00:01:40] swyx: Okay. So the first topic we want to talk about is React and Temporal, right?  

[00:01:43] Sunil Pai: I feel Temporal is introducing a shift into the workflow ecosystem, which is very similar to the one that React introduced to the JavaScript framework system.  

[00:01:54] swyx: That's the hope. I don't know if like my explanation of Temporal has reached everybody or has reached you. There are three core opinions, right? The first is that whenever you cross system boundaries, when you call it external API. So when you call internal microservices, there's a chance of failure and that multiplies, the more complex the system gets. 

[00:02:11] So you need a central orchestrator that holds all the retry states and logic, as well as timers And it tracks all the events and is able to resume from it from failure.  

[00:02:21] Second opinion that you should have is you should do event sourcing rather than try to just write your business logic and then instrument with observability logs after the fact you should have your logs as the source of truth. And if it's not in the log, it did not happen.  

[00:02:34] And then the final piece is the workflows as code, which is the one that you're focusing on, which is the programming model, in the sense that like all the other competitive workflow engines, like, Amazon step functions, Apache airflow, Dagster, like there's a bunch in this category. 

[00:02:48] They're all sort of JSON and YML DSLs, and the bind that you find yourself in is that basically you're reinventing a general purpose programming language inside of these JSON and YML DSLs because you find a need for loops, branching, variables functions, all the basic stuff. And, people find that like at the end of the day, all this tooling is available, you just have to make it run in inside of a general purpose programming language. So that's what Temporal offers.  

[00:03:12] But it's very interesting because it kind of straddles the imperative versus declarative debate, right? 

[00:03:17] React, people view as declarative. And I think it's mostly declarative, like there's imperative escape hatches, and because it's declarative, people can have a single sort of render model of their entire app for the entire tree. And I think it makes sense to them. 

[00:03:32] And you're saying that that's better, right? That's better than the imperative predecessor of like jQuery and randomly hooking up stuff and not having things tied up together. You sounded like you want it to  

[00:03:42] Sunil Pai: interrupt. So it's actually two things. One is the jQuery had an imperative API, and then they went way too hard into the declarative side with templating languages and then started reinventing stuff there. 

[00:03:54] So really react was like, no, you need access to an imperative language to create, you need a fully featured programming language to generate description trees like Dom trees or in this case, a workflow graphs.  

[00:04:10] swyx: Got it. So it's kind of like a halfway solution, maybe, maybe anyway. So the problem with us is that we're trying to say that imperative is better than declarative, for the purposes of expressing general purpose business logic, which is an interesting sell for me because in all other respects, I'm very used to arguing to declarative is better. 

[00:04:33] Then there's also an idea that people should build declarative layers on top of us. And I, it's just a very interesting, like back and forth between declarative and imperative that I don't know where I really stands apart from like, wherever we are is never good enough. So we need to add another layer to solve the current problems  

[00:04:51] Sunil Pai: there. 

[00:04:51] So there's a phrase for it and I forget what it's called the mechanism. It says that, uh, the system that allows you to execute stuff should not be the same system that prevents you from doing bad things. So there's a core, which is basically a fully featured API. And then you put gu...