dustingetz

React.js interop POC — Electric Clojure

• 80 LOC: demo-reagent-interop.cljc (25 LOC for adapter)

20220729.photon.reagent.react.interop.mp4

dustingetz

Proof of client/server transfer — Electric Clojure

Electric Clojure lets you code frontend/backend expressions that compose across the client/server boundary, due to compiler-managed network powered by DAGs. #Clojure

20230131.hello.photon.tranasfer.2.edited.mp4

• p/defn defines a function that follows all the same laws as regular Clojure functions, but it’s actually a macro that compiles the function body into a DAG (Directed Acyclic Graph).

dustingetz

Live-coding demo of #Hyperfiddle UI modeling language

• forms, tables, hyperlinks, routing
• queries on backend, rendering on frontend
• dynamic query dependencies
• WYSIWYG in-browser live editor

Strong composition – it's a functional expression! Compiler-managed network

dustingetz

Direct recursion over file system from the frontend — Electric Clojure (2022 June)

This video demonstrates traversing a filesystem tree from the frontend. The filesystem tree exists only on the server, and the HTML view exists only on the client. Nonetheless, we are able to unify the query/view logic into a single recursion in the simple, direct style of PHP, despite network. The Electric compiler automatically coordinates fine-grained reactive network sync.

Code note: in this video from last year, ~@ is the legacy syntax for client/server transfer, it has since been superseded by e/client and e/server markers.

20220621.photon.treeview.with.managed.nework.mp4

• No API, no client side database, no frontend state at all (except DOM)
• Literally all accidental complexity GONE

dustingetz

virtual scroll over node_modules v2 — Electric Clojure

• Direct filesystem reads from the view
• Direct function composition in the style of PHP, despite network
• No API, no client side database, no frontend state at all (except DOM), no frontend/backend.
• Literally all accidental complexity GONE
• 100% of server data sync is managed by Electric
• Rows have arbitrary server local data access, here querying file metadata #clojure
• Optimized and no scroll jank – DOM elements are fixed in place and reused

dustingetz

Photon demo: database branching (time travel)

• This demo uses DataScript's API for speculative transactions, not sure if can be done with sql read transactions.
• DataScript is on the server; code is network-transparent.
• 100 LOC for everything (table, query, popover, css, page)

20220910.branched.popover.staging.area.2.mp4

dustingetz

Photon demo: infinite scroll over node-modules

• 100% of server data sync is managed by Photon
• Rows have arbitrary server local data access, here querying file metadata #clojure

20220906.infinite.scroll.node.modules.mp4

Below is the approximate code (I've removed all the table/file stuff to just see the essential scroll logic)

dustingetz

(ns user.datafy-fs
  "nav implementation for java file system traversals"
  (:require [clojure.core.protocols :as ccp :refer [nav]]
            [clojure.datafy :refer [datafy]]
            [clojure.spec.alpha :as s]
            [hyperfiddle.rcf :refer [tests]])
  (:import [java.nio.file Path Paths Files]
           java.io.File
           java.nio.file.LinkOption
           [java.nio.file.attribute BasicFileAttributes FileTime]))

dustingetz

TodoMVC Composed (it's just a for loop!!!) — Electric Clojure

• An early demonstration "Compiler Managed Network" and the extreme dynamic composition it makes possible
• TodoMVC Composed merely calls the previous TodoMVC function inside a for loop.

20220822.Todomvc.Composed.mp4

dustingetz

10k dom elements with Photon

• Plus free multiplayer of course
• 25 LOC of which 48% are requires, CSS and whitespace. Count it!

20220823.10k.dom.elements.pixel.game.multiplayer.mp4