【Hacker News搬运】3D+2D:测试我的跨平台WASM图形引擎
-
Title: 3D + 2D: Testing out my cross-platform WASM graphics engine
3D+2D:测试我的跨平台WASM图形引擎
Text: I used to work at Adobe on the infrastructure powering big applications like Photoshop and Acrobat. One of our worst headaches was making these really powerful codebases work on desktop, web, mobile, and the cloud without having to completely rewrite them. For example, to get Lightroom and Photoshop working on the web we took a winding path through JavaScript, Google’s PNaCl, asm.js, and finally WebAssembly, all while having to rethink our GPU architecture around these devices. We even had to get single-threaded builds working and rebuild the UI around Web Components. Today the web builds work great, but it was a decade-long journey to get there!<p>The graphics stack continues to be one of the biggest bottlenecks in portability. One day I realized that WebAssembly (Wasm) actually held the solution to the madness. It’s runnable anywhere, embeddable into anything, and performant enough for real-time graphics. So I quit my job and dove into the adventure of creating a portable, embeddable WASM-based graphics framework from the ground up: high-level enough for app developers to easily make whatever graphics they want, and low-level enough to take full advantage of the GPU and everything else needed for a high-performance application.<p>I call it Renderlet to emphasize the embeddable aspect — you can make self-contained graphics modules that do just what you want, connect them together, and make them run <i>on</i> anything or <i>in</i> anything with trivial interop.<p>If you think of how Unity made it easy for devs to build cross-platform games, the idea is to do the same thing for all visual applications.<p>Somewhere along the way I got into YC as a solo founder (!) but mostly I’ve been heads-down building this thing for the last 6 months. It’s not <i>quite</i> ready for an open alpha release, but it’s close—close enough that I’m ready to write about it, show it off, and start getting feedback. This is the thing I dreamed of as an application developer, and I want to know what you think!<p>When Rive open-sourced their 2D vector engine and made a splash on HN a couple weeks ago (<a href="https://news.ycombinator.com/item?id=39766893">https://news.ycombinator.com/item?id=39766893</a>), I was intrigued. Rive’s renderer is built as a higher-level 2D API similar to SVG, whereas the Wander renderer (the open-source runtime part of Renderlet) exposes a lower-level 3D API over the GPU. Could Renderlet use its GPU backend to run the Rive Renderer library, enabling any 3D app to have a 2D vector backend? Yes it can - I implemented it!<p>You can see it working here: <a href="https://vimeo.com/929416955" rel="nofollow">https://vimeo.com/929416955</a> and there’s a deep technical dive here: <a href="https://github.com/renderlet/wander/wiki/Using-renderlet-with-rive‐renderer">https://github.com/renderlet/wander/wiki/Using-renderlet-wit...</a>. The code for my runtime Wasm Renderer (a.k.a. Wander) is here: <a href="https://github.com/renderlet/wander">https://github.com/renderlet/wander</a>.<p>I’ll come back and do a proper Show HN or Launch HN when the compiler is ready for anyone to use and I have the integration working on all platforms, but I hope this is interesting enough to take a look at now. I want to hear what you think of this!
我曾经在Adobe工作，负责为Photoshop和Acrobat等大型应用程序提供基础设施。我们最头疼的问题之一是让这些非常强大的代码库在桌面、网络、移动和云上工作，而不必完全重写它们。例如，为了让Lightroom和Photoshop在网络上工作，我们走了一条曲折的道路，通过JavaScript、谷歌的PNaCl、asm.js，最后是WebAssembly，同时必须围绕这些设备重新思考我们的GPU架构。我们甚至不得不让单线程构建工作起来，并围绕Web组件重新构建UI。今天，网络建设工作得很好，但要实现这一目标需要十年的时间<p> 图形堆栈仍然是可移植性的最大瓶颈之一。有一天，我意识到WebAssembly（Wasm）实际上掌握了疯狂的解决方案。它可以在任何地方运行，可以嵌入任何东西，并且具有足够的实时图形性能。因此，我辞去了工作，开始了从头开始创建一个可移植、可嵌入的基于WASM的图形框架的冒险之旅：足够高的级别让应用程序开发人员可以轻松制作他们想要的任何图形，足够低的级别可以充分利用GPU和高性能应用程序所需的一切<p> 我称之为Renderlet是为了强调可嵌入性——您可以制作独立的图形模块，这些模块可以做您想做的事情，将它们连接在一起，并使它们在</I>任何东西上运行<I>，或在</I>-任何东西中运行<I>-具有琐碎的互操作<p> 如果你想想Unity是如何让开发者轻松构建跨平台游戏的，那么它的想法就是对所有视觉应用程序都做同样的事情<p> 在这一过程中的某个地方，我以个人创始人的身份进入YC（！），但在过去的6个月里，我一直在努力打造这件事。它还没有为开放的alpha版本做好充分的准备，但它已经足够接近了，我已经准备好写它，展示它，并开始获得反馈。这是我作为一名应用程序开发人员的梦想，我想知道你的想法<p> 几周前，当Rive开源了他们的2D矢量引擎并在HN上引起轰动时（<a href=“https://；/；news.ycombinator.com/？item？id=39766893”>https://；#xx2F；新闻.ycombiinator.comȏ；item？id=39766893</a>），我很感兴趣。Rive的渲染器是作为类似于SVG的高级2D API构建的，而Wander渲染器（Renderlet的开源运行时部分）在GPU上公开了较低级别的3D API。Renderlet能否使用其GPU后端运行Rive Renderer库，使任何3D应用程序都能拥有2D矢量后端？是的，它可以——我实现了<p> 您可以在这里看到它的工作原理：<a href=“https://；/；vimeo.com/！929416955”rel=“nofollow”>https:///；vimeo.com；929416955</a>，这里有一个深入的技术挖掘：<a href=“https://；/；github.com/！renderlets/：漫游/…wiki/，使用renderlet与rive%E2%80%90renderer”>https:///；github.com/；renderlet；漫游；wiki/；使用renderlet智慧</一我的运行时Wasm Renderer（又名Wander）的代码如下：<a href=“https://；/；github.com/！renderlet/”>https:///；github.com/；renderlet；漫游</a><p> 当编译器准备好供任何人使用时，我会回来做一个适当的Show HN或Launch HN，并且我已经在所有平台上进行了集成，但我希望这足够有趣，现在可以看一看。我想听听你对此的看法！Url:
Post by: seanisom
Comments:
netbioserror: Saved. This is the sort of project that would be an amazing canvas for a nice widget kit and interaction model to make cross-platform GUIs with. The C/C++ backend and WASM target means people could build FFIs in almost any language. I'm sure I'm saying nothing new, but this is promising.
netbioserror: 保存的。这类项目将是一个令人惊叹的画布，用于制作跨平台GUI的漂亮的小部件套件和交互模型。C；C++后端和WASM目标意味着人们可以用几乎任何语言构建FFI。I-；我确信我；I’我没说什么新鲜事，但这很有希望。
zengid: This is super neat and I am very interested!<p>I'm in a rush so I can't look to closely now but I have a few questions (and please forgive any stupid questions, I'm not a graphics dev, just a hobbyist):<p>What's the runtime like?
Is there an event loop driving the rendering? (who calls therenderon each frame? are there hooks into that? )
FFI story?
Who owns the window pointer?<p>I'm interested in audio plugins, and VSTs (etc) have a lot of constrains on what can be done around event loops and window management. JUCE is pretty much the de-facto solution there, but it's pretty old and feels crufty.zengid: 这是超级整洁，我很感兴趣<p> I-；我赶时间，所以我可以；我现在没有仔细看，但我有几个问题（请原谅任何愚蠢的问题，我不是图形开发人员，只是一个爱好者）：<p>What；运行时是什么样子的？是否存在驱动渲染的事件循环？（谁在每帧上调用“render”？有挂钩吗？）外国金融机构的故事？谁拥有窗口指针<p> I-；我对音频插件很感兴趣，而VST（等等）对事件循环和窗口管理有很多限制。JUCE几乎是事实上的解决方案，但它；他很老了，感觉很虚弱。
nasso_dev: oh my god this is awesome! that's exactly what ive been dreaming about for the past few years... wasm has a lot of potential as a portable unit of graphics/audio/multimedia computation! im glad you were able to take the time to build it!
nasso_dev: 天哪，这太棒了！即；这正是我过去几年的梦想。。。wasm作为图形的便携式单元有很大的潜力；音频；多媒体计算！我很高兴你能花时间建造它！
ronyeh: Awesome project. What are you planning for text and font support? Some graphics engines don’t support all the ways you might want to display text. Will we be able to load OTF or WOFF2 files and display arbitrary strings?
ronyeh: 很棒的项目。您计划如何支持文本和字体？有些图形引擎并不支持您可能想要的所有显示文本的方式。我们是否能够加载OTF或WOFF2文件并显示任意字符串？：-）
iFire: We've been doing work in Godot Engine trying to get wasm working.<p>How did you overcome the shared array buffer accessibility problem on safari vs access to ad networks which is important for online games?<p>I called it single threads vs regular builds.<p>Hope to help make sure there's a diverse set of rendering kernels for everyone.<p>Edited: Link to our work at making portable 3d graphics on the web with an editor. <a href="https://editor.godotengine.org/releases/latest/" rel="nofollow">https://editor.godotengine.org/releases/latest/</a>
iFire: 我们；我一直在Godot Engine工作，试图让wasm工作起来<p> 你是如何克服safari上的共享阵列缓冲区可访问性问题与访问广告网络（这对在线游戏很重要）的问题的<p> 我称之为单线程与常规构建<p> 希望能帮助确保有；为每个人提供了一组不同的渲染内核<p> 编辑：链接到我们使用编辑器在网络上制作便携式三维图形的工作<a href=“https://；/；editor.godotengine.org//，rel=”nofollow“>https://发布最新/”/；editer.godotengine.org/；释放；最新的</一