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

科技回声

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

GitHubTwitter

首页

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

资源链接

HackerNews API原版 HackerNewsNext.js

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

How I built a fast JavaScript framework

45 点作者 krapans大约 7 年前

8 条评论

evmar大约 7 年前
I am often frustrated in this ecosystem by how people build things without any clear conceptual model, and then they document them by saying &quot;it is so fast, it just works like magic&quot;. It is impossible to compare two approaches because there are no facts available to compare them on.<p>Like for this one from a peek at the source code it appears to try to parse JavaScript at runtime using regexes (<a href="https:&#x2F;&#x2F;github.com&#x2F;radi-js&#x2F;radi&#x2F;blob&#x2F;master&#x2F;src&#x2F;index.js#L4" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;radi-js&#x2F;radi&#x2F;blob&#x2F;master&#x2F;src&#x2F;index.js#L4</a>) which is great for demoware and not at all something I&#x27;d want to use in production, but that is not mentioned anywhere in the site or blog post.<p>I don&#x27;t mean to just dump on this project in particular, which could just be a fun toy side project for the author, because this problem is endemic. (But then why go to all the effort to make all the marketing materials for it without actually writing any docs?)
评论 #16538177 未加载
Whitespace大约 7 年前
They compared Radi to React Stack, not React Fiber. That&#x27;s being sneaky.<p>If you run the React Fiber demo, you&#x27;ll see it&#x27;s just as fast: <a href="https:&#x2F;&#x2F;claudiopro.github.io&#x2F;react-fiber-vs-stack-demo&#x2F;fiber.html" rel="nofollow">https:&#x2F;&#x2F;claudiopro.github.io&#x2F;react-fiber-vs-stack-demo&#x2F;fiber...</a>
评论 #16538686 未加载
dgllghr大约 7 年前
I&#x27;m not primarily a Javascript developer, but I seem to remember that attaching event listeners to Object fields and modifying the DOM in event handlers is how Javascript development was done 5-10 years ago. Am I missing something? Are we going full circle?
评论 #16537137 未加载
评论 #16537229 未加载
评论 #16537146 未加载
评论 #16537271 未加载
评论 #16537409 未加载
评论 #16537216 未加载
fwilliams大约 7 年前
I&#x27;m not a frontend developer and don&#x27;t know really know JavaScript frameworks. That said, it seems like something very well established like React would choose to have a virtual DOM for a good reason.<p>Surely there must be some tradeoffs that the author makes for his design to get better performance. Could somebody explain the cost&#x2F;benefit of doing things one way versus the other?
评论 #16537765 未加载
naasking大约 7 年前
Surplus [1] is the fastest framework in the big JS benchmark challenge, and it too uses the native DOM directly rather than a virtual DOM. Looking forward to seeing Radi.js added to that benchmark suite to really put it to the test.<p>[1] <a href="https:&#x2F;&#x2F;github.com&#x2F;adamhaile&#x2F;surplus" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;adamhaile&#x2F;surplus</a>
评论 #16537581 未加载
评论 #16537600 未加载
joebo大约 7 年前
This looks similar in many ways to mithril[1] -- somewhat similar api - mount, view, r(&quot;input&quot;) vs m(&quot;input&quot;). The counter example[2] looks similar[3] I&#x27;d be interested in seeing comparisons between the two.<p>[1] <a href="https:&#x2F;&#x2F;mithril.js.org&#x2F;" rel="nofollow">https:&#x2F;&#x2F;mithril.js.org&#x2F;</a><p>[2] <a href="https:&#x2F;&#x2F;github.com&#x2F;MithrilJS&#x2F;mithril.js&#x2F;blob&#x2F;5956314e3655a3c85f8425bffc2bd76c1c541a3b&#x2F;docs&#x2F;mount.md" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;MithrilJS&#x2F;mithril.js&#x2F;blob&#x2F;5956314e3655a3c...</a><p>[3] <a href="https:&#x2F;&#x2F;github.com&#x2F;radi-js&#x2F;radi&#x2F;blob&#x2F;master&#x2F;examples&#x2F;counter.html" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;radi-js&#x2F;radi&#x2F;blob&#x2F;master&#x2F;examples&#x2F;counter...</a>
评论 #16539515 未加载
评论 #16537742 未加载
iamleppert大约 7 年前
I recently did a project with morphdom (<a href="https:&#x2F;&#x2F;github.com&#x2F;patrick-steele-idem&#x2F;morphdom" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;patrick-steele-idem&#x2F;morphdom</a>) using only ES6 template strings and a render loop that checked for changes to a global state object and patched a re-computed DOM string using morphdom. Couldn’t have been an easier and more pleasurable experience.
jbob2000大约 7 年前
The reason diffing and virtual doms are used are to prevent unnecessarily repainting the browser window 1000 times a second. If I have 5 updates to make, I want to do those in one paint, instead of 5. So the process is change -&gt; change -&gt; change -&gt; paint.<p>With this framework&#x27;s model, the process would be change -&gt; paint -&gt; change -&gt; paint etc. etc. Sure, you get nice FPS (because it&#x27;s painting a LOT), but that will destroy battery performance on mobile phones and I don&#x27;t need 60 FPS in my shopping web app.