最佳及可预见的 Ajax 应用程序,考虑浏览器、系统和用户间的固有差异

本文探讨了开发人员在构建跨浏览器的Ajax应用时面临的挑战,并提出了针对不同浏览器和平台的优化建议。

简介

通过本文,了解开发人员在开发面向所有类型的计算机、浏览器和用户的最佳化的 Ajax 应用程序时所面临的挑战。对于用户和开发人员而言,处理多浏览器并不鲜见,由于用户经常要将应用程序从一种浏览器类型转换到另一种浏览器类型,因此 Ajax 开发人员常常会遇到问题。每个浏览器都有一些固有的限制,这些限制会影响 Ajax 应用程序在 Web 页上显示(甚至执行)的方式,所以为用户提供完全的跨浏览器的相同性不太可能。

常见的浏览器有 Microsoft® Internet Explorer®、Opera、Firefox 和 Konquerer。除 Konquerer 只能运行在 Linux® 上之外,其他几种常见的浏览器都可在 Windows®、Linux 和 Apple 的 Mac OSX 上运行。由于如今常用的浏览器有好几种,所以作为开发人员,很有必要熟悉这些浏览器间存在的差异。本文将帮助您了解计算机型号间的硬件差异(包括内存、磁盘空间及其 USB 接口的数量)以及软件限制(比如字体可用性、HTML 扩展和表单元素)。在弄清楚了不同计算机系统间的性能问题后,就可以进一步了解优化浏览器间差异的可能解决方案,这种方案将有助于用户将应用程序从一种浏览器类型移动到另一种浏览器类型或将 Ajax 应用程序转变到 Web 服务门户。并且,您还将了解到如何避免常见的 Ajax 开发缺陷。

计算机类型这么多,而时间却如此少!

很多开发人员都很喜欢采用 PC 来将 Web 页面转变成 Ajax 门户,Macintosh 用户也可以执行这类转变。如果在 PC 和 Macintosh 上使用相同浏览器的最新版本来查看 Web 页面,可能会注意到页面在每个计算机上的显示有所不同。而且,PC 和 Macintosh 的型号不同,屏幕尺寸和相应的 canvas 也会不同。尽管设置相同,某些型号 Macintosh 计算机的 canvas 大小和分辨率与一些型号的 PC 机也会有显著的不同。这些计算机类型和型号间的差异不仅会影响字体显示的方式,还会影响其他的设置。

无论用户选择何种浏览器、操作系统或计算机品牌,在设计行为一致并能按预期呈现用户界面的 Ajax 应用程序时,需要多加考虑。还需要牢记最优化应用程序需要注意的一些因素,以实现最佳性能和易用性。

在开发 Ajax 应用程序时,需要考虑页面宽度和高度以及应用程序将如何显示,因为用户的分辨率设置可能差别很大(比如 800x600 和 1024x768)。在较大的分辨率设置中能正常显示的应用程序如果要在分辨率设置较小的屏幕中显示,用户将需要进行很多滚动。但是如果应用程序需要太多的滚动,站点就会失去许多访问者。

内存和磁盘空间差异

如果用户内存不足以执行复杂计算,他们的计算机就会试图在磁盘上寻找空间来完成该计算。如果,如果在计算处理完成之前,内存或磁盘空间的块分配已经耗尽,用户就会看到内存或磁盘空间用完的错误消息。

Ajax 应用程序内这类问题发生的根本原因与 Ajax 应用程序如何处理内存、磁盘空间和其他系统资源不无关系。开发人员可以选择要么减轻对完成计算所需的系统资源的要求,要么修复 Ajax 应用程序。选择减轻可导致系统超载的要求,就应该清理不想要的文件或使用外部 USB 盘来存储和运行较大的 Ajax 应用程序。如果选择修复应用程序,就应该将其分成不同的模块部分并为每个部分提供异常处理以便确定问题的根源。

USB 端口

计算机具有的 USB 端口越多,能插入该计算机的 USB 设备就越多。理想的计算机应该至少有两个 USB 端口以供功能强大的 USB 设备(比如带 Y 电缆的 120 MB 的便携 USB 外部磁盘)使用,如果为了存储和运行 Ajax 应用程序所需的内部磁盘空间都已用完,那么这种设备就会非常有用。如果所需的端口比计算机所能提供的 USB 端口还要多,则可以考虑使用 USB hub。如果 hub 也带 Y 电缆,那么可以将这两者都插入计算机上的 USB 端口。

