
Rete: JavaScript framework for visual programming and creating node editor - thisisastopsign
https://github.com/retejs/rete
======
mark_l_watson
Neat looking project but maybe the naming is off because of possible confusion
with Rete Networks (one of the coolest computer science algorithms and data
structures to optimize expert system rules engines for efficiently handling
very large numbers of production rules).

------
neuromute
Oddly, I’ve been playing with this library just this week. I’ve also been
looking at various alternatives (some of which have already been mentioned in
the comments here).

The only functionality I’m actually looking for is the ability to connect and
disconnect elements using virtual cables (that flex and look good, just like
those in rete). It’s for a software synth patchbay (like those used in the
Reason digital audio workstation software). So, ultimately, even though this
library is impressive, it isn’t quite the right fit for my project.

If anyone can recommend an alternative that focuses purely on cabling, I’d
love to hear about it!

~~~
codetrotter
Not sure if it fits the bill exactly but did you look at VCV Rack?

[https://vcvrack.com/](https://vcvrack.com/)

~~~
neuromute
I've downloaded vcvrack, but not actually tried it out yet. It looks awesome.
However, the project I'm working on is a web-based synth using the HTML5 Web
Audio API. It's built using Tone.js and NexusUI.js, so vcvrack isn't really
applicable, as far as I can tell at least!

Thanks for the recommendation though. :)

------
sls
Apparently nothing to do with the Rete algorithm (fwiw). [1]

