“榕树下·那年”移动app ( hybrid ) 开发总结

榕树下网站本身的技术人员并不多,所以app开发的任务就到了母公司盛大文学这边。

盛大文学无线业务中心负责这次具体开发任务。

一如既往的,开发的情况是:时间紧,任务重,人手少

技术选型


为了同时上线Android和IOS平台,所以选择了hybrid这种Native与HTML5混合的方式。

Native的优点是效率相对较高,但缺点是开发速度相对较慢,不利于自更新;

HTML5的优点是开发速度快,可以实现自更新,跨平台,缺点也是显而易见,效率不高,加载速度慢;

所以:

  • 用Native解决效率问题,主要用于切换界面的框架,图片浏览器组件等
  • 用HTML5解决开发上的时间问题,主要用来实现页面布局、渲染

后台服务端API提供统一的JSON数据格式,可以供Native与HTML5无缝使用,服务端可以不再关心客户端到底是HTML还是Native,HTML也可以随时改成Native

客户端与服务端通信数据交换统一使用JSON,这样一来如有需要Native可以换成HTML5,或者HTML5可以换成Native

Hybrid的HTML5部分



我负责的就是HTML5这一部分,其实就是WEB页,外行现在一见到炫酷的微信页面或其它效果的页面就觉得这是HTML5..

好吧,就叫HTML5吧。

Javascript

1、zepto.js

用于基本DOM操作与ajax选择使用定制的zepto.js,定制zepto.js的原因是我已经习惯了Deferred这种写法

所以需要用到Deferred模块。具体定制方法请参考https://github.com/madrobby/zepto

2、artTemplate.js

用于模板的渲染,语法简洁,效率高。https://github.com/aui/artTemplate

3、cloudary.js

整个项目的web端框架,为什么叫cloudary,其实名字几经更改,最后还是用了盛大文学的网站域名 www.cloudary.com.cn

至于为什么是cloudary这个词,好吧,谁知道当时是怎么定的这个组合的英文词的呢。。

它的作用:

  • 封装、桥接JS与Native的通信,对业务层提供统一的操作接口
  • 再次封装zepto.js提供的的ajax方法,主要作用是可缓存接口数据,进行统一的错误处理
  • 框架层对页面初始化完成后的业务处理
  • 提供全局的通用操作方法或接口,如:系统信息,存储操作等

4、每个页面自身的业务逻辑直接写在了页面上,因为代码并不多

CSS

用sass编写CSS

几个月之前还为之写了一个sass库,叫sasshat,项目地址:https://github.com/willian12345/sasshat

应用sasshat后APP某些WEB界面实现的效果如:

下面这个是用web实现的动画启动页

用了SASS后的好处:

  • 编写CSS更加快速
  • 可适应频繁的需求改动(—_—!)
  • 更快速的纯CSS实现酷炫动画
  • 更性感

该说说缺点了



1、加载速度慢

首次进入页面更慢,页面复杂度越高,需要的资源越多,加载资源慢,渲染DOM慢。

在移动端特别如此,随着手机越低端,性能递减越厉害

2、低端手机CSS3支持程度不一

有时候不得不放弃一些好用的CSS属性,而改变另外的方案实现。因为某些Android2.X的手机真的很落后。

不得不为这些手机去掉一些效果或者专门判断后用普通图片代替效果

3、跨平台很美

web确实是跨平台的,但webview内的浏览器CSS兼容比手机上浏览器内更不好。所以要实现全兼容只是目标。

要花的时间与精力不比用Native少,所以为什么不选择用更合适的Native呢?

最后要说的



(APP现还未正式发布。还在内测)

无图无真像。

我在现在的公司还是喜欢用自己写的东西。

虽然市面上有很多mobile端的web框架可用,但选择哪一款,要不要用,还是要根据自身项目所处的环境:人力配制,技术水平,公司B格。

对于WEB开发人员来讲,开发Hybrid形式的APP,还要取决于Native端开发者的水平或者对webview知识的熟悉程度。

对于一般技术人员来讲,WEB不了Native,而Native也不了解web

======================================

转载处请注明:博客园(池中物,王二狗)[email protected]

时间: 2024-10-09 07:21:06

“榕树下·那年”移动app ( hybrid ) 开发总结的相关文章

Hybrid APP混合开发的一些经验和总结

Hybrid APP混合开发的一些经验和总结 写在前面: 由于业务需要,接触到一个Hybrid APP混合开发的项目.当时是第一次接触混合开发,有一些经验和总结,欢迎各位一起交流学习~ 1.混合开发概述 Hybrid App主要以JS+Native两者相互调用为主,从开发层面实现“一次开发,多处运行”的机制,成为真正适合跨平台的开发.Hybrid App兼具了Native App良好用户体验的优势,也兼具了Web App使用HTML5跨平台开发低成本的优势. 目前已经有众多Hybrid App开