注意: 如果想要将一个很大的外部磁盘插入不带适配器的 hub,由于此 hub 提供的功率比外部磁盘所需的小,因此磁盘驱动器和 Web 服务门户都不会正常工作。若想让此驱动器工作,就需要一个能提供更大功率的带适配器的 USB hub。

字体问题

让我们看看有关字体的两个问题:可用性和兼容性。

字体可用性

Internet Explorer for Windows 中的文本与 Internet Explorer(或 Navigator)for Macintosh 中同样的文本会有差异,特别地,Macintosh 机上一种字体集的文本的某种大小会比 PC 上看起来小一些。作为一个开发人员,在使用常见的设置文本大小的方法时,需要知道 PC 和 Macintosh 机上文本的最大尺寸。某种 PC 的用户在查看浏览器时喜欢使用的字体可能在另一种 PC 型号或 Macintosh 计算机上不可用。如果特定字体在特定的计算机上不可用,字体就会被设成该计算机上的默认类型(要判断 PC 上运行的 Windows 可用的字体,可以从开始菜单中打开控制面板并选择字体图标)。

字体兼容性

很多开发人员都觉得让文本在诸多浏览器和平台上呈相同的大小是很难的一件事。问题在于各种浏览器有不同的方式供用户调整字体大小。比如,在 Windows 环境,Internet Explorer 提供了 5 种字体大小:最大较大较小最小。Mozilla Firefox 允许用户放大和缩小字体大小或返回到原始大小。而 Opera 则允许用户通过从列表中选择一个百分比来调整字体大小。因此,当写进应用程序的字体大小改变时,没有两个浏览器会给出相同的结果。

即使是将字体大小设成了一种描述性值,比如 ,在不同的浏览器中也会看到不同的结果。要使多个浏览器中文本呈现的字体大小相同,一种方法是使用级联样式表(Cascading Style Sheets,CSS),在设置字体大小时可以使用百分比或 em 值。还有最后一个方法,也可以使用与屏幕分辨率相关的像素大小。

HTML 标准

除了 JavaScript 和 XML,Ajax 应用程序还使用了 HTML、DHTML 和文档对象模型(Document Object Model,DOM)。Ajax 应用程序使用 HTML 构建 Web 表单、使用 DHTML 标记 HTML 以动态更新表单。由于 DOM 适用于从服务器返回的 HTML 和 XML 结构,所以如果新的标准和表单元素不通用,就可能出问题。

最新的 HTML 版本

由于 HTML 标准中较新的部分在较新版本的浏览器中可以更好地显示 Web 页面,所以大多数用户都会升级自己喜欢使用的浏览器。但是,新的标准经常不受某些浏览器的最新版本的支持,因为,在实践中,这些标准通常都会超前于浏览器所能提供的支持。虽然没有任何一种浏览器能够百分之百地支持 HTML 标准的最新版本,但的确有一些浏览器能够较其他浏览器更加接近标准。

由于对最新的 HTML 标签的支持还不通用,所以构建页面使用的部分语言很有可能不是所有浏览器都能理解的。如果浏览器不能解释页面的某些部分,那么它就不能显示出预期的效果。比如,当在 Internet Explorer 中使用一些重叠的层时,在相同的浏览器的早期版本或不同的浏览器类型中,这些层就可能不能被正确解释。比如,Opera 和 Firefox 可能会显示重叠层的一小部分,而 Internet Explorer 则根本不会显示。我建议在正式发布应用程序之前使用 Web 开发软件(比如 Microsoft Expression® Web)在多个浏览器中预览页面。

表单元素

根据 HTML 标准和所使用浏览器的版本的不同,表单元素在大小、间距和排版上也会有所不同。表单元素会影响下拉菜单、文本输入栏和其他表单元素所占据的空间大小。在一种浏览器中表单元素在页面上显示的效果可能如您所愿,但在另一种浏览器中使用同样的表单元素,其显示方式可能就不太一样。

