为什么不AJAX'ify整个网站?


11

关于为什么不应该使用加载每个部分主要部分的ajax功能来开发站点,是否有确凿的理由(假设标头,导航等元素保持不变)?

当然,由于服务器不必提供出现在每个页面上的内容,因此资源占用将减少,主机和最终用户都将从中受益。

考虑以下问题回答问题:

  • 网站javascript行为在每个实例中均会正常降低

  • 对于我的问题,我是在谈论可以实施此行为的新站点,而不是从头开始实施,因此从技术上讲,它不会花费任何金钱-我们不会返回完成的产品来实施它。


1
gmail是几乎完全是AJAX的“网站”的示例。一个完整的AJAX网站比传统网站更适合于Web应用程序。
Lie Ryan

1
it doesn't technically cost any money除了它。要获得可与常规浏览体验媲美的AJAX,您需要重新实现常规站点自动提供的浏览器内置功能,例如后退按钮,浏览器历史记录,缓存等。至少,您需要必须通过点击事件处理程序(包括:visited和:active标记)重新实现超链接功能。
Lie Ryan

如果希望Ajax站点像非Ajax站点一样执行,则必须复制现有功能。但这就像要求超人走路而不是飞走。如果您会飞,走路是毫无意义的。
埃维克·詹姆斯

Answers:


6

如果在不启用JavaScript的情况下访问内容,则您的问题没有任何意义。如果您可以通过其他方式来获取内容,则不是“完全废除”。确实,您要问的是:“可以通过Ajax增强用户的体验吗?”。答案显然是“是”。

编辑

早在Google提出其可抓取的Ajax提议时,它就被批评为一个非常糟糕的主意。进行了有趣的阅读。


真的,du。大声笑。关于为什么许多主要网站不能通过提供无缝内容来增强用户体验的想法?
匿名

我想说的是成本(增加使用JavaScript增强站点所需的代码,成本/收益太小而无法证明其合理性),时间,与更多代码/层相关的维护成本增加应用程序,尤其是当您将移动设备纳入其中时。
约翰·孔德

对于该“非常糟糕的主意”链接及其关于完全AJAX网站的极端危险的警告性故事,其+1。
joshuahedlund 2011年

4

第一件事

优点

  • AJAX可以允许您使用通用的“基本”页面并仅加载内容区域,这可以减少用户的加载时间,因为该页面的很大一部分已被加载。
  • 可以允许一些令人眼花candy乱的内容区域诸如淡入淡出。

缺点

  • 如果下载页面,播放效果不佳。
  • 会与残障设备混在一起。
  • 除非已使用非JavaScript版本,否则关闭了javascript的查看器将完全无法使用该内容。
  • 还有更多工作(真的需要说吗?)。

现在您的问题

假设您的网站对于那些没有Javascript的用户而言会正常降级,那么效果如何取决于它的完成方式。例如,如果您只是突然显示了指向非JavaScript版本的链接,那么这些查看者不得不单击另一个链接会带来不便。另一方面,如果存在一个使用传统链接的noscript“主页”,对大多数用户来说效果更好,但仍对那些使用残疾设备的用户缺乏支持,在这种情况下,用户会从链接等

总而言之,在网络连接越来越快的世界中,它并不能证明减少少量文件大小是合理的(我们假定所有Javascript本身,CSS和图像都可以并且将被缓存,仅保留“基本”页面本身以节省字节)以获取它可以带来的弊端,即额外的困难(尽管这并不总是一个弊端-挑战是件好事),并且缺乏某些用户的支持。

总而言之,我想说的是,取决于您,效果可能会很好,对于绝大多数用户而言,他们可能会按预期看到该网站,但就我个人而言,我不会麻烦,因为对文件大小进行如此微小的改进不值得麻烦。


3

请访问http://gawker.com/-该网站在发生故障后几乎完全加载。他们使用“ hashbangs”(http://mydomain.com/#!some_section)确定应该加载哪个内容页面,主导航保持静态。

请访问http://mtrpcic.net/2011/02/fragment-uris-theyre-not-as-bad-as-you-think-really/,以获取有关Gawker概念的简短教程。

