如何编写可维护的 jQuery 应用 已翻译 100%

oschina 投递于 2012/12/19 23:43 (共 23 段, 翻译完成于 01-08)
阅读 1383
收藏 15
2
加载中
这年头,你没有一些 jQuery 使用经验还真不敢称自己为 web 开发者。jQuery 在例如浏览器兼容性、ajax 调用、DOM 操作、常用工具上能带来很多的帮助,能够辅助我们这些 “慵懒” 的web开发者更简单地完成常用操作--但是有一件事它也爱莫能助,那便是书写良好可维护的代码。
彭博
翻译于 2012/12/26 14:26
2

不久前(好吧,也许就是是前一阵)我发了篇名为 为何jQuery和“优雅的javascript”是有害的 帖子。

这里的内容可以当做那篇帖子的延伸。

问题

下图是网页程序前端层的结构示意图.

The desired separation: Presentation (CSS), Behavior (Javascript), Data/Structure (HTML)

来源:Nicholas C. Zakas  Maintainable Javascript 2012  (1)

就像你看到的那样,结构非常简单。然而,你懂的:它没有表面看起来的那么简单。

李昊
翻译于 2012/12/26 15:42
1

说起来容易,就像把数据放到HTML里,把动态逻辑放到javascript里,把所有和UI相关的内容放到CSS里,这样就能得到完美的逻辑分离一样。

只是,在实际环境里,这种分离并不像想象中那么完美。假如你把所有的客户端交互都通过jQuery实现一点也不在意,最后你会发现有些代码变得像意大利面条一样一团糟。还有更糟的,jQuery在实际使用中经常与HTML元素结构极度耦合。这使得代码变得极其难以维护、重构和被理解。

李昊
翻译于 2012/12/26 21:27
1

我可以只是使用一个精选的时尚的MVC/MV*的Javascript框架吗?

好吧,事实上—如果这是个选项...

那么我告诉你假如你从来没有听说过类似KnockoutJSBackboneJSEmber.js,AngularJSSpine, 以及BatmanJS这样的框架,你真的应该把它们check out下来。它们都是很好的选项。我自已只对 KnockoutJS 和 BackboneJS 有大量的经验(大量的经验是指,就像上面所说的ToDo App的等级)。

铂金小鱼
翻译于 2012/12/27 11:38
2

我的建议是你从这些框架中check out至少2个框架从而了解不同风格的理念。我自已最常用的是knockout,话虽如此,如果我在RESTful API之上开发web项目,我更想选择Backbone来代替knockout(因为Backone内置对RESTful约定的支持)。

这些框架最大的问题就是它们完全与SEO友好的网页设计(的理念)格格不入(依我看来)。

铂金小鱼
翻译于 2012/12/27 11:50
2
如果你希望使用上面提到的某一个MV*框架,那么很有可能你不得不使用json格式来传递数据。事实上,你确实应该这么做(使用JSON来保存javascript对象简直是理所当然的不是吗)。
dtubest
翻译于 2012/12/27 14:35
1

谷歌对HTML的看法。平淡和简洁。无JSON.

我们的问题如下。 如果您正试图创建一个搜索引擎友好的Web应用程序,大多数情况下你需要以HTML格式显示数据, 而不是用需要被客户端渲染的JSON格式。

因此,我们回到了我们开始的地方。

独孤影
翻译于 2012/12/22 19:41
1

我们的数据以HTML方式存在。

让我们现在开始假设所有的有趣的MVC javascript框架全部过时了。我们想要开发一个全功能的客户端的web应用程序,其间要保持所有事情都对Google友好以及容量被搜索引擎收录。我们选择了jQuery作为我们这个客户端应用程序的主要工具。

铂金小鱼
翻译于 2012/12/27 14:44
2

如何使用jQuery开发一个可维护的Javascript应用?

这是个好问题。我准备去证明一种这样的“模式”,这种“模式”已经证实对于我很有效。我将会开发一个假的应用来说明,这个应用有最基本的通信系统行为。比起那种TODO应用,我认为这是一个更加丰富的示例,因为这通常意味着更复杂的用户交互,以及更多的服务端通信,这些通信端通信是需要发生的。

enter image description here

(请忍受一下我的Visio图表-它们做得不好但我想可以有点帮助)

铂金小鱼
翻译于 2012/12/27 14:59
1

(我的)想法是, 在禁用 javascript 的世界里, 应用程序基本上依然能工作。 注意:如果您禁用了javascript,我同情你 - 这样做主要是为了让Google很好的“工作” - 不是为了(方便)那些关闭 js(功能)的用户。 虽然它(js)有助于他们取得双赢(的局面)。

稍后我们将讨论更多关于HTML看起来应该长成什么样,但是首先让我们看看应用程序的基本结构:

0595
翻译于 2013/01/07 23:44
1
本文中的所有译文仅用于学习和交流目的,转载请务必注明文章译者、出处、和本文链接。
我们的翻译工作遵照 CC 协议,如果我们的工作有侵犯到您的权益,请及时联系我们。
加载中

评论(1)

dtubest
dtubest
这个翻译功能开了好久了么,今天才看到,果断翻了一段
返回顶部
顶部