AI 年度盘点与2025发展趋势展望,50+案例解析亮相AICon 了解详情
写点什么

百度技术沙龙第 27 期回顾:HTML5 之美(含资料下载)

  • 2012-06-17
  • 本文字数:2119 字

    阅读完需:约 7 分钟

在 6 月 16 日由 @百度 主办、 @InfoQ 负责策划组织和实施的第27 期百度技术沙龙活动上,来自百度高级工程师,用户体验研究平台技术负责人王集鹄( @王集鹄 ),街旁前端工程师齐伟( @hustkiwi )分别分享了各自在 HTML5 技术实践上取得的成果及经验,话题涉及“HTML5 中的图形图像处理”,以及“应用 HTML5 搭建街旁新版混合式 iOS 客户端”等。本文将对他们各自的分享做下简单的回顾,同时提供相关资料的下载。

主题一:HTML5 中的图形图像处理微盘下载讲稿 Demo 下载

来自百度高级工程师王集鹄第一个为大家分享,本次演讲主要对 HTML5 中 Canvas 和 SVG 矢量图的使用经验以及对曲线变化进行了研究,并通过丰富的 Demo 与参会者分享了一些综合应用。王集鹄首先分享了来自 ie6countdown.com 上的一份数据,数据表明:

目前,全球范围内,IE6 使用比重最多的国家就是中国,占到了 22.4% 的比重。然而其他国家的占比则非常小,占比在 1% 以下。

接下来王集鹄分别通过老虎的实例说明了 SVG 缩放时不失真的特点,还演示了 SVG 动画、Path 和路径编辑器、Canvas 热力图、贝塞尔曲线等精彩的示例。此外,还对 2012 年春节时,百度首页的舞龙效果进行了技术分享,最后,王集鹄对本次的分享进行了总结:

  • HTML5 发展现状
  • SVG 两种加载方式
  • Canvas 的像素处理,包括二进制存储
  • Canvas 动画原理、性能、时间轴
  • SVG Path 辅助工具——路径编辑器
  • 贝赛尔曲线两个公式:计算轨迹、切分曲线
  • SVG+ 前端模版组合
  • Canvas 中绘制 SVG
  • 更多精彩内容和演示代码请参考讲稿和 Demo。

    主题二:应用 HTML5 搭建街旁新版混合式 iOS 客户端微盘下载讲稿

    街旁前端工程师齐伟第二个为大家分享,混合式应用(Hybird App)继承了方便调用原生接口操控底层 API 与应用 HTML5 前端技术快速开发的优点。随着移动设备硬件的提升,成为一种可行的应用开发架构趋势。在街旁新版 iOS 客户端“街旁 5”中,对应用 HTML5 搭建混合式应用进行了大胆实践,并积累了一些有关混合式应用开发、架构和优化相关的宝贵经验。齐伟首先引用了 Steve Jobs 的话开场:

    New open standars created in the mobile era,such as HTML5,will win on mobile devices.

    在提到为什么采用 Hybrid 方式时,齐伟提到:

    • IOS 开发资源不足
      很难招到有经验的 iOS 开发者,维护成本较大
    • 需要更快的开发迭代
      引入界面及交互上的 AB Test;绕过 Apple Store 发布流程的 Bugfix

    接下来讲解了 Native 和 WebView 的相互调用方法,并针对使用 Backbone.js 给出了使用建议:

    1. API 应严格遵循 RESTful JSON 接口规范
    2. 避免在不被销毁的标签上绑事件
    3. 统一捕获跳转事件

    最后,齐伟还谈到了在使用 LocalStorage 中所遇到的挑战:

    1. 是同步的,会阻塞网络
    2. 对 I/O 有操作,时间不可控
    3. 有大小限制,甚至在内存吃紧时会丢数据

    Open Space(开放式讨论环节)

    和以往的环节一样,​为了让参会者能够有更多的时间进行相互的交流,本次活动依然设置了 Open ​Space(开放式讨论)环节。除了讲师王集鹄、齐伟外,Storm 团队 @含冰、@Mr.Null,蒸汽猛犸团队张振熙也参与了小组讨论。在 Open Space 的总结环节,几位话题小组长​分别对讨论的内容进行了总结。

    王集鹄:主要讨论了 HTML5 目前的应用情况,以及性能优化的技术细节。

    齐伟:主要讨论了通过 Hybrid 的方式,可以借助 HTML5 对于原生 API 的开发支持,但同时在应用和性能方面还有提升的空间,但一致认为这是未来应用开发的趋势。

    MR.NULL:主要讨论了如何基于 Canvas 原生事件对层进行捕获,模拟原生 DOM 响应的问题以及动画相关的话题讨论。

    张振曦:向大家揭示了“别碰我的妞儿”游戏,是如何在 30 小时内设计和开发出来的。技术层面,一起讨论了粗粒度刷新、细粒度刷新等相关问题。

    会后,一些参会者也通过新浪微博分享了他们的参会感受:​​

    @破车推荐 @hustKiwi 老师 PPT 的 Transition 效果是世界级的。

    @李二栋 Star :主题是 html5 之美,的确是好活动。百度有很大影响力,活动吸引了很多技术大牛和爱好者,从中能了解很多有意义的信息。还好我今天去基本能听懂大思路,因为前段时间看完前端的一本书,有了基础。

    @蒋宇捷:第二个演讲里提到的,关于 Linkedin iPad Web 版本的优化方式,我也正好有过相关的文章《 用 HTML5 实现 iPad 应用无限平滑滚动 》: http://t.cn/zOHNB4o

    @做自己的心理丶医生 v :在#百度技术沙龙#听到了第一个干货, 用 HTML5 加 Object-C 开发 app 实在是太不友好了。

    有关百度技术沙龙的更多信息,可以通过新浪微博关注 ** @百度技术沙龙,或者加入百度技术沙龙微群 **,InfoQ 上也总结了过往 26 期所有百度技术沙龙的演讲视频和资料等,感兴趣的读者可以直接浏览阅读

    特别提示:2012 百度开发者大会全国巡讲终点站——上海站,免费报名参加,活动将于 6 月 21 日(本周四)进行,特别邀请到上海改变科技有限公司 CTO 李亮分享《移动应用技术开发路线选择》的话题,敬请关注。

    李亮目前致力与移动计算与云计算方向,他还是 iOS 第一个输入法 iCosta for iPhone 以及 RockPlayer for Android 的主要开发者之一。RockPlayer 是 Android 平台上全球最成功的媒体播放工具,受到了广大用户的好评,目前为止累计下载数量大概在三千万左右。最新推出的 iOS 平台上的演讲工具 AirSlides。

