一般情况:JS仅限基于页面的Web应用程序

时间:2010-12-28 21:55:20

标签: javascript jquery model-view-controller prototype javascriptmvc

开发网络应用程序与网站时,有什么理由可以使用多个HTML页面,而不是使用一个html页面并通过Javascript完成所有工作?

我希望它取决于应用程序 - 也许 - 但会对这个主题的任何想法表示赞赏。

提前致谢。

编辑:

根据这里的回复以及我自己的一些研究,如果你想做一个完整的JS-Powered网站的单页,一些有用的工具似乎包括:

JQuery Plug Ins:

JQuery历史: http://balupton.com/projects/jquery-history

JQuery地址: http://plugins.jquery.com/project/jquery-address

JQuery分页: http://plugins.jquery.com/project/pagination

框架:

SproutCore的 http://www.sproutcore.com/

卡布奇诺 http://cappuccino.org/

可能是JMVC: http://www.javascriptmvc.com/

10 个答案:

答案 0 :(得分:5)

基于页面的应用程序提供:

  • 能够在任何浏览器或设备上工作
  • 更简单的编程模型

它们还提供以下内容(尽管这些可由许多js框架解决):

  • bookmarkability
  • 浏览器历史记录
  • 刷新或F5重复操作
  • 可索引性(如果应用程序是公开的和打开的)

答案 1 :(得分:2)

其中一个更大的原因是您的网站是如何搜索的。

在javascript中执行所有操作会使搜索引擎抓取您网站的所有内容变得复杂,从而无法对其进行完全索引。有很多方法(使用Google最近的AJAX SEO指南),但我不确定是否所有搜索引擎都支持这一点。最重要的是,它只是制作单独的页面更复杂。

更大的问题是,无论您决定构建多个HTML网页,还是决定使用某种框架或CMS为您生成这些网页,您的网站的不同部分都有其独有的网址。例如,about部分的网址类似mywebsite.com/about,该网址用于网站内的实际“关于”链接。

答案 2 :(得分:1)

单页,Ajax-ified网站最大的缺点之一就是复杂性。否则可能会分散在几个页面中的内容突然进入一个巨大的母版页面。此外,可能很难协调页面的状态(例如,如果您处于编辑模式或预览模式等,则跟踪)并调整界面以匹配。

此外,如果必须加载多个大型JS文件,那么JS上的一个主页可能会导致性能下降。

答案 3 :(得分:1)

根据OP的要求,我将讨论我在仅限JS的网站上的体验。我写了四个相关的网站:两个JS-heavy(SlideSpeedDate)和两个JS-only(YazooliGameCrush)。请记住,我是一个只有JS的站点偏见,所以你基本上是在阅读John Hinkley关于Jody Foster的主题。

  1. 这个想法确实有效。它以极低的运营成本生成优雅,响应迅速的站点。我的估计是,带宽,CPU等成本占运行类似页面网站成本的10%。
  2. 您需要更少但更好(或至少受过更好训练)的程序员。 JavaScript是一种强大而优雅的语言,但它存在一些巨大的问题,即像Java这样的更加僵化和缺乏想象力的语言没有。如果您有一大堆基本上平庸的人为您工作,请考虑使用JSP或Ruby而不是仅使用JS。如果你需要使用PHP,那就开枪吧。
  3. 您必须在锚标记中保留基本会话状态。用户只希望URL代表站点的状态:重新加载,书签,后退,前进。 jQuery的Address插件将为您完成大量工作。
  4. 如果SEO是您的问题,请调查Google Ajax Crawling。基本上,你只为搜索引擎制作一个非常简单的并行网站。
  5. 我什么时候只使用JS?如果我正在制作一个几乎完全内容的网站,用户什么都不做,只能从一个地方导航到另一个地方,从不以复杂的方式与网站互动。所以,维基百科和......嗯,就是这样。一个很大的参考站点,有大量数据供用户阅读。

答案 4 :(得分:0)

模块化。 多个文件允许您干净地分解不同的工作流路径和处理部件。 很可能你的业务规则通常不会直接影响你的布局规则,而且多个文件可以更好地帮助编辑需要编辑的内容,而不会有破坏不相关内容的风险。

答案 5 :(得分:0)

我实际上只使用一页开发了我的第一个应用程序。

..它变得凌乱

我的想法是创建一个尽可能模仿桌面环境的应用程序。特别是我想要一个应用程序数据的详细视图,这些应用程序数据将保留在弹出窗口中,无论它们所在的应用程序部分如何,它都将保持其状态。

因此我的弗兰肯斯坦出生了。

由于预算/时间限制而最终发生的事情是代码失控。我的JavaScript源代码的各个部分混杂在一起。保持各种观点的正确状态我证明是......很难。

