HTML5 - 搭建“.NET研究”移动Web应用

简介:   关于HTML5  HTML5具有语义学、本地存储、设备访问、连接性、多媒体、平面和三维效果、性能和集成和CSS3八大技术特征。让Web应用进入无插件时代,在上海徐汇企业网站制作功能和性能上逼近桌面应用。

  关于HTML5

  HTML5具有语义学、本地存储、设备访问、连接性、多媒体、平面和三维效果、性能和集成和CSS3八大技术特征。让Web应用进入无插件时代,在上海徐汇企业网站制作功能和性能上逼近桌面应用。促使应用Web化,实现跨平台。

  HTML5规范草案将于2012年发布候选推荐版,2022年发布计划推荐版。规范的实现似乎还在遥远的未来,其实不然!当前很多浏览器已经部分支持HTML5,caniuse.com提供了详尽的浏览器支持情况。HTML5规范本身并不多,很多相关规范都被独立出来,由浏览器各自实现。      

  移动Web应用方向

  手机上网已经成为最重要的上网方式之一,手机网民已达3亿。移动互联网时代已经开启,发展势头迅猛,成为互联网行业的新战场。    

  Android和iOS手机的兴起,加速了HTML5在移动设备的普及。与桌面浏览器不同的是,移动操作系统和浏览器随着手机的换代而不断升级。移动浏览器的不断升级,给HTML5在移动Web方向的发展提供源源不断的动力。也随着设备性能的不断提高,移动Web应用的能力也渐渐逼上海企业网站设计与制作近客户端应用。    

  移动Web应用对比客户端应用的优势:

  1. 更多开发人员有丰富的上海闵行企业网站设计与制作Web开发经验和工具积累,也形成了成熟的开发社区
  2. 迭代更敏捷,实现持续更新
  3. 跨平台,开发成本比客户端的较低

  Web应用宿主选择

  Web都有宿主,宿主是运行程序所需要的环境。Web常见的宿主有IE、FF、Chrome这些浏览器。Javascript也运行在服务器端宿主,如node.js。在移动设备,移动Web可以运行在移动浏览器上,也可以运行在PhoneGap或Titanium等框架宿主上。当然我们也可以根据跨平台需要编写自己框架宿主。              

  框架宿主优势:

  1. 已形成成熟的社区,便于解决问题
  2. 如PhoneGap等,比浏览器拥有更高权限。可以访问联系人、文件、摄像头、录音等设备
  3. 可以通过模拟器进行测试,减少跨浏览器测试成本

  框架宿主劣势:

  1. 以客户端形式发布,版本更新难度大,动态发布需要额外代码支持
  2. 系统有可能只支持单进程
  3. 产品之间无法跳转,不容易衔接      

PhoneGap兼容性

  移动浏览器是系统附带的,不需要发布,随着系统升级而更新。在没有权限要求和高端目标设备的情况下,浏览器宿主作为移动Web应用宿主更为适合。

  Android浏览器   Mobile Safari

  浏览器宿主优势:

  1. 无需发布,浏览器一般还支持桌面快捷方式
  2. 产品更新维护方便,可以实现持续更新
  3. 移植性高(相对框架宿主的一些自定义接口)

  浏览器宿主劣势:

  1. 浏览器兼容不高,对HTML5支持有差异
  2. 性能差异大,必须考虑设备间处理能力的差异
  3. 测试成本大(特别是Android系统设备),无法覆盖所有机型

  移动Javascript框架

  在HTML5的支持下,交互集成取代Javascript浏览器兼容性成了移动Javascript框架的发展方向。其中jQuery Mobile和Sencha Touch最受追捧。

  他们主要解决:

  1. 交互(包括UI设计、控件交互、页面切换等)集成
  2. Touch手势          上海企业网站制作style="display: block; margin-left: auto; margin-right: auto;" src="https://yqfile.alicdn.com/img_bbb2575be336ed96ec8adf659ff6dc3a.png" alt="" />      

  交互集成框架优势:

  1. 交互都符合设备交互特点和设计规范(Android和iOS)
  2. 开发门槛低,适合快速开发
  3. 开发社区已经有丰富的跨平台经验和较全面的测试结果

  交互集成框架劣势:

  1. 文件体积较大,效率往往不如原生HTML5
  2. 交互模式固定,难以摆脱上海闵行企业网站制作

  没有完善的业务框架,还需要自己实现基础业务框架(代码更新、业务模块重用等)     

jQuery Mobile 兼容性

  除了交互集成框架,我们还可以考虑使用原生HTML5开发自己的移动Javascript框架。自己开发更有针对性和目的性,适合业务扩展和性能优化,可以弥补集成框架的缺陷。

  原生HTML5框架优势:

  1. 最适合长期业务扩展
  2. 开发灵活度更高
  3. 可针对目标设备的性能优化

  原生HTML5框架劣势:

  1. 暂时只能兼容高端设备(Android2.0+、iOS3.2+性能较佳)
  2. 跨平台测试成本比较高
  3. 框架开发门槛比较高,需要一段时间发展

  参考资料

  http://www.caniuse.com

  http://www.w3.org

  《2010年中国手机上网用户行为研究报告》

  《2010-2011年中国智能手机市场研究年度报告》

