TE
科技回声
首页24小时热榜最新最佳问答展示工作
GitHubTwitter
首页

科技回声

基于 Next.js 构建的科技新闻平台,提供全球科技新闻和讨论内容。

GitHubTwitter

首页

首页最新最佳问答展示工作

资源链接

HackerNews API原版 HackerNewsNext.js

© 2025 科技回声. 版权所有。

Show HN: Caldera – Phoenix LiveView for Node and React

101 点作者 yunyu将近 5 年前

10 条评论

yunyu将近 5 年前
Hey HN, this is a side project that we made after realizing that a solid chunk of the time and code spent doing full-stack development was spent writing and debugging RPC layers - REST, GraphQL, GRPC, you name it.<p>The fact that the frontend and the backend are separate services leads to a bunch of cruft (<a href="https:&#x2F;&#x2F;thume.ca&#x2F;2020&#x2F;05&#x2F;17&#x2F;pipes-kill-productivity&#x2F;" rel="nofollow">https:&#x2F;&#x2F;thume.ca&#x2F;2020&#x2F;05&#x2F;17&#x2F;pipes-kill-productivity&#x2F;</a> is a perfect description) and security holes, so we had the idea of merging them. It turns out that Phoenix LiveView already did server-side execution with changes streamed over WebSockets, but we weren&#x27;t the biggest fans of having to learn an entirely new ecosystem and paradigm. So, we built a framework that allows (at the moment, admittedly simple) vanilla React apps to run on Node.js, with DOM updates being streamed to the client. That way, we can delete the RPC layer and greatly reduce development complexity and total code.<p>Would love to hear your thoughts!
karthikksv将近 5 年前
I had this same inspiration from Chris McCord&#x27;s talk about LiveView ~1.5 years back, and created Purview: <a href="https:&#x2F;&#x2F;github.com&#x2F;karthikv&#x2F;purview" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;karthikv&#x2F;purview</a> - we&#x27;ve been using it in production at the company I work at for over a year now.<p>It&#x27;s great to see a similar mindset here, and I hope an approach like this becomes more widely used. I appreciate how Caldera is built using React&#x27;s reconciler and is centered around hooks, both of which are different than the approach Purview takes.<p>Two of the challenges we&#x27;ve experienced here:<p>- Transferring server-side state between processes: in production, you&#x27;ll likely have multiple Node processes handling requests via the cluster module or other load balancing. If a client were to disconnect their websocket temporarily (e.g. put their laptop to sleep), they can be reconnected to a different process, which doesn&#x27;t have the state of their components. As a result, you&#x27;ll need some way to transfer&#x2F;persist component state between processes. This same issue will also arise during deploys--you&#x27;ll spawn new processes with your new code, but you don&#x27;t want to disrupt existing clients, so those new processes need to load existing component state from old processes. Even more subtly, this issue can occur on page load, since two requests need to be made: one to fetch the initial page and one to initiate the websocket connection. Those two requests can be sent to two different processes&#x2F;boxes.<p>- Working with existing client-side libraries, like selectize or date range pickers. We&#x27;ve opted to use the Web Component spec to create custom tags that can be sent down just like normal tags from the server, but making sure these interoperate nicely with server-side state is challenging.<p>Very excited to see how Caldera tackles these problems!
评论 #23369151 未加载
评论 #23387605 未加载
sansnomme将近 5 年前
Can you add a flappy bird demo? I find that flappy bird demos for state-over-wire tech like LiveView and Blazor to be a great gauge for performance and latency. If there is the slightest delay or inconsistency in performance you will be able to tell immediately.<p>I have a longer list of such technologies here: <a href="https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=19716696" rel="nofollow">https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=19716696</a>
评论 #23368210 未加载
评论 #23368510 未加载
dnautics将近 5 年前
one of the things I worry about other platforms attempting to do phoenix LiveView is that the BEAM vm gives you process isolation. If there&#x27;s a miscode, then the process crashes and you&#x27;re all good. How does JS handle such a situation, and does it result in a malicious attack vector?
评论 #23367170 未加载
gitgud将近 5 年前
Awesome, I was literally searching nodejs alternative to elixr live-view a few months ago, but couldn&#x27;t find anything. Great work!
rgs224将近 5 年前
One of the contributors here: here&#x27;s a live demo: <a href="https:&#x2F;&#x2F;la-inst.caldera.app&#x2F;" rel="nofollow">https:&#x2F;&#x2F;la-inst.caldera.app&#x2F;</a><p>Check out the console for DOM updates streamed from the server. React is running on Node.
insulanian将近 5 年前
For a moment I thought it&#x27;s something about Caldera Linux [1] :)<p>[1] <a href="https:&#x2F;&#x2F;en.wikipedia.org&#x2F;wiki&#x2F;Caldera_OpenLinux" rel="nofollow">https:&#x2F;&#x2F;en.wikipedia.org&#x2F;wiki&#x2F;Caldera_OpenLinux</a>
namelosw将近 5 年前
Nice to see someone finally tackle this in JavaScript!<p>Although Phoenix is great, it&#x27;s good to have similar things on Node in pursuit of velocity.
评论 #23367408 未加载
knishkz将近 5 年前
Woah! This is super cool.
orastor将近 5 年前
Very interesting. Why wouldn&#x27;t I use this for normal web apps if I want to keep my react code server side instead?
评论 #23367557 未加载