性能问题

在发布应用程序之前,有几个性能因素需要考虑。比如,所选择的浏览器速度、大型 XML 文件的大小和附件的影响。

浏览器速度

我认为,对 Windows 应用程序而言,Opera 是速度最快的浏览器。尽管 Firefox 比 Internet Explorer 快不了多少,我还是认为它是标准支持、安全性和功能方面更好的选择。但是,它还是没有 Opera 速度快。对于 Linux 应用程序,对于在 KDE 上启动和查看基本的页面,我认为 Konqueror 速度最快。但一旦涉及到脚本和图像,我觉得 Opera 的速度更迅速。虽然 Firefox 的整体性能不错,但我认为其脚本、缓存处理或基于图像的页面速度无法与 Opera 的相比。在 Mac OS X 上,Opera 和 Safari 的速度都很快,Safari 2 在启动和呈现 CSS 方面比较快,Opera 在呈现表、脚本和历史记录方面比较快。对比 Firefox 和 Internet Explorer,Navigator 更适合于 Mac OS X 应用程序。

由于 Opera 对于运行应用程序来说速度最快,但其调整类型大小的缩放特性没有 Internet Explorer 的类型大小选项或 Firefox 的 Ctrl 选项那么用户友好。如果使用的是 Microsoft Expressions Web 设计工具来预览 Web 页面,Opera 就根本不在考虑之列。

XML 文件大小

在使用基于文本的大型 XML 文件时,请格外注意和小心,因为它们会减缓浏览器的响应时间,甚至会阻止网络流量。 代替基于文本的大型 XML 文件的另一种方式是使用二进制 XML(在我第一篇题为 Speed up Ajax applications while dodging Web service vulnerabilities 的文章中有详细的介绍;该文章在 参考资料 部分可以找到)。

浏览器增件

针对浏览器,有很多增件可用,比如弹出阻止器、标签管理器以及 UI 主题等,它们都可以以意想不到的方式影响 Ajax 应用程序。例如,您可以将弹出阻止器设置成阻止新浏览器窗口打开。但您可能不会立刻意识到弹出阻止器会消耗浏览器窗口的大量空间并会隐藏应用程序的某些部分。当浏览器的某些部分被占用后,Ajax 应用程序可能就无法按预期的那样显示了。

十大技巧和缺陷

以下列出的是构建优化的 Web 页面的实用技巧以及应该避免的一些隐患。这些建议对于 Ajax 应用程序的用户也很有帮助!

  • 开发人员:避免使用 HTML 扩展并在考虑使用某语言的最新特性时格外小心,因为这些特性可能还尚未获得所有主流浏览器的支持。

  • 开发人员:不要急于用受浏览器最新版本支持的 HTML 特性构建页面。

  • 开发人员:设计页面要适用于主流浏览器最近的两个版本。

  • 开发人员:最小化对内存、磁盘和其他系统资源的消耗以减轻对这三者的需求。

  • 开发人员和用户:在需要的时候才刷新 Ajax 应用程序,方法是重启 Ajax 应用程序或重启计算机(作为最后的手段)。

  • 开发人员和用户:定期删除不使用和不需要的计算机文件,释放磁盘空间以便应用程序能最佳运行。

  • 开发人员和用户:安装更多内存或插入一个外用的 120MB USB 硬盘驱动器。

  • 开发人员:在为 Ajax 门户设计 Web 页面时,要简化层选项。

  • 开发人员:模块化 Ajax 应用程序以便更容易判断问题的源头。在 Ajax 应用程序中加入异常处理。

  • 开发人员:通过使用 CSS 按百分比或 em 值设置应用程序的字体大小来避免文本大小问题,如没有其他选择,也可以使用像素大小。

结束语

开发人员、测试人员、系统管理员和潜在用户的输入可以帮助 Ajax 开发人员在开发 Ajax 应用程序和在将 Ajax 应用程序转变到 Web 服务门户时对浏览器差异进行优化。要最小化浏览器间的差异对 Ajax 应用程序的影响,必须在对其创建、测试和部署时加入一些计划,这样才能确保它具有最佳的性能和可预知性。



参考资料

学习
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值