HTML5和移动终端给前端开发带来的变化——近三年探索经验漫谈.ppt

几年前的web2.0时代，我的一位老同事曾经感叹说： “前端技术能力的高低，很大程度上比的是各种小知识点的数量 —— 攒豆能力” 在投入html5和移动前端开发三年后，我越发对前端知识的广度心存敬畏，它在不知不觉中居然变成了如此可怕的庞然大物。当年的豆子们，随着低版本IE的退场，有些已经淡出视线了，但更多的豆子加入了进来，甚至还夹杂了很多西瓜。 未来，情况会更加复杂。攒豆吧，骚年。。。 结语 —— 攒豆和攒西瓜 Q A 你是怎么下载app的？ 渠道为王 有流量的应用平台非常少，和应用数量远不成正比 有效的推荐位非常紧张，基本排名100之外就很难被用户发现 你听过刷榜多少钱一天吗？ 你听过联运的门槛和分成比例吗？ 新的思路 —— 借助web推试玩版，引导下载 绕开渠道的高门槛和分成 先试用，再决定是否下载 我们的尝试 /js_demo/45/ 关于 hybrid 和 html5 的一些思考 2010年移动互联网迅速崛起 html5同样在2010年发热（技术圈内） 技术选型和长远发展 1）未来很快会淘汰掉吗？( delphi、flex、silverlight、flash banner、闪客 ) —— html5能够在未来十年内坚挺吗？ 2）技术深度要求够吗？( csser、jser、phper ) —— html5能够将b/s的产品形态做到什么程度？技术门槛可以提到多高？ 3）高薪的理由：时髦带来的稀缺 VS 小众带来的门槛 VS 深度带来的经验沉淀 —— 移动开发人员是否会迅速补上？多年的知识积累是否放弃？ 再论b/s结构优点 —— 免安装、升级透明、跨终端 曾经我以为web app会和native app正面激战 所以我做了这样的尝试： /js_demo/birdie_queue/ 和这样的尝试： /g78 但web app时机尚不成熟 我们遭遇了一系列问题： 跨终端带来的碎片化问题 手机厂商定制浏览器问题 Web标准未定稿，变化带来的问题 性能问题 浏览器bug和对标准支持力度带来的问题 缺少web app渠道问题 用户习惯需培养的问题 支付问题 锁定横竖屏和全屏问题 。。。 说多了都是泪。。。 环境什么时候会成熟？Web app什么时候会井喷？ 2011年的时候，我以为会是2012年 2012年的时候，我以为会是2013年 2013年的时候，我以为会是2014年 转眼过去三年了。 现在如果你再问我，我会说：不知道。也许三年之后又三年，三年之后又三年。 一些人的妥协 —— hybrid jquery mobile + phonegap canvas + canvas加速插件 + phonegap 我的顾虑 但 app store不让上架 和native app相比，虽开发成本可降低，但面向用户优势何在？ 这算是认输吗？改为native app做嫁衣？ 再论b/s结构优点 —— 免安装、升级透明、跨终端 不做敌人，不做家仆，做个互补的朋友 不以web app方式硬碰 不以hybrid方式服务 发挥免安装优势，以内嵌webview的方式做个合而不同的朋友 也许，这才是移动互联网时代，web的最佳出路 之前准备好的工程化问题概览 html5在GUI方案上的两个大分支 DOM 还是 Canvas，完全不同的两条路 html5的2d游戏引擎 核心部分 支持canvas和DOM两种不同模式 容器封装 事件封装 影片剪辑 碰撞检测 全局时间轴 调试 Loader … /js_demo/12/ 插件部分 —— A星寻路 /js_demo/18/ 插件部分 —— 2.5D /js_demo/19/ 插件部分 —— 2.5D结合A星寻路 /js_demo/20/ 插件部分 —— 向量运动 /js_demo/21/ /js_demo/22/ 插件部分 —— 物理引擎 /js_demo/23/ /js_demo/24/ /js_demo/25/ /js_demo/26/ 如何兼容不同终端的分辨率？ /js_demo/42/ 基于css的动画和3d /js_demo/43/ 基于js和canvas（webgl） 的动画和3d /js_demo/43/ 这个游戏需考虑和暴露出的问题 /js_demo/birdie_queue/ 【需考虑的问题】： 针对哪些终端？ 如何兼容不同终端的分辨率？ 是否要做离线缓存？ 开发模式基于Canvas还是DOM？ 【暴露出的问题】： 不同浏览器支持的声音格式不同 性能问题 厂商定制浏览器导制的碎片化问题 这个游戏需考虑和暴露出的问题 /g78