我的项目和这些 Javascript 框架哪里错了？

Posted 2023-02-22

【中文标题】我的项目和这些 Javascript 框架哪里错了？

【英文标题】：Where am I wrong about my project and these Javascript Frameworks?

【发布时间】：2011-07-08 09:02:52

【问题描述】：

首先，我希望创建的项目最简单的部分是作为单页 Web 应用程序实现的 wiki 引擎。我计划从一开始就提供一组功能，并在以后添加大量功能。

基本功能

页面创建（为该文章创建 wiki 文章和论坛） 标记和所见即所得阿拉markitup 标记/html/所见即所得之间的即时转换 用于快速导航的侧边栏 用于选择编辑/查看的顶部工具栏

高级功能

可配置侧栏以通过不同方法导航 可配置工具栏（可能添加选择的标记语言） 标签 可编辑的待办事项 拖放文件上传和图片附件

引擎最初将包括最基本的页面创建、标记和所见即所得的编辑和保存。我最终希望通过拖放图像支持、文件上传、实时数据图表和用于自定义视图的侧边栏来扩展这个基本引擎。

我已经对一个体面的项目进行了相当广泛的搜索，作为我的项目的基础，但除了 TiddlyWiki 之外，似乎没有任何好的基于 javascript 的 wiki 引擎。我还考虑在现有的 wiki 引擎之上应用 Jquery，但我相信我最终还是会重写它（另外，添加我想要的功能更令人兴奋）。无论哪种方式，我都已经使用 javascript 库 + 框架来实现这个野兽。

我知道人们无法真正将其中一些框架相互比较，因为它们在很大程度上不是苹果对苹果的。我已尝试将任何比较 cmets/问题与相应框架的可比较部分进行比较，但我愿意接受更正。

所以我们开始：

根据我自己的研究和意见，我将列表缩小到以下项目。我故意省略了 SproutCore、corMVC、YUI 等内容，因为我的能力有限，认为以下项目更适合。

我的选项

jquery + jqueryUI + backbonejs knockoutjs javascriptMVC Dojo ExtJS Cappuccino

---

jquery/UI + 主干js

总体

据我所知，这种组合被许多人使用和喜爱，并且非常灵活和可扩展。我主要担心的是，这种组合根本不是开发更多面向桌面的 UI 界面的最佳起点。

用户界面

虽然 jQueryUI 或 jqueryTools 可能具有竞争力，但它们显然无法与其他框架的 UI 功能相提并论。具体来说，它们似乎对效果很重，但缺乏体面的布局切片支持。

javascriptMVC

总体

在我看来，JavascriptMVC 本质上是 jquery + MVC(jqueryMX) 扩展，以及其他一些用于记录 (documentJS)、功能测试 (funcUnit) 以及代码和依赖项管理 (stealJS) 的应用程序。除了附加模块的好处之外，我认为功能辩论真的归结为backbonejs 与 jqueryMX 我对此是否正确，有没有人使用或比较两者？

特点：jupiter（jMVC 的制造商）对其features 的概述 链接到jqueryMX

用户界面

JavascriptMVC 将MXUI 项目添加到可用于 Jquery 的所有项目之上，因此我认为至少在该类别中这是一个小小的胜利。

knockoutjs

总体

我对此的想法和担忧与 jquery + 主干 cmets 非常相似。它们似乎都提供了相似的功能，但只是从不同的角度来看。一个经常提到的缺点是，knockoutjs 将业务逻辑和表示与数据绑定的结合过于紧密，并且这种绑定方法可能会因复杂的 UI 交互而崩溃，但我很想听听为什么这不是问题。

Discussion 主干与淘汰JS 概念 Features的knockoutjs

用户界面

暂时空白

Dojo 和 ExtJS

总体

我将把 Dojo 和 ExtJS 的讨论结合起来，因为我对它们了解最少，而且它们似乎在几乎相同的空间中发挥作用。关于这两者的大多数关于***的信息似乎已经过时了。据我所见，它们都是适合桌面口径应用程序实施的大型框架。 Dojo 曾因文档质量差而受到指责，但现在情况似乎不再如此。 ExtJS 当然有商业许可证，但是你得到的东西真的很合理，我不会反对它太多。 ExtJS 中的小部件似乎比 Dojo 做得更专业，但我当然可以在那里得到纠正。我很想听听任何在这两个方面都有经验的人。

