写点什么

百度技术沙龙第 30 期回顾:网页展示新技术实践(含资料下载)

  • 2012-09-17
  • 本文字数:2268 字

    阅读完需:约 7 分钟

在 9 月 15 日由 @百度主办、 @InfoQ 负责策划组织和实施的第30 期百度技术沙龙活动上,来自百度知识搜索部的资深前端研发工程师梁东杰《HTML5 Mobile Cookbook》一书的作者、 HTML5 Boilerplate 贡献者石川分别分享了各自在前端开发中的经验与实践,话题涉及“浏览器新技术在内容展现中的应用”,以及“JS Pattern 及 HTML5 Boilerplate 开发实践”等。本文将对他们各自的分享做下简单的回顾,同时提供相关资料的下载。

主题一:浏览器新技术在内容展现中的应用(下载讲稿

来自百度知识搜索部的资深前端研发工程师梁东杰第一个为大家分享,内容主要涉及 HTML5 的现状、目前遇到的问题、差异化解决方案和应用方式以及浏览器增强这几部分。梁东杰认为 HTML5 有比较光明的发展前景,对于 HTML5,他提到了如下新特性:

  • 语义特性
  • 本地存储特性
  • 设备兼容特性
  • 网页多媒体特性
  • 三位、图形以及特效特性
  • 性能与集成特性
  • CSS3 特性

这些新的特性有利于产品服务的改进和一些开发辅助,但是,由于当前国内低端浏览器(如 IE6 等)市场份额较大加之 HTML5 处于过渡阶段,目前对于 HTML5 的使用还需要面临一些问题。

对此,梁东杰分享了百度基于“差异化开发”的解决思路,允许浏览器之间存在功能和效果的不同,进而提升用户体验,所采用的技术主要有:

  • 优雅降级:向前以高端浏览器为基准
  • 渐进增强:退后以低端浏览器为基准

使用差异化技术主要保证了两个方面的一致性:

  1. 用户体验的一致性
  2. 面向未来,跟技术潮流的一致性

同时,对于差异化新技术的应用,梁东杰总结了一些关键点:

  • 团队 HTML5 技术普及
  • 团队成员的差异化意识
  • 渐进增强与优雅降级的使用
  • 加速 HTML5 应用条件成熟

梁东杰提到百度内部还通过浏览器增强的方式来提升低端浏览器对新技术的支持以及自动化兼容低端浏览器 bug 等,目前也已经开源了相关项目

主题二:JS Pattern 及HTML5 Boilerplate 开发实践(下载讲稿

《HTML5 Mobile Cookbook》一书的作者、 HTML5 Boilerplate 贡献者石川第二个为大家分享,话题主要设计涉及 JS Pattern 及 HTML5 Boilerplate 开发实践。

HTML5 Boilerplate 是由 Paul Irish(Google Chrome 开发人员、jQuery 项目成员、Modernizr 作者、yayQuery 播客主持人)主导的一个帮助快速建立健壮并且高适应性 Web 应用或网站的模板,其用户有 Google、Microsoft、NASA、Barack Obama、Nike 等等。

石川通过结合实例向大家介绍新版本 Boilerplate 的特点和使用,他提到了 Boilerplate 的一些主要特点:

  • 由 Paul Irish 首创的在 HTML 页面的 Body 上使用 IE 条件注释判断浏览器版本,从而大大简化了针对 IE Hack 的成本(在后来的版本中升级为在 标签中加入条件注释);
  • HTML5 集成,默认使用了很多 HTML5 的特性,并且使其兼容旧版本浏览器;
  • 大量针对服务器的默认配置,无需修改即可配置一个安全、标准的 Web 服务器;
  • 完整的 JS 调试机制 —— 即使在 IE 下;
  • 大量使用 CSS3 技术,并且集成了几乎所有来自框架中和技术大牛们口头相传的 CSS 技巧;
  • 为所有浏览环境做了优化,包括移动版本和打印版本;
  • 默认内置 Modernizr,可以检测浏览器对新特性的支持能力,方便针对旧版本浏览器优化

他还分享了提升技术人员技术敏感度和能力的心得:参与开源项目、加入项目的邮件列表,和项目的开发人员(不乏一些大师)直接交流。他提供了一些值得关注的 IRC:

  • #html5
  • #css
  • #javascript
  • #whatwg
  • #jquery
  • #yui
  • #dojo
  • #web
  • #bbg

Open Space(开放式讨论环节)

为了促进参会者与我们每期的嘉宾以及讲师近距离交流,深入探讨在演讲过程中的疑问,本次活动依然设置了 Open Space(开放式讨论)环节。

在 Open Space 的总结环节,几位话题小组长分别对讨论的内容进行了总结。

梁东杰:讨论了一些框架 CSS3 增强的实现原理、使用方法,并且探讨了 HTML5 应用的技术细节,通过介绍百度内容的一些项目来具体探讨。

石川:主要讨论了性能测试工具以及国内 IE6 大规模使用的情况下如何进行高效测试,同时还提到了一些新的开发方法,以及在不支持 HTML5 的浏览器上扩展实现。

曹雄峰:今天讨论了两个问题:第一,讨论浏览器能够成为 OS,所面临的三个问题:云计算、宽带、标准,第二,HTML5 成为跨平台语言所面临的问题等。

Jeff: 首先和大家讨论了 Ruby on Rails 的问题,以及如何使用一些 gem 来快速实现产品 API,然后分享了 LESS 等的使用感受。

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

antinomia #百度技术沙龙#怎么让低端浏览器也能展现高端浏览器才支持的特性呢?差异化开发是一个很好的思路

Tashgy #百度技术沙龙#百度梁 ne 童鞋分享~ 前端新技术差异化应用。html5 技术非常强大,但大部分功能和效果的实现依赖于高端浏览器。目前国内高端浏览器占比从低到高的过渡阶段,以差异化的思路可以让高端浏览器使用新技术获得较好的功能和效果,同时低端浏览器功能及展现不受影响。

晨昏树#百度技术沙龙# normallize css 确实思路比较独特,不像传统的css reset,而是为html5 标签补充缺失属性 我在: http://t.cn/zlPkaS8

泡面的烙饼 @百度技术沙龙 石川老师回答问题真的很细心,可以好好看看他讲的开源项目

李二栋 Star #百度技术沙龙#嘉宾介绍了国外的一些群来交流前端技术,那里有更多的大牛,包括 jquery 创始人,不一定依赖国内的 qq 群。

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

特别提示:第31 期百度技术沙龙将在10 月20 日,在北京举行,欢迎关注 @InfoQ @百度技术沙龙获取后续的活动信息。

2012-09-17 09:383071
用户头像

发布了 89 篇内容, 共 34.6 次阅读, 收获喜欢 4 次。

关注

评论

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

9.hooks源码(想知道Function Component是怎样保存状态的嘛)

全栈潇晨

源码分析 React React Hooks

通俗易懂!看了不会忘的网络面试知识点

编程 架构 面试

windows 搭建ftp服务

xiezhr

vsftpd ftp ftp服务 文件服务 3月日更

项目汇报会复盘

Geek_XOXO

关于写作的一点小想法「Day 13」

道伟

28天写作

从JVM底层原理分析数值交换那些事

秦怀杂货店

JVM 交换数值

程序员成长第十九篇:要不要转管理岗?

石云升

程序员 28天写作 职场经验 管理经验 3月日更

工作三年,小胖问我:什么是生产者消费者模式?菜到抠脚!

一个优秀的废人

Java 多线程 阻塞队列 生产者与消费者

Elasticsearch Analyzer 分词器

escray

elastic 七日更 28天写作 死磕Elasticsearch 60天通过Elastic认证考试 3月日更

AI数学基础之:概率和上帝视角

程序那些事

人工智能 AI 程序那些事 概率论

《精通比特币》学习笔记(第二章)

棉花糖

区块链 读书笔记

Java的锁

并发编程

迎战大厂!“金三银四”和春招通过率达95%的Java面试要点集锦

Java 程序员 架构 面试

2021抖音面经分享:Java进阶核心知识集/算法刷题宝典(金三银四必备)

比伯

Java 编程 架构 面试 程序人生

聊聊我对SCRM的理解

boshi

CRM 七日更

翻译:《实用的Python编程》03_05_Main_module

codists

Python

MySQL数据库DDL、DML详解

若尘

MySQL

无线网络的用户隔离功能

MySQL数据库的安装与使用

若尘

MySQL 数据库

科技强国梦的百度式注脚:扎根土壤、拥抱变局、眺望星空

脑极体

Kubelet从入门到放弃系列:GPU加持

DCOS

AI gpu Kubernetes 云原生

2021程序员春招必备:Java面试知识点+答案(7大分类 5000字解析)

比伯

Java 编程 架构 面试 程序人生

不知不觉不假思索——可供性

Justin

心理学 28天写作 游戏设计

Wireshark数据包分析学习笔记Day1

穿过生命散发芬芳

Wireshark 数据包分析 3月日更

【回溯算法】经典题:求目标和的组合方案 ...

宫水三叶的刷题日记

面试 LeetCode 数据结构与算法

dubbo 源码 v2.7 分析:通信过程及序列化协议

程序员架构进阶

架构 RPC 七日更 dubbo源码 3月日更

Elasticsearch Index Management 索引管理

escray

elastic 七日更 28天写作 死磕Elasticsearch 60天通过Elastic认证考试 3月日更

聊聊园区网中的专网架构

冯骐

运维 网络 VRF 虚拟路由表

(28DW-S8-Day13) 在线教育班型和角色

mtfelix

28天写作

三十而已

ES_her0

28天写作 3月日更

Nydia

百度技术沙龙第30期回顾:网页展示新技术实践(含资料下载)_Ruby on Rails_水羽哲_InfoQ精选文章