2012-06-17 21:463497
用户头像

发布了 156 篇内容, 共 51.4 次阅读, 收获喜欢 7 次。

关注

评论

发布
暂无评论
发现更多内容

Java程序员必备框架—Spring全家桶的前世今生详细梳理

北游学Java

Java spring

SpringBoot自动配置原理解析

程序员阿杜

spring Boot Starter

咔嗒回收系统小程序开发

ALVIS

阿里云视频云发布实时高清VVC编码器Ali266,真正开启VVC商用之路

阿里云视频云

阿里云 视频编码 视频处理 编码器 视频云

家政公司管理系统开发介绍

ALVIS

大厂面试真题——Netty/IO篇,你能答上来几道?

Java架构师迁哥

Using side features: feature preprocessing

毛显新

自然语言处理 深度学习 tensorflow 推荐系统 keras

WorkPlus高端制造业数字化解决方案—首发集团

WorkPlus

开源 企业 即时通讯 移动开发

WorkPlus高端制造业数字化解决方案—科达洁能

WorkPlus

开源 企业 解决方案 即时通讯

瞥一瞥AI,撩一撩算法

博文视点Broadview

跑跑回收系统小程序开发

ALVIS

LeetCode题解:61. 旋转链表,双指针,JavaScript,详细注释

Lee Chen

算法 大前端 LeetCode

绿色篮子系统开发是什么模式?

ALVIS

绿地回收系统开发|现成小程序

ALVIS

Erda 1.1 版本发布|3 大亮点特性最新解读

尔达Erda

开源 云原生 k8s PaaS SaaS

来吧!一文写清前端面试难点及考点

前端依依

面试 大前端 经验总结

CloudQuery v1.4.1 发布 | 开放「组织架构」模块 API

BinTools图尔兹

数据库 数据安全 OpenAPI 数据库管控

ElasticJob 3.0.0:打造面向互联网生态和海量任务的分布式调度解决方案

SphereEx

数据库 开源

IDEA http client无法解析enviroment file

crazylle

IDEA http client Alibaba Cloud Toolkit

医院预约管理系统开发

ALVIS

正式发布!中国信通院联合腾讯安全等起草单位,共同发布研发运营安全工具系列标准

腾讯安全云鼎实验室

云计算 中国信通院 安全工具系列标准

大数据实战训练营Hbase作业

Clarke

绿森林回收系统小程序开发

ALVIS

万能小哥系统开发是什么?

ALVIS

RocketMQ事物消息调研

crazylle

RocketMQ 事物消息

新工具上线!sdkmgr命令行助力流水线构建

科技汇

女巫面具系统模式开发

ALVIS

互联网大厂一手资料,25大专题,500多页,背废你就能吊打面试官

Java架构师迁哥

企业管云就用行云管家!省时省力省心!

行云管家

云计算 企业上云 行云管家 企业管云

本夕生活小程序定制开发

ALVIS

好慷在家系统开发前景

ALVIS

百度技术沙龙第27期回顾:HTML5之美(含资料下载)_JavaScript_贾国清_InfoQ精选文章