(一)Hybrid app混合开发模式

hybrid app是什么? 这里我们先看一下词条上的定义 Hybrid App:Hybrid App is a mobile application that is coded in both browser-supported language and computer language. They are available through application distribution platforms such as the Apple App Store, Google Play

Hybrid App—Hybrid App开发模式介绍和各种开发模式对比

什么是Hybrid App 最开的App开发只有原生开发这个概念,但自从H5广泛流行后,一种效率更高的开发模式Hybrid应运而生,它就是"Hybrid模式".Hybrid APP是目前广泛流行的一种APP开发模式 H5渗入APP开发 我们都知道,原生APP开发中有一个webview的组件(Android中是webview,iOS7以下有UIWebview,7以上有WKWebview),这个组件可以加载Html文件. 在Html5没有兴盛之前,加载的Html往往只能用来做一些简单的静态

App软件开发的10个常用技巧

移动应用市场用户争夺战日益激烈,原来做APP拼想法拼创意拼是否抓住用户痛点.现在,精细化用户体验成为了一个APP能否留存用户的关键问题,一旦用户觉得体验不畅,马上就有竞品APP后补,如何开发高性能的移动应用,小编总结了以下十大技巧: 1.   规划评估App开发的核心功能 用户体验开始于APP开发初始规划阶段,当你梦想开发一个APP改变世界之前,先想好APP主要解决用户的哪些真实需求,提炼出APP的核心功能,一个APP并不是功能越丰富越好,核心功能才能为用户带来不可替代的价值. 登录APIClo

什么是APP???APP的开发类型又分哪几种???

开发者们都知道在高端智能手机系统中有两种应用程序: 一种是基于本地(操作系统)运行的APP --Native App: 一种是基于高端机的浏览器运行的App --WebApp因为这些高端智能手机(Iphone.Android)的内置浏览器都是基于webkit内核的,所以在开发WEBAPP时,多数都是使用HTML5和CSS3技术做UI布局.当使用HTML5和CSS3l做UI时,若还是遵循着一般web开发中使用HTML4和CSS2那样的开发方式的话,这也就失去了WEBAPP的本质意义了 一种是基于上

C#学习(九)之Windows Store App & WP 开发小记(一)

由于课程已经讲述完毕,所以本次学习记录就讨论记录一下我在Windows Store App & WP开发中遇到的一些问题与收获. 一.数据库(Sqlite)的使用 虽然资料很难找,但sqlite在这两个平台的使用还是很简单的. 首先是环境配置阶段: 1.工具->拓展与更新->联机,然后在右上搜索sqlite,之后下载安装下图两个打勾的拓展包,注意要重启VS方才生效. 2.项目->管理NuGet程序包->联机,搜索sqlite,安装下图打勾内容,如果项目多出下图两个文件即安装

App软件开发的完整在线流程(一看就懂)

App软件开发其实并不复杂,完整的在线App开发不过9个步骤,一看就明白到底是怎么回事. 第一步:需求评估 在App项目正式启动前,客户应该对自己的需求进行评估,确认项目的开发周期和成本.登录APICloud定制平台,3分钟提交App需求,由专业客服一对一梳理并形成评估报告.前期需要专业客服和项目监理与客户充分沟通,了解客户要开发APP的类型.平台.功能.产品设计的需求.时长.预算等等,只有了解客户的详细需求才能做出开发方案. 第二步:官方签约   确认App软件项目的开发需求后,与APIClo

如何在windows系统环境下发布ios app应用上架

如何在windows系统环境下发布ios app应用上架 发布ios app一般是通过苹果公司的开发工具Xcode,需要运行在mac系统上,也就是要通过mac电脑才能发布应用上架,有很多的局限性,现在出现了一款辅助工具软件,可以在windows,mac或linux系统环境,发布app,具有很多实用的功能,而且精简了发布流程,提升了效率.分享给各位开发爱好者. 通过appuploader这款辅助开发工具,可以在windows,mac或linux中将一个或多个ipa文件上传到appstore,故障的

Web程序员开发App系列 - 开发我的第一个App,源码下载

Web程序员开发App系列 Web程序员开发App系列 - 认识HBuilder Web程序员开发App系列 - 申请苹果开发者账号 Web程序员开发App系列 - 调试Android和iOS手机代码 Web程序员开发App系列 - 开发我的第一个App 待续 目录 前言 源码和App下载 准备工作 查看留言页面 增加留言页面 前言 看了前面几篇文章后我们终于要开始敲代码了,由于所有前端代码都是Html静态问题,所以你用什么开发工具都可以,后台我采用MVC开发,因为Html静态文件需要打包,里面