浏览器与HTML5小谈.docx
- 文档编号:30314779
- 上传时间:2023-08-13
- 格式:DOCX
- 页数:11
- 大小:33.16KB
浏览器与HTML5小谈.docx
《浏览器与HTML5小谈.docx》由会员分享,可在线阅读,更多相关《浏览器与HTML5小谈.docx(11页珍藏版)》请在冰豆网上搜索。
浏览器与HTML5小谈
浏览器与HTML5小谈
金怡爱
提^纲
•浏览器介绍
•Webkit介绍
•HTML5
>HTML5历史与设计原理
>HTML5的新特性
>HTML5的发展状况
弓刘览器的价值…
•抢占桌面->用户习惯养成->抢占用户->产生效益
•实现业务定制
•作为云的接入或展现
弓对览器的分类—
•代理模式
由后端服务器负责对互联网内容进行重排版、适配、压缩,然后再组织成特殊的格式发送给浏览器客户端,浏览器客户端向用户展示。
•直连模式
终端直接访问源站点
■UCWEB
■3GGo
■星际浏览器
■OperaMini
■马赫浏览器
■skyfire
■Chrome/Safari/FireFox/IE
■在嵌入式浏览器领域,对内核有较强研发能力的,国外也就是Opera,Ant,Enreach等几家。
国内主要是茁壮和飞漫
■国内不少浏览器都是采用“套壳”方式来实现的,即直接调用平台自身的浏览器内核
四大浏览器内核
•Trident(IE,Maxthon)•Gecko(MozillaFirefox,Netscape,MozillaSuite,SeaMonkey,MozillaThunderbird)
•WebKit(Safari,Chrome,chromium)•Presto(Opera)
噸J览器的测试集…
•HTML兼容性测试
AcidX
•JavaScript性能测试
SunSpider/jsTimeTest
GoogleV8Benchmark/MozillaKraken
CelticKane测试组件
•综合性能测试
3DMark公司的Peacekeeper
•TML5组件测试
GUIMark2(绘图,游戏,文本)/微软的Mr.PotatoGun,MozillaHardwareStressTest/AsteroidsCanvas2Do
提^纲
•浏览器介绍
•Webkit介绍
•HTML5
>HTML5历史与设计原理
>HTML5的新特性
>HTML5的发展状况
WebKit的历史
•浏览器介绍
•基于早期KDE项目的KHTML组件发展而来
.2005年AppIe成立开源项gWebKit
•Apple基于WebKit建立自己的浏览器Safari•2008年Google发布自己基于WebKit的浏览器Chrome
•后续Google发展了安卓系统,浏览器核心也是WebKit
•国内外很多杂牌浏览器发展了基于Trident核心和WebKit核心的多核心浏览器
WebKit分枝
•Safari(http:
〃www.webkit•org/)
•Android/Chrome(chromium)
•Qtwebkit
Windows下编译Safari版本
■安装VS2005teamsuite(建议英文版)
■安装VS2005TeamSuiteServicePack1
■如果是VistaAVindow7安装SP1updateforvista
■安装vs2005的4个升级包:
KB918559/KB935225/KB943969/KB947315
■安装DirectXSDK和quicktimeSDK
■安装cgwin
■下载WebKitS叩portLibrary.zip,放到WebKit根目录下(无需解压)
■设置环境变量WEBKITLIBRARIESDIR和
WEBKITOUTPUTDIR
■运行update-webkit和update-webkit-support-libs两个脚本■编译整个解决方案
WebKit组成
•Webcore
•jscore•Webkit/webkit2
提^纲
•浏览器介绍
•Webkit介绍
•HTML5
>HTML5历史与设计原理
>HTML5的新特性
>HTML5的发展状况
HTML5的历或
■草案Q993/6)
■HTML2.0(1995/ll)
■HTML3.2(1996/1/14)
■HTML4.0(1997/12/18)
■HTML4.01(1999/12/24)
■XHTML1.0(2000)sXHTML1.1(2OO1)
■XHTML2.0:
未完成时就胎死腹中
■HTML5
•WHATWG(2004)[Opera->Google:
伊恩•希克森]->HTML5工作组
•W3C->HTML5
XHTML2.0美竅
因为它违反了著名的伯斯塔尔法则(Posters
Law):
发送时要保守;接收时要开放。
g总部原鲤
•支持已有的内容•解决现实的问题
HTML5致力于解决过去HTML不支持而又为用户所接纳的习惯。
HTML5设计原鲤
•求真务实
HTML5中新的语义元素就是遵循求真务实原理的反映。
•平衡退化
渐进增强的另一面就是平稳退化,HTML5确保新增的元素在不能被识别时,仍然可以为浏览器所正确处理。
•最终用户优先
»—旦遇到冲突,最终用户优先,其次是作者,其次是实现者,其次标准制定者,最后才是理论上南完满。
A首先为人类设计,其次为机器设计。
,简化最常见的任务,让不常见的任务不至于太麻烦。
只为80%设计。
给内容创建者最大的权利。
00
默认设置智能化。
提^纲
•浏览器介绍
•Webkit介绍
•HTML5
>HTML5历史与设计原理
>HTML5的新特性
>HTML5的发展状况
■Canvas以及3D显示效果(WebGL)、SVG
■多媒体(Video/audio)
■CSS3样式
■离线及本地存储(AppCache,本地存储,IndexedDB
等等)■通信相关(WebSockets/WebWorkers等)■语义性(Microdata微数据等等)■特征检测
■设备功能(取得地理位置信息等等)
canvas
■HTML5canvas提供了通过JavaScript绘制图形的方法
■通过webGL接口在canvas元素当中产生交互的3D图形
svC与动茴
•采用SVG规范中定义的动画元素(〈animate〉,
•采用SVGDOMo
•采用SMIL
•HTML5对于音视频分别定义了新的元素:
vvideo>,
•HTML5支持不需要插件的视频'音频业务,可以同时指定多个音视频文件,其中第一个可以作为推荐性的文件,•由于不同浏览器提供不同的外观控制栏,HTML5提供一种公共的、集成的、以及基于脚本的多媒体处理机制。
Video
videowidth="320〃
height=〃240”controls="controls">
II•II
•WebStorage>localStorage>sessionStorage
•WebSQLDatabase
•IndexedDBo
•webworkers•websockei•N2.一f-ca-ons
而ML5的特征检颈厂
检测了浏览器是否在支持一个特定的HTML5特性有四种基本的技术,由简入繁依次是:
1、检测全局对象(诸如window或者nagivator)是否支持题特定的属性
2、创建一个元素,然后检测该元素是否存在特定的一些属性
3、创建一个元素,然后检测这个元素上是否存在
特定的方法,同时调用这个方法了检查它的返回值
4、创建一个元素,给这个元素设定HTML5特有的
属性,然后检査浏览器是否保留了该属性值
二W备功能一—
HTML5提供了一组API用来获取用户的地理位置
Geolocation是GeolocationWorkGroup制定的标准,
用户可以接受或者拒绝为Web应用提供自己位置信息的获取和访问
WebVTT一个简单的文件格式正在WHATWG开发,名为WebVTT(网络视频文字频道),被考虑纳入HTML5的标准和实施,作为Web浏览器本身的一个HTML5元素。
该文件格式可根据章导航和元数据为HTML5视频提供标题,字幕和脚本说明,它还能利用国际标准(il8n),支持各种格式的选项。
WOFFWeb开放字体格式WOFF(WebOpenFontFormat)的出现,使精排版可以真正将文字作为网页来使用,而不是图像。
提^纲
•浏览器介绍
•Webkit介绍
•HTML5
>HTML5历史与设计原理
>HTML5的新特性
AHTML5的发展状况
芽客厂家对印nvrig
•Opera/Firefox
•Apple
•Facebook•Adobe
•微软
■开发工具
>IBMMaqetta
A微软Visualstudio/ExpressionWeb4
>AdobeCS以及HTML5Pack、Wallaby
>Gordon>Swiffy
>OnlineCSS3Maker>TumulthypeAnimation)■开发框架
SenchaTouch、iUI、jQTouch、jQueryMobile>
iWebKit(主要针对Apple设备)、SproutCore>Joshfireo■其它工具
NitobiPhoneGap>Appcelerator的Titanium、
Rhodes
■硬件加速能力有待提咼
■终端浏览器支持的成熟度有待提高
■开发工具太少
■对多媒体支持不够
■音视频编码格式不统一
■硬件加速能力有待提咼
■终端浏览器支持的成熟度有待提高
■开发工具太少
■对多媒体支持不够
■音视频编码格式不统一
提^纲
•浏览器介绍
•Webkit介绍
•HTML5
>HTML5历史与设计原理
>HTML5的新特性
>HTML5的发展状况
>HTML5与flash的一些对比
Flash成功的原因
■内部原因:
>把握住了RIA这一正确的方向
»提供了完善的开发工具
»上层开发接口统一,跨浏览器平台好(只要支持flash插件都能运行)
■外部原因:
AW3C选择了错误的XHTML方向,导致标准长期停滞不前。
»浏览器厂商没有把握住RIA这一正确方向
A浏览器厂商对标准支持不好,导致跨平台存在障碍,也无法提供友好的开发工具。
•Open的统一是有代价的
•封闭私有未必一无是处
•JavaScript诟病甚多
推荐
•HTML的发展历史(JeremyKeith)•HTML5设计原理(JeremyKeith)•HTML5揭秘(MarkPilgrim)•HTML5高级程序设计
•搅搅HTML5视频这滩浑水(riobard)•关于Flash的思考(乔布斯)
•JanOzer关于flash与html5耗电的测试
欢迎多多交流
Email:
新浪微博:
Thanks!
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 浏览器 HTML5