用户界面

Dojo 有 dijit UI 库 ExtJS 具有 UI 功能，但它们不在 Ext 核心中。这是documentation，这是他们的demos

卡布奇诺

总体

然后是卡布奇诺。没有 CSS，没有 html，而且使用现有的 javascript 库也很困难。 Objective-J 似乎并不可怕，特别是考虑到他们吹捧也能够编写纯 JavaScript。演示令人印象深刻，似乎非常接近 wiki 引擎的 UI 需求。对于不熟悉它的人来说，基于可可的 API 有很多值得学习的地方，但也许值得。我听说布局引擎并不总是很容易使用，但像这样年轻且可能具有颠覆性的技术肯定会有一些缺点。

用户界面

暂时空白

我很抱歉写了这么多，但嘿，至少它不是一个 x vs y vs z 的问题，希望得到大量廉价的答案。所以你怎么看？我的桌面（如 wiki 引擎）的基础应该是什么，它有望随着时间的推移变得更加丰富（阅读复杂）？

【问题讨论】：

+1 提出了一个非常详细且经过深思熟虑的问题！

不确定你的时间线和资源，但是当我试图在多个框架/环境之间做出决定时，我只是继续尝试快速构建一个原型。即使它只是一两个主要功能，我发现世界上所有的研究和文档都无法与实际尝试使用这些工具构建一些东西相匹配。我说每个人都花一天时间，看看你能走多远。这将让您很好地了解哪些工具可以胜任这项任务并让您感觉最舒适。

@Brian Flanagan 转到答案——即使是“元”。

你看过tiddlywiki.com吗，我认为这是一个用JavaScript完成的纯自包含wiki

是的，我看过 tiddlywiki。在许多方面，它是这个项目的灵感来源，但我有自己的基础和为这个项目设想的方向。

【参考方案1】：

不确定您的时间表和资源，但当我尝试在多个框架/环境之间做出决定时，我只是继续尝试快速构建原型。即使它只是一两个主要功能，我发现世界上所有的研究和文档都无法与实际尝试使用这些工具构建一些东西相匹配。我说每个人都花一天时间，看看你能走多远。这将让您很好地了解哪些工具能够胜任任务并让您感觉最舒适。

【参考方案2】：

meteor 现在风靡一时（most starred full-stack JavaScript framework on GitHub 和 Meteorpedia 是用 Meteor 编写的 wiki 引擎。

launch video 会在 1 点 28 分让你着迷。

它与 UI 无关，并且已经使用 Bootstrap 和 Famo.us 进行了广泛的测试。它还从相同的代码库生成移动应用程序。

【讨论】：

还有与 React 的集成，但这仅适用于 100% 参与其中的人。在没有大量 Meteor 知识的情况下，使用 jquery 插件和 svg/canvas 绘图库也没有问题。

【参考方案3】：

我建议首先为您的项目提出特定的 UI 要求。您尝试过哪些框架？

就我个人而言，我从事 ExtJS 开发是因为我从事的项目需要大量自定义控件/小部件。 ExtJS 拥有大量开箱即用的功能，并且始终可以扩展、组合或整合到您的业务所需的任何怪物中。

ExtJS 4 还允许您“换肤”您的 UI 以进一步自定义外观。

如果您是 JavaScript 新手，并且熟悉 Java，您甚至可以考虑使用服务器端解决方案，例如 GWT、JSF 甚至 Vaadin

【参考方案4】：

您选择的框架可能不会像您想象的那样限制您的 UI 选择。 This recent Henri Bergius article about decoupling content management 比我能更好地说明这一点——顺便说一下，链接到一个看起来很漂亮的纯 JavaScript（独立于框架）in-place content editor。

【讨论】：

我当然在为所见即所得挖掘 aloha 编辑器。我肯定会将它停靠在屏幕顶部并添加选项卡以查看某些格式的标记中的文本区域。我的另一个主要选择是markItUp。

【参考方案5】：

你并不孤单！

VanillaJS 和 Ampersand .. 是推动更简单、更模块化的 JavaScript 的重要例子。

甚至还有一个关于它的Book。

