智能体刷屏的背后,是 AI 应用拐点的来临?AICon 北京站议程重磅公布,50+ 硬核分享不容错过 了解详情
写点什么

百度技术沙龙第 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:463709
用户头像

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

关注

评论

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

spring注入bean的几种策略模式

王德发

Java Spring Boot 测试驱动开发实战营

工程师、程序员和产品经理

王泰

程序员 产品经理 IT 软件工程师 工程师思维

【Howe学爬虫】全国统计用区划代码爬取

Howe

Java 爬虫

敏捷团队成员的工作量指标真的那么重要吗?

金生水起

敏捷开发 Scrum精髓 敏捷精髓 Agile

数据分析的利器-clickhouse概述

流沙

数据库 Clickhouse

何时开始重构?

Page

敏捷开发 重构

2020 敏捷产品基本盘

Yanel 说敏捷产品

产品 敏捷 产品设计 产品推荐

多多益善的MacOS文件管理方案

陈东泽 EuryChen

macos Mac apple 提升效率 文件管理

MySQL备份基础

一个有志气的DB

MySQL 数据

太赞了,VSCode 上也能画流程图了!

GitHubDaily

visual-studio GitHub 程序员 vscode 开发者工具

从ClickHouse的名字由来讲起

nauu

数据库 大数据 分布式 OLAP Clickhouse

Android | Tangram动态页面之路(一)需求背景

哈利迪

android

【大咖说问大咖】关于开源的那些事 —— PingCAP CTO 黄东旭 Q&A 交流帖

InfoQ写作社区官方

开源 写作平台 大咖说 技术交流 热门活动

Kafka零数据丢失的配置方案

奈学教育

kafka kafka配置 kafka数据

学习型组织的修炼之道

Yanel 说敏捷产品

团队管理 项目管理 敏捷 团队协作 组织转型

看完这篇操作系统,和面试官扯皮就没问题了

苹果看辽宁体育

操作系统 计算机基础

Serverless: 2020年函数计算的冷启动怎么样了

刘宇

KK日知录20200515

kimmking

用"结构性张力"构建自驱力

Yanel 说敏捷产品

团队管理 敏捷 团队协作 项目

近期工作的几点感想

Leiy

app退出登录

MySQL索引知识介绍

Simon

MySQL 索引结构

为什么我喜欢的大V拉黑我?

lmymirror

经历 后真相时代 日常思考

Intellij IDEA2020.x如何安装Lombok插件

龙眼果

开发者工具

Java实现Base64

Java

揭秘!开源软件背后的神秘组织

Apache Flink

大数据 flink 流计算 实时计算

BVR 才是变革的核心

Yanel 说敏捷产品

团队管理 项目管理 敏捷 敏捷开发 敏捷精髓

常见的主从报错集锦

一个有志气的DB

MySQL 主从配置 主从同步

搜商:高效的使用搜索引擎

石云升

高效搜索 搜索技巧 搜商

提升编程效率:重构

Page

高效工作 敏捷开发 重构 高效

原创 | 使用JUnit、AssertJ和Mockito编写单元测试和实践TDD (七)CORRECT边界条件

编程道与术

Java 编程 软件测试 TDD 单元测试

真的!只需 “六步” 实现图像特定物体识别!!!

攀岩飞鱼

Python OpenCV 计算机视觉 图像识别 物体检测

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