通过适当的规划和技术,我认为“单页”方法是一种非常简单的方法,可以开辟一些非常有趣的可能性(例如:在应用程序部分维护状态的小部件)。但它也开辟了许多...... 许多潜在的问题领域。包括...

  • 充斥全局命名空间(如果您还没有自己的... make one
  • 代码组织很容易失控......
  • 背景 - 很容易

我确信还有更多...

简而言之,我强烈建议您不要依赖JavaScript依赖性来解决兼容性问题。我已经意识到,根本不需要依赖JavaScript来一切


我实际上正在删除Progressive Enhancement的厕所中的JavaScript依赖项。它更有意义。使用正确编码的JavaScript,您可以获得相同或类似的效果。

这个想法也是......

  1. 使用任何JavaScript
  2. 开发格式良好,功能齐全的应用程序
  3. 设计风格
  4. 用JavaScript包装整件事
  5. 使用渐进增强功能可以开发一个应用程序,为用户提供尽可能最佳体验。

答案 6 :(得分:0)

对于其他一些参数,请查看单页界面宣言以及黑客新闻(链接在SPI页面底部)的一些(大部分)负面反应:

单页界面宣言:http://itsnat.sourceforge.net/php/spim/spi_manifesto_en.php

答案 7 :(得分:0)

stofac,首先,感谢单页界面(SPI)宣言的链接(我是这个无聊文本的作者)

说这个,SPI!=通过Javascript做一切

看看这个例子(以服务器为中心): http://www.innowhere.com/insites/

在GAE中也是如此: http://itsnatsites.appspot.com/

有关GAE方法的更多信息: http://www.theserverside.com/news/thread.tss?thread_id=60270

在我看来,完全用JavaScript编写复杂的SPI应用程序/网站是非常复杂和有问题的,我认为最好的方法是SPI的“混合编程”,这是一种以服务器为中心的大型状态管理和客户端组合特殊效果的中心(手工称为JavaScript)。

答案 8 :(得分:-1)

在任何地方使用ajax在单个页面上执行所有操作会破坏浏览器的历史记录/后退按钮功能并使用户烦恼。

答案 9 :(得分:-1)

我完全鄙视仅限JS的网站 ,不需要 。这种额外的条件使一切变得不同。举例来说,考虑经常引用的Google Docs,在这种情况下,它不仅有助于改善必不可少的体验。但Google帮助的某些部分仅支持JS,但它不会增加任何体验,只显示静态内容。

以下是我心烦意乱的原因:

  • 和很多人一样,我是NoScript的用户并且喜欢它。页面加载速度更快,我感觉更安全,避免了更多分散注意力的广告。最后一点对于网站管理员来说似乎是件坏事,但我不希望任何人因为在我的脸上推出烦人的华而不实的东西而获得奖励,如果不熟练的广告商破产我认为这是自然选择。
    显然,这意味着您网站的一些访问者要么被拒绝,要么因为需要提供临时排除而感到厌烦。这会减少您的受众群体。
  • 你正在重复努力。浏览器已经具有完美的历史记录功能,当单击后退按钮时,您不需要通过重新绘制上一页来重新发明轮子。更糟糕的是,返回页面不应该需要重新渲染。我想我是If-it-a -'tin't-broke-not-fix-it学校的学生(来自不要重复你自己。)。
  • 在JS中遍历“pages”时没有HTTP标头。这意味着没有缓存控制,没有到期,内容无法根据请求的语言或位置进行调整,没有有意义的“页面未找到”或“不可用”响应。您可以在您的超级页面中编写错误处理例程来响应失败的AJAX提取,但这更加复杂和重新发明,这是多余的。
  • 没有缓存对我来说是一件大事,没有它代理就无法有效工作,缓存具有最大的减载效果。同样,你可以在你的JS应用程序中模仿一些缓存,但这更复杂和冗余,更高的内存使用率和更糟糕的用户体验。
  • 初始加载时间更长。通过在第一次访问时加载如此多的Javascript,您将导致更长的延迟。
  • 更多JavaScript复杂性意味着在各种浏览器中进行更多调试。服务器端处理意味着只调试一次。
  • Unfuddle(一个错误跟踪器)留下了不好的味道。我最不愉快的网络体验之一是被雇主强迫使用这项服务。从表面上看,这似乎很合适; JS-heavy部分是私有的,所以不需要担心搜索引擎,只有重复的访问者才会使用它,所以有时间关闭保护,不应该介意最初的JS库加载。
    但它使用JS毫无意义,大多数内容都是静态的。 “页面”仍然被提取(通过AJAX),因此延迟是相同的。有了AJAX的好处,它应该在后台轮询以检查更改,但是当可见页面被修改时我不会收到通知。部分具有不同的样式,因此在遍历这些部分时会出现尴尬的重新渲染,通过Javascript加载外部样式表是 Bad Practice™。易于使用是因为“看看我们的Web 2.0”功能而牺牲了。这种以业务为导向的应用程序应该专注于检索速度,但最终会变慢 最终我不得不拒绝使用它,因为它破坏了团队的工作流程。这对客户 - 供应商关系不利。
  • 动态页面更难保存以供离线使用。一些移动用户喜欢提前下载并关闭他们的连接以节省电力和数据使用。
  • 动态页面更难以让屏幕阅读器解析。虽然盲人用户的数量可能少于使用NoScript或移动连接的用户,但忽略可访问性是不可原谅的 - 在某些国家甚至是非法的,请参阅“残疾歧视法案”(1999年)和“平等法案”(2010年)。

正如其他答案中所提到的,“渐进增强”,即“Unobtrusive Javascript”,是更好的方法。当我被要求建立一个只有JS的网站时(请记住,我原则上并不反对它,有时候它是有效的)我期待实现前面提到的AJAX爬行,并希望它在未来变得更加标准化。