@natecull I read the original post in its entirety, many rich ideas in there to chew on. I saved the post in a Markdown file and I’ve been considering how to translate it to a working prototype. The ideas are ambitious and would be challenging to attempt even partially - but the first few steps have already been an interesting learning experience.
THINKER-2000 was my first idea for the project name, a modern re-imagining of Commodore PET 2001. I’d still like to incorporate that retro aesthetic , but now I’m leaning toward the name Node Book. A “node” being the term for an item in tree-structured data; each node is connected via “branches” to its parent and child nodes. A node can contain any data type and media, including other nodes directly or as references (internal and external links).
I wondered what language and tech stack to use, to make sure every part of it is comprehensible and hackable, easy to copy & paste into other projects. From the SUSN project I saw Node.js is already installed on your system, as it is on mine, so that’s a common ground. I’m fond of Bun, a TypeScript runtime with modern features (like built-in native bindings for SQLite) - but I didn’t want to impose my preference as a requirement, Node is more popular and standard. So the application will be written in plain JavaScript. A flawed lingua franca, the American English of programming.
Requiring no build setup felt important, so you can just download the project and run it immediately. I also wanted to have zero dependencies, to avoid needing to install from a remote source like NPM (Node package manager).
I started with an HTML file. No server, just opening the file with a browser. This made think, maybe HTML is the best portable medium for a cross-platform single-file executable application. Everyone has a browser installed, and they can simply download and open an HTML file that contains the whole application, including CSS and JS. There are known limitations of a static HTML page - such as CORS (Cross-Origin Resource Sharing) for communicating with external servers; and I think running Wasm is prevented - but perhaps these features can be a progressive enhancement, to make the local server optional.
The name “idea processor” came to me..from a January 1984 Byte Magazine article about Thinktank.. Essentially an “outliner”, a word processing mode that got quickly subsumed into Microsoft Word and, I suppose, Emacs Org Mode.
A few years ago I made a prototype app called Bonsai, a tree-structured outliner. The drag-and-drop editing of the tree was smooth and keyboard accessible. But it got out of control as I implemented collaborative editing via WebSockets. The ad-hoc conflict resolution of edit operations was a bit fragile, not robust logic. If I were to revisit that feature, I’d build it on a proper foundation like the Yjs library to handle distributed data types.
Yjs is a CRDT implementation that exposes its internal data structure as shared types. Shared types are common data types like
MaporArraywith superpowers: changes are automatically distributed to other peers and merged without merge conflicts.Yjs is network agnostic (p2p!), supports many existing rich text editors, offline editing, version snapshots, undo/redo and shared cursors. It scales well with an unlimited number of users and is well suited for even large documents.
That sounds good, like this could be one of the basic building blocks of malleable software. It reminds me of another library..
Build instant multiplayer webapps, no server required — Magic WebRTC matchmaking over BitTorrent, Nostr, MQTT, IPFS, Supabase, and Firebase.
Trystero manages a clandestine courier network that lets your application’s users talk directly with one another, encrypted and without a server middleman.
The net is full of open, decentralized communication channels: torrent trackers, IoT device brokers, boutique file protocols, and niche social networks.
Trystero piggybacks on these networks to automatically establish secure, private, P2P connections between your app’s users with no effort on your part.
As a mockup of the outliner, I wrote an example list using ul and li.
- Hello, world
- List
- Item 1
- Item 2
Now how to make this a dynamically editable list/tree..
..Oops I saved and published the post while still in draft. Well, to be continued..