Electric Clojure – a signals DSL for fullstack web UI, with compiler-managed network sync

Electric (formerly known as Photon) is a reactive and network-aware Clojure/Script DSL that fully abstracts over client/server state sync at the programming language layer, in order to achieve strong composition across the frontend/backend boundary in dynamic web apps. With Electric, backend expressions (i.e. queries) and frontend expressions (i.e. views) compose directly. There is no incidental network divide. The Electric macros will, at compile time, perform deep graph analysis of your hollistic program's data flow in order to transparently partition and distribute it across the client/server distributed system. There is no client/server dichotomy from the programmer's perspective. All IO and effects are managed.

Figure: This is not RPC or client-side ORM. The Electric compiler performs deep graph analysis of your unified frontend/backend program to automatically determine the optimal network cut, and then compile it into separate client and server target programs that cooperate and anticipate each other's needs.

• Fully reactive: unlike javascript frameworks, in Electric, reactivity is built directly into the programming language itself. Reactive-if, reactive-for, reactive try/catch. When everything is reactive, it feels like nothing is reactive. No observables! No async types! De-load your mind and relax.

• Multi-tier: frontend and backend are defined in the same expression, same function, same file. It's not code sharing, it's code splitting. Let the compiler infer the boundary from your code, instead of contorting your code — nay, your entire architecture — to fit the boundary.

• Network-transparent: Electric closures close over server and client scope bindings, all in the same expression. The Electric compiler uses compile-time static knowledge of your source code to slice your expressions into client and server portions. Right through closures, loops and deeply nested function calls.

• Strong composition: Network-transparent Electric functions are true functions. They follow function laws and work at the Clojure/Script REPL. You have lambda, recursion, HOFs, closures, dynamic scope, macros, etc: the full undamaged composition power of Lisp. Goodbye "functional core imperative shell"; with Electric the entire system is a function.

• Multiplayer-native: everything is automatically multiplayer, 0 LOC cost.

Our mission is to raise the abstraction ceiling in web development in the same way that garbage collection did for functional programming, paving the way for something new.

Demos, examples, tutorials

Demos

• Proof of client/server transfer
• Two Clocks – streaming lexical scope
• Frontend treeview as direct recursion over filesystem
• Folder explorer: node_modules paginated from frontend (virtual scroll)
• Datomic database browser
• TodoMVC
• TodoMVC Composed – network transparent composition
• React.js/Reagent interop
• Electric Painter, by Dag
• Electric Soduku, by s-ol
• Map demo - OpenLayers webcomponents

Tutorials

• Todos Basic
• Full-stack webview with datascript
• Routing integration - goog.history
• Multiplayer chat with presence
• SQL data backend
• virtual scroll internals
• Electric Y-Combinator: network-transparent composition

How it works

• UIs are streaming DAGs (2022)
• You don't need a web framework, you need a web language (2021)

Getting Started

First run the demos:

git clone git@github.com:hyperfiddle/electric.git
cd electric
yarn                       # optional, only needed for demo of React interop
clj -A:dev -X user/main    # serves demos at http://localhost:8080

From the REPL:

• dev alias; (user/main) compiles assets and serves app.
• see src-dev/user.clj & user.cljs
• demo source code at src-docs/user/

Standalone starter repo to fork:

• https://github.com/hyperfiddle/electric-starter-app

IDE setup

• Cursive
• Emacs

Dependency and changelog

com.hyperfiddle/electric {:mvn/version "v2-alpha-123-ga7fa624f"}

• Changelog
• Clojure compatibiltiy matrix
• Support chatroom: #hyperfiddle @ clojurians.net; follow https://twitter.com/dustingetz for progress updates
• Contributing: PRs require a signed contributors agreement (like Clojure), DM dustingetz on slack. No typo fixes please, we are not all native English speakers and we decided it's not worth it.

Errors and issues

• Requires -Xss2m to compile. The default of 1m ThreadStackSize is exceeded by the Electric compiler due to large macroexpansions resulting in false StackOverflowError during analysis.
• :eval opcode - probably interop syntax, or a macro like assert that expands to interop syntax
• Unbound var. Usually means wrong peer, i.e. accessed server-only var on client

References and reading

Electric Clojure implements a form of arrowized continuous time dataflow programming with extensions for network-transparent function composition.

• The Haskell School of Music: From Signals to Symphonies (2011) – best starting point.
• The Essence of Dataflow Programming (2006) – great category theory overview of dataflow programming
• Push-pull functional reactive programming, Elliot (2009)
• Breaking down FRP, Jane Street (2014)
• Seven Implementations of Incremental (video), Jane Street, 2016