Syphon 🤝 Electron
For quite some time, I've been keeping an eye out for a Node.js integration with Syphon, "an open source Mac OS X technology that allows applications to share frames".
I've wanted to integrate Syphon into my open source VJ project, modV, to allow it to contend with the "grown-ups", VDMX, Resolume, TouchDesigner, etc.
I was aware of CefWithSyphon, but this wasn't usable for Electron, or even in modV's early days of it actually being in the browser.
One afternoon, I got quite a weird comment on modV's Discussions forum:
It's more than a shame that you don't want to take on the work of implementing Spout. NDI is all well and good, but Syphon and especially Spout have become a common standard, particularly in real-time video applications, and so this represents a very large gap in your "modV" program! You should rethink this. Urgently!!
I won't go into too much detail here, but I responded that I wanted to include this but essentially didn't know how.
It honestly made me a little mad, not only at the commenter but at myself. I've been skirting writing native Node.js modules for years, especially with the Node.js NDI module, Grandiose.
So I took the plunge, opened up ChatGPT, and started riffing.
Lo and behold, a few hours later, I'd done it 😤
@_2xaa Just wrote a working Electron ➡️ Syphon integration 🙌🏻 This is huge news for @_modv_ and other Electron/web apps to play with the big commercial apps 🎉 Feel free to share, I’ve been trying to implement this on and off for about 8 years and I finally made a breakthrough 😂 #webgl #canvas #syphon #electron #javascript #visuals #vj #hacker #coder #creativecomputing #spout ♬ original sound - Sam
I couldn't believe it!
It doesn't implement texture sharing, but it seemed to perform well enough.
So, where do we go now?
I created an npm module locally and tested it in modV - that worked too!
@_2xaa Well, I don’t wanna say “that was easy”, buuuuut Syphon support in modV (Electron) 😳 modV is sending frames to VDMX6 here 🤩 This isn’t actually texture sharing but the overhead of sending pixels via the CPU is rather minimal these days that I don’t really mind. Example code at github.com/vcync/electron-syphon 🧑🏻💻 Next stop: Spout 🪟 #vj #syphon #electron #vue #modv #visuals #vdmx #webgl #javascript #canvas #hacker #creativetechnology ♬ original sound - Sam
So, until I publish the module - here's a working project.
Couldn't be more thrilled 😁
https://github.com/vcync/electron-syphon
I want to implement Spout next, then vk-texture-share (c/o s.ol).