[1]
[https://en.wikipedia.org/wiki/Rete_algorithm](https://en.wikipedia.org/wiki/Rete_algorithm)

------
newcrobuzon
Looks really nice! Looking forward to playing with it a bit.

Shameless plug: I built something similar as a part of my workflow platform
for JVM (for Java and Clojure):

[https://github.com/mikub/titanoboa](https://github.com/mikub/titanoboa)

The main focus of my tool is enterprise integration and data processing, but I
still love to play and experiment with the ideas of developing code directly
in browser and how to visualize its execution flow. So I built a live coding /
visualization also as a part of my tool. This becomes non-trivial if you apply
it to languages other then js (so browser integration becomes a bit harder).

I also think the main challenge here is the server-side part of things,
especially when you make such solution distributed - i.e. how you achieve high
availability and assure everything gets executed (at least) once even in case
of failover, how you cater for multitenancy while achieving sufficient
security/isolation between users etc. edit:spelling/formatting

------
sansnomme
See also:
[https://github.com/jagenjo/litegraph.js](https://github.com/jagenjo/litegraph.js)

~~~
agumonkey
man, growing up with Maya and Houdini, making a node editor and dataflow
engine was probably my ultimate dream

------
freeqaz
Shameless shill: We've been building a set of tools to make software
development more visual, kind of like this. There are some examples on our
site here, [https://refinery.io](https://refinery.io)

More specifically, you still write code and you visually connect pieces of
code together. Think "pipelines of transformations" in a functional
programming way. Then you click "deploy" and have it all running on AWS Lambda
with rich logging and other goodies.

A lot my inspiration comes from being a former game dev who has used Scratch
and UE4's Blueprint engine. I've personally found that it's difficult to get
the abstraction right in a way that keeps complexity in check (as others in
this thread have commented). That's why you still write code in Refinery --
you're just visually chaining microservice calls.

Would love to hear feedback + thoughts, if anybody is interested in sharing.
free at refinery.io is a good email for me. :)

------
pbiggar
We started with trying to create something like this when we started Dark
([https://darklang.com](https://darklang.com)). We ultimately moved away from
this style of programming, as we couldn't figure out a way to make it feel
"code-y" enough for people to want to write programs in it.

I'm super interested in what folks want to use this for?

~~~
tamat
Creator or litegraph here.

Visual programming works very well when you have data flowing, but it doesnt
work when you have loops and branching. But it is nice to support graphs for
some tasks, it really speeds up some processes.

~~~
dgudkov
>but it doesnt work when you have loops and branching

We managed to make visual programming work well with loops [1] and more or
less OK with branching [2]. The trick is to look at loops from a functional
perspective (i.e. as iter/map), rather than from imperative.

[1]
[https://easymorph.com/learn/iterations.html](https://easymorph.com/learn/iterations.html)

[2] [https://easymorph.com/learn/conditional-
workflows.html](https://easymorph.com/learn/conditional-workflows.html)

~~~
z3t4
I think the ultimate test is whether it can be self hosted. eg. can the
program be used to create the program itself!? Or what problem does it
solve?!?

------
yboris
Related: Node-RED - _Low-code programming for event-driven applications_

[https://nodered.org/](https://nodered.org/)

------
emmanueloga_
There's also [http://nodes.io/](http://nodes.io/) which is in alpha release
state the last thing I heard.

~~~
speedgoose
They should spend one hour to have HTTPS on their front-page though.

~~~
dmnsgn
Fixed.

------
mentos
Owner of this project should check out visual programming in Unreal Engine 4
it’s completely production ready and has shipped in many AAA titles.

~~~
mileycyrusXOXO
I absolutely love the blueprint editor in UE4. It enables me to rapidly hammer
out ideas and test new things. Not only that, but it helped me learn a lot
about how to go about doing things in UE4 so when I started writing CPP I
already had an understanding for where to put what and how to do it.

~~~
cpitman
Easily the first visual programming language I used that actually sold me on
the idea. Most of my experiences have been with systems that claim visual
programming, but then require you to jump top code almost immediately. UE4
blueprints are sufficient to create the majority of a game.

------
gardenfelder
WebbleWorld 3 is at once similar, and different:
[https://github.com/truemrwalker/wblwrld3](https://github.com/truemrwalker/wblwrld3)
with several academic papers and a book about the concept. Professor Yuzuru
Tanaka pioneered the concept of Meme Media.

------
lovetocode
Awesome project. Reminds me of my days of using Apache NiFi.
[https://nifi.apache.org/](https://nifi.apache.org/)

------
goblin89
I’d be curious if there was a node interface framework for React (Rete is Vue-
oriented, which is not made obvious until you follows installation docs).

~~~
dkersten
Rete has a react based component thing too[1], is that jus5 for custom
components.

[1] [https://github.com/retejs/react-render-
plugin](https://github.com/retejs/react-render-plugin)

~~~
goblin89
Sweet, I stand corrected!

------
dreamling
Have you tried Adafruit's make code?
[https://makecode.adafruit.com/](https://makecode.adafruit.com/) Visual
programming for javascript with options to interact with their Circuit
Playground hardware.

It's from Microsoft, with flavors for Mincraft and Legostorm too,
[https://www.microsoft.com/en-us/makecode](https://www.microsoft.com/en-
us/makecode) .

It's, of course, not an entire ecosystem for everything, but they do a lot of
visual things that may be worth evaluating. I like the colors/shapes of the
code pieces, and the ability to switch between the visual code editor and the
plain js.

------
ninetax
Really cool! Is there a way to export a data representation of your graph,
like in json or something? Would there be a standard for that, like some
control flow representation?

~~~
jordanbeiber
Use BPM/BPMN? (Business process modelling)

Not answering you question directly, but it’s a way of doing something
similar.

A whole set of enterprise tools do things like this, and I’ve worked a bit
with bpm workflow engines that kind of does this in a standardized way.

> BPMN models are expressed by simple diagrams constructed from a limited set
> of graphical elements. For both business users and developers, they simplify
> understanding of business activities' flow and process. BPMN's four basic
> element categories are:

\- Flow objects: Events, activities, gateways

\- Connecting objects: Sequence flow, message flow, association

\- Swim lanes: Pool, lane

\- Artifacts: Data object, group, annotation

[https://en.wikipedia.org/wiki/Business_Process_Model_and_Not...](https://en.wikipedia.org/wiki/Business_Process_Model_and_Notation)

You can use web tools to draw processes and, execute them on a compliant
engine:

[https://demo.bpmn.io/](https://demo.bpmn.io/)

Camunda comes to mind, as an open source alternative, but if nodejs is your
thing there a a couple of BPM engines in the works, eg:

[https://github.com/paed01/bpmn-engine](https://github.com/paed01/bpmn-engine)

As with anything graphical based - if it doesn't fit the purpose exactly, it
will become a pain in the end.

~~~
holoduke
I remember I had to do one project at my university. I hated it. I still
wonder if there is a successful product out there which I made through bpm. I
doubt it.

~~~
jordanbeiber
Same here, actually... well, not uni, but as a consultant and employee. It’s
“ok” if you own the whole lot, but I have yet to see a hand-over in an
enterprise setting work out well, and bring speed and agility. In many ways,
for an enterprise, json and web api’s is a good enough abstraction to work
with the machines.

Tangential to this - Netflix made Conductor as a kind of in-house workflow
engine, and uber built Cadence, if you want more codified control.

Wheels keep getting re-invented! :)

------
reggieband
I've had building something like this in the back of my mind for a while. Free
idea (the reason I wanted this): use this to build an interface to crypto
smart contracts (e.g. Ethereum). Payment processing seems similar to signal
processing (which these node editors are good at, e.g. Max/MSP, Unity shader
graph).

------
winrid
Anyone invest their time learning something like this and have it pay off?
Interested in success stories I suppose.

(Edit - I mean something more like nodes.io)

~~~
brodo
NodeRed. I’m pretty good at it by now. We use it in our hackspace for home
automation and at work for prototypes.

~~~
pdm55
Link with video: [https://nodered.org/](https://nodered.org/) It's an IBM
side-project built for IoT.

~~~
knolleary
That's how it started, but it's now an independent project of the OpenJS
Foundation. And it isn't limited to IoT - it can be used for any event driven
application.

(Disclaimer: I'm the creator and project lead of Node-Red)

------
Deukhoofd
Very neat, but don't try and sell it to your Dutch consumers with a name like
that.

~~~
BjoernKW
Well, though close that would have to be ‘reet’, wouldn’t it?

~~~
kvz
There’s rete-cool or reten too, but to be honest I’m not bothered by it in the
least :)