有优点也有缺点,您必须考虑使用搜索引擎(请参阅http://code.google.com/web/ajaxcrawling/docs/getting-started.html),禁用javascript的人并进行大量测试。

综上所述,反对他们的最大论点可能是当用户等待页面加载,然后不得不等待更多加载时,他们可能会不耐烦。我认为,最佳做法是一次加载(应要求)加载主站点,导航和主要内容,并为非必需的杂项保存AJAX。这符合渐进增强的想法,并结合了两种方法的优点。


1

因为这可能只是不必要的。
加载基本的HTML文档非常简单且可行。Ajax的介绍增加了浏览器,代码和Java维护,后端内容,怪异的hashbang URL等其他整个过程。有时这是合理的,有时则没有。它可能会为您节省一些服务器资源(可能),但这是否足以抵消维护费用?您必须评估每个项目。

例如,当Twitter获得最新的重新设计时,他们采取的方法不仅仅是一个Web(页面)站点,而是一个应用程序,整个过程很大程度上都基于Ajax,尽管它所做的大部分工作通过常规页面请求进行处理。现在最大的问题之一(尽管现在发生的情况要少得多)仍然到达那里,并因为Ajax中的某些操作失败而出现空白页。


1
您是否建议不使用Ajax就可以使用Facebook或GMail?它们就像早期的Web邮件和MySpace。
艾维克·詹姆斯

对于Ajax失败,优秀的程序员可以为此类事件编写检测。可能会提示您重试该请求,或者只是显示出了问题。
Jomar Sevillejo

0

实际上,要创建一个“完全AJAX”网站需要大量工作,尤其是对于非常复杂的主要网站。尝试这样做的一些网站是Google和Facebook,但即使这样做也不是完美的。

常见的问题是导航(即,向前和向后)和添加书签,但是许多开发人员宁愿不必处理许多其他错误。从根本上讲,这意味着创建两个版本的网站以与Javascript和非Javascript用户兼容(并修复所有具有不良AJAX支持的浏览器)。


我认为“前进和后退”的概念已被弃用。人们开始意识到网络就像一条河流,而不是一本有形的书。
埃维克·詹姆斯

0

是的,应该是,但是应该相反。

页面的公共部分应通过HTTP发送。然后,一个小的ajax(或什至更好的websockets)控件异步加载动态内容。

当然,您首先需要检测javascript是否已启用(通过cookie),并且仅在启用后才使用此方法。

因此,您需要正常的完整HTTP路由,然后是websockets路由。除非您使用诸如node.js之类的工具,否则这需要代码重复

大多数人“认为”这是不值得的。有时不是。

顺便说一句,许多人错误地将页面废止。他们实际上决定您不需要非JavaScript版本,并且需要所有这些奇怪的哈希爆炸网址和中断的前进/后退按钮。正确执行ajax需要HTML5历史记录(IE9没有它)。它还要求开发人员完成您网站的版本。


0

既然您说过禁用Javascript的访问者会优雅地降级,所以我只能看到可能出现的两个实际问题(和一个可能的问题)。

对可访问性不利

屏幕阅读器和其他辅助技术通常被动态DOM更改所取代。他们以线性方式处理和读取页面,并且在页面加载后更改页面内容可能无法正确处理。

也许有一些技术可以解决这个问题,但是我还没有对它进行太彻底的研究。

复杂性增加

维护这种网站可能很棘手。举一个例子:如果您创建了一个新的布局并更改了要用AJAX链接替换的内容区域的ID,它可能会以一种非常令人困惑的方式破坏您的导航方案。

这种AJAX行为也会使您正在进行的任何流量分析变得复杂。如果不手动调用,Google Analytics(分析)将无法正确注册这些AJAX负载pageTracker._trackPageview('this_page');

增加页面操作的复杂性也提高了新开发人员的门槛;该网站上的任何人都可能必须使这种行为如何影响页面加载。

可能:初次访问时页面加载速度降低

根据您构造事物的方式,此获取AJAX代码的页面仅在文档完全加载后才能启动。因此,只有您的访客下载了整个页面,然后是Javascript(如果它是一个外部文件),然后他们的浏览器呈现了Javascript,并通过AJAX提取了内容,他们才可以看到页面的内容。

每个后续的链接单击都将更快,但是获取用户访问的第一页实际上要比静态版本花费更长的时间。

我将其标记为可能的问题的原因是,您始终可以始终静态发送首页(因为您已经将静态版本作为后备),然后将AJAX用于后续链接。


对于我来说,这听起来并不可怕,特别是对于带宽敏感的用途,例如移动页面。不过,您必须仔细权衡缺点,以确保它值得您使用。


0

如果您的用户群较小,但是访问量较大,则在页面上使用ajax元素会很好。您想使用一种更静态的方法来减少资源滥用。

例如:假设您有200个人试图每秒访问一个页面。对于ajax调用,您大约有7个数据库查询。那就是每秒调用1400个数据库,这可能会使一个网站陷入瘫痪。

需要针对更高流量进行设计的网站应具有静态的朝外页面,以便可以静态方式显示内容。这是通过使用每秒运行一次的服务器端脚本来重建静态页面来完成的,该页面是为最终用户获取的,因此,您将负载从1400次数据库调用减少到了每秒7次。

这是一种SOA网站构建方法。


1
使用AJAX并不意味着您必须突然忽略缓存。以相同的方式可以缓存整个页面,也可以缓存使用Java
脚本

@DisgruntledGoat我从未说过您不能使用AJAX,这个问题与是否使用AJAX有关;有关您为什么不想在页面上的所有内容上使用AJAX的信息。我更新了答案,以反映静态内容的原始含义。
保罗
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.