简单性是由被低估的 es6 功能驱动的：Modules 和 SystemJS 实现标准。它甚至可以在非 es6 系统上使用。

这太酷了！

【参考方案6】：

我会说你对候选者的整体选择是错误的，因为你忽略了 Angular 和 Ember 两者都比列出的任何其他框架都更适合。

总的来说，我会说 Angular.js 是这个框架。

强调路由

您所谈论的大部分内容（用于导航的几个侧边栏，单页应用程序）是路由功能，或者前端如何解释 URL 导航栏中的文本。

Angular.js 和 Ember 都有出色的路由器，无需额外代码即可完成所需的一切。

为了您的利益，这里简要介绍了 Angular 中可用于创建单页 wiki 的功能

网站本身的结构

Angular 有一个令人惊叹的库，称为 UI 路由器，可让您创建自定义导航并设置显示内容的 SEO 友好结构。多个视图也允许使用顶部工具栏。

ui路由器教程： http://cacodaemon.de/index.php?id=57

所见即所得编辑器

Angular 建立在实时双向绑定的基础上（当您在某处更改某些内容时，它会在其他任何地方自动更改。）因此，它包含了许多与这种编辑器配合得很好的特性。已经做了一些好的，你只需要实现它们。

http://textangular.com/

图表和其他简洁的东西

Angular 指令旨在执行诸如创建可重用的图表组件之类的操作。它们与 Wordpress 小部件并没有完全不同。其中许多已经开发完毕，可以放入您的 Angular 项目中。

http://www.sitepoint.com/creating-charting-directives-using-angularjs-d3-js/

关于 Ember，我对它了解不多，所以我无法谈论它的特殊功能。

【参考方案7】：

关于 Backbone 的一个建议，如果你决定使用它，你应该选择 Marionnete，因为它是 Backbone，但具有更好的架构结构和更自以为是（我个人认为 Backbone 没有设置任何指导方针，这感觉像是一个缺点大型应用程序）。

我使用它几个月来结合不同的 js 库，并没有像其他框架那样妨碍您，消息管道是一个非常好的方法，可以在整个应用程序中连接组件，但保持它们解耦。

你的演讲很棒，让我做出了决定：https://www.youtube.com/watch?v=qWr7x9wk6_c

这里你有一个演示原型，它还连接了拖放元素和其他 js 库。很想听听您对我的代码的看法，因为我从事 Web 开发工作已有 1.5 年......我还是个新手：https://github.com/Drasky-Vanderhoff/marionette-demo/

关于 Knockout，如果您想与已有的内容进行交互并且您不会不断地与后端连接，那么它真的很棒。我用它工作了 6 个月，最终我需要使用很多其他的 js 库来进行路由；另外，我最终重复了 Backbone 和其他 JS 框架最终拥有的许多结构。我要说的是，它根本不会妨碍你，而是一种工具，而不是一种约束。这也是差不多一年前的事了，所以有些事情发生了变化。

有一件事，如果你发现 Knockback (Knockout + Backbone)...避免它，文档并没有达到应有的水平，而且你会花更多的时间来学习它。如果你想去做，首先制作一个快速原型，看看是否是你想要的。

【讨论】：

你发布这个已经一年了。由于我现在正在寻求开始新的开发，Marionette 是否仍然是您进行 Javascript 开发的首选？

一点也不，现在最好使用 Angular.js 或 React.js（如果你愿意，你可以将两者结合起来）。如果你想要一个应用程序的移动版和网页版，我强烈建议你使用 React.js，因为 React Native 被用于制作 ios 和 android 原生应用程序。 React.js 和 native 共享相同的概念、结构和范式（学习一次，到处使用，了解 React.js == React Native，是的，我没有使用三等式：P）

还有使用 Polymer 的 Web 组件，我强烈建议您检查一下，如果想使用它可能是明年最热门的框架。最后，如果您需要 100% 实时数据同步/三路数据绑定，Meteor 是一个很好的选择，特别是因为如果您为参数编写验证器，它将在后端和前端运行相同的验证器，避免需要 2 个代码相同的碱基。

澄清一下，我从来没有说过 Marionette 是我的首选（当时它实际上是 Angular）我说的是如果你要使用 Backbone.js 他们使用 Marionette.js .