目录
相关文章
|
存储 移动开发 大数据
HTML5 Web IndexedDB 数据库详解
IndexedDB 是一种高效的浏览器存储方案,允许在本地存储大量结构化数据,支持索引和事务,适用于需要离线和大数据处理的应用。它由数据库、对象仓库等组成,通过键值对存储数据,确保数据一致性和完整性。本介绍展示了如何创建、读取、更新和删除数据,以及事务和错误处理的最佳实践。
1324 10
|
XML JSON API
ServiceStack:不仅仅是一个高性能Web API和微服务框架,更是一站式解决方案——深入解析其多协议支持及简便开发流程,带您体验前所未有的.NET开发效率革命
【10月更文挑战第9天】ServiceStack 是一个高性能的 Web API 和微服务框架,支持 JSON、XML、CSV 等多种数据格式。它简化了 .NET 应用的开发流程,提供了直观的 RESTful 服务构建方式。ServiceStack 支持高并发请求和复杂业务逻辑,安装简单,通过 NuGet 包管理器即可快速集成。示例代码展示了如何创建一个返回当前日期的简单服务,包括定义请求和响应 DTO、实现服务逻辑、配置路由和宿主。ServiceStack 还支持 WebSocket、SignalR 等实时通信协议,具备自动验证、自动过滤器等丰富功能,适合快速搭建高性能、可扩展的服务端应用。
888 3
|
SQL 存储 XML
常见Web漏洞分析与防范研究
在以上内容中,结合OWASP、Toptal和Brightsec等权威来源的信息,确保回答的专业性和准确性。通过图表和思维导图的方式,可以更系统地了解和记忆Web安全知识,帮助企业在实际应用中更好地防范各种安全威胁。
648 13
|
开发框架 .NET PHP
ASP.NET Web Pages - 添加 Razor 代码
ASP.NET Web Pages 使用 Razor 标记添加服务器端代码,支持 C# 和 Visual Basic。Razor 语法简洁易学,类似于 ASP 和 PHP。例如,在网页中加入 `@DateTime.Now` 可以实时显示当前时间。
|
存储 移动开发 数据库
HTML5 Web IndexedDB 数据库常用数据存储类型
IndexedDB 支持多种数据存储类型,满足复杂数据结构的存储需求。它包括基本数据类型(如 Number、String、Boolean、Date)、对象(简单和嵌套对象)、数组、Blob(用于二进制数据如图像和视频)、ArrayBuffer 和 Typed Arrays(处理二进制数据)、结构化克隆(支持 Map 和 Set 等复杂对象),以及 JSON 数据。尽管不直接支持非序列化数据(如函数和 DOM 节点),但可以通过转换实现存储。开发者应根据具体需求选择合适的数据类型,以优化性能和使用体验。
1014 10
|
SQL 存储 移动开发
HTML5 Web SQL 数据库详解
Web SQL 数据库是 HTML5 中的一种本地存储技术,允许在浏览器中使用 SQL 语言操作本地数据,支持离线访问和事务处理,适用于缓存数据和小型应用。然而,其存储容量有限且仅部分现代浏览器支持,标准已不再积极维护,未来可能被 IndexedDB 和 localStorage 等技术取代。使用时需谨慎考虑兼容性和发展前景。
|
移动开发 JavaScript 前端开发
HTML5 Web Workers详解
HTML5 Web Workers 允许在后台线程中运行 JavaScript,实现复杂计算而不影响用户界面,提升应用性能。其主要特性包括并行处理、异步通信、独立作用域及多数据类型支持。通过创建和使用 Worker 文件,如 `worker.js`,可执行后台任务,并与主线程通过消息传递机制通信。适用于数据处理、图像处理、复杂计算及网络请求并行等场景。需要注意的是,Web Workers 在浏览器兼容性、安全性限制、调试及资源消耗方面需特别关注。合理利用 Web Workers 可显著增强 Web 应用的流畅度和响应速度。
|
存储 移动开发 缓存
HTML5 Web 存储详解
HTML5 Web 存储包括 `localStorage` 和 `sessionStorage`,前者提供持久存储且无过期时间,后者仅在会话期间有效。两者均支持键值对形式存储数据,容量约为 5-10 MB。`localStorage` 适用于用户偏好设置、登录状态保持及离线应用缓存;`sessionStorage` 则用于临时数据如表单输入。数据以字符串形式存储,可通过 `JSON` 方法处理对象。由于数据存储于本地,不适合存放敏感信息。示例代码展示了如何使用按钮将输入框内容保存至 `localStorage` 并进行清除操作。