webki引擎分析介绍-v0.2.ppt

WebKit的JavaScript引擎简介基于Webkit-r29753,腾讯研究院无线中心/无线浏览器组周晓波（xiaobozhou）2009.11.2,WebKit代码阅读之：,提纲,Web系统JavaScript引擎DOMDOM标准WebKit的实现WebKit宿纳JavaScript引擎,Web系统,目的显示和编辑远程数据起源Hypertext系统+Internet发展静态-动态-Ajax概述结构和功能,Hypertext系统的例子：emacs的info子系统,格式化文档,Web服务器,因特网,浏览器,数据库,CGI程序,Form,XMLHttpRequest,Web系统之概述,服务器端静态到动态再到webservice的发展cgi架构的发展客户端，即浏览器功能获取和显示远程数据，提供一定的编辑能力结构获取远程数据可能分多次获取解析理解远程数据的结构(structure)渲染生成远程数据的“样子”布局/显示计算远程数据元素的位置并画在屏幕上,提纲,Web系统JavaScript引擎DOMDOM标准WebKit的实现WebKit宿纳JavaScript引擎,JavaScript引擎,脚本语言JavaScript引擎脚本化/脚本嵌入,JavaScript引擎之脚本语言,脚本（Script）指示“演员”行为的“指令”。脚本语言指示“解释器”行为的“指令”理解：巨大的入口参数更高层次的库调用有语法结构的配置文件.,操作系统内核,脚本解释器,动态库,操作系统内核,可执行程序,动态库,脚本,一般可执行程序和脚本程序的执行过程对比：前者直接是机器码，后者是文本，需要脚本解释器来解析和执行。脚本和脚本解释器之间的关系：站在脚本程序的角度来看，脚本解释器就是执行平台；站在脚本解释器的角度看，脚本程序就是执行时所需的参数。,JavaScript引擎之JavaScript引擎(1/),JavaScriptECMAScript的一种“方言”其他“方言”：JScript、ActionScript、DMDScript等JavaScript引擎解释执行JavaScript语言有多种实现：V8、SpiderMonkey、Rihno、TraceMonkey、SquirrelFish等,EMCAScript标准中的类型,EMCAScript标准中内建对象（类）,JavaScript引擎之JavaScript引擎(2/),区分语言本身和库JavaScript和DOMdocument.getElementById()就像C语言和libcprintfC语言通过link和load来真正操作printfJavaScript通过绑定（binding）来操作document.getElementById(),JavaScript引擎之JavaScript引擎(3/),WebKit的JavaScript引擎以下内容基于WebKit-r29753，现在改动很大基本结构：对象模型：TypeC+类内存管理：JSCell为内存管理接口面向对象：JSObject是面向对象机制的实现层（在对象模型中一并阐述）,JavaScript引擎之JavaScript引擎(3/),语法树对象模型类型对象类型：即继承自JSObject的C+类其他原生类型实现机制属性表原型链用C+实现JavaScript引擎C+类和JavaScript类对应创建一个JavaScript对象，在底层也创建了一个C+对象不是严格的,Objecttype是一种类型，和整型等一样,x=y+z,document.cookie=stry+strz,=,.,document,cookie,+,stry,strz,PropertyMap,JSObject,_proto,_prop,JSObject,_proto,_prop,PropertyMap,JSObject,_proto,_prop,属性表和原型链这是C+类的实现,JavaScript引擎之JavaScript引擎(3/),举例vara=A();alert(a.p1);varb=a.func1();原型链的作用在JavaScript层面实现继承属性表的作用存储和操作对象的属性和方法,那类的属性呢？如static,d()-functionPrototype=newFunctionPrototype(exec);d()-objectPrototype=newObjectPrototype(exec,d()-functionPrototype);d()-functionPrototype-setPrototype(d()-objectPrototype);d()-arrayPrototype=newArrayPrototype(exec,d()-objectPrototype);d()-URIErrorConstructor=newNativeErrorImp(exec,d()-functionPrototype,d()-URIErrorPrototype);d()-functionPrototype-put(exec,exec-propertyNames().constructor,d()-functionConstructor,DontEnum);d()-objectPrototype-put(exec,exec-propertyNames().constructor,d()-objectConstructor,DontEnum|DontDelete|ReadOnly);,JavaScript引擎之JavaScript引擎(3/),一个问题：如何创建对象如：var=A();全局对象JSGlobalobject对象其实就是JavaScript的执行环境,PropertyMap,JSObject,_proto,_prop,JSObject,_proto,_prop,PropertyMap,JSObject,_proto,_prop,JSObject,_proto,_prop,全局对象的属性表里含有所有类型的创建函数,JavaScript引擎之JavaScript引擎(4/),内存管理只管理对象本身即JavaScript对象，或原生类型（primitivetype）的值对应的内存如何申请和释放。以JSCell为接口，即内存管理只认识JSCell全局管理，即只有一个内存管理器关键是生存期的确定局部/全局作用域JavaScript对象本身不维护引用关系通过mark机制来确定不能回收的对象通过语法关系来确定通过其绑定的应用程序来确定显式维护一个（或几个）集合来确定,内存管理器,处于protect集合里，mark之,处于当前栈中mark之,其他，不mark,每次new会触发这个操作，还有其他很多地方也会触发,JavaScript引擎之JavaScript引擎(4/),总结一下：属性表成员变量和成员函数原型链类成员以及父类成员全局对象携带所有类型的创建函数内存管理基于mark如何mark是难点继承的实现原型链（还有其他形式）JavaScript的继承是程序员的事,JavaScript引擎之脚本化/脚本嵌入(1/),脚本引擎解释执行脚本语言的程序脚本化把应用程序作为脚本引擎的一部分脚本嵌入把脚本引擎作为应用程序的一个模块绑定机制脚本化/脚本嵌入都需要绑定机制来实现,JavaScript引擎之脚本化/脚本嵌入(1/),JavaScript引擎的绑定机制（binding）基本思想：通过扩展解释器来扩展JavaScript的功能属性表和原型链是根本典型步骤继承JSObject定义自己的原型类（也是继承JSObject）构造自己的属性表向全局对象的属性表表中注册创建函数结果可以varb=MyObj();其实就是增加了解释器的内建类,提纲,Web系统JavaScript引擎DOMDOM标准WebKit的实现WebKit宿纳JavaScript引擎,DOM,DOM标准介绍WebKit的DOM实现介绍,DOM之DOM标准(1/),DOM（DocumentObjectModel）源起解析html后得到结构化的信息如何保存如何访问并对外部提供接口（外部主要是JavaScript）标准化如果这个信息对外提供的接口很多样化绑定JavaScript引擎时该如何做？JavaScript程序员如何做？不只是JavaScript,DOM之DOM标准(1/),DOM标准定义了一个数据结构级别Level1，2，3内容CoreViewsEventsStyleTraversalandRangeHTMLLoadandSaveValidation,DOM之DOM标准(1/),CoreDOMException,ExceptionCodeDOMImplementationDocumentFragment,DocumentNode,NodeList,NamedNodeMapCharacterDataAttr（继承自Node但是不属于DOM树）Element（继承自Node）Text,Comment,DOM之DOM标准(1/),Events捕捉和冒泡注册ListenerEventTarget,EventListenerEvent,EventException,EventExceptionCode,DOM之DOM标准(1/),StyleStyleSheet和CSSStyleSheetStyleSheet,StyleSheetList,MediaListLinkStyle,DocumentStyleCSSCSSStyleSheet,CSSRuleList,CSSRule,CSSStyleRule.,DOM之DOM标准(1/),TraversalandRangeTraversalNodeIterator,NodeFilter,TreeWalkerRangeRange,DOM之DOM标准(1/),HTML每一个HTML标签都对应一个继承自Element的类,DOM之WebKit的DOM实现,基于WebKit-r38240DOM的实现解析构建DOM树CSS解析CSS存储Render过程构建Render树,DOM之WebKit的DOM实现,解析源文档有HTMLTokenizer类和HTMLParser类实现是一个状态机解析过程会产生子资源的下载任务可能等待（如JavaScript子资源）容错是难点处理的是已经解码好的源文件构建DOM树,body,form,input-selfclose,form-end,body-end,DOM之WebKit的DOM实现,CSS的解析解析成一条条规则放到CSSStyleSheet（继承自StyleSheet）中HTMLStyleElement、HTMLLinkElement中包含了CSSStyleSheet这些节点（Node）被放到变量Document:m_styleSheetCandidateNodesCSS的存储解析之后，Document把所有StyleSheet组合起来RefPtrm_styleSheets;,DOM之WebKit的DOM实现,创建Render树首先通过所有的CSS规则，创建每个元素的RenderStyleRenderStyle描述了这个元素的样式根据RenderStyle创建RenderObject和元素对应并把RenderObject构建成树状RenderObject类族和DOM类族不是一一对应但是Render树和DOM树是一一对应的,DOM之WebKit的DOM实现,提纲,Web系统JavaScript引擎DOMDOM标准WebKit的实现WebKit宿纳JavaScript引擎,WebKit宿纳JavaScript引擎,宿纳（Host）即招待，WebKit用DOM来招待JavaScript引擎基本方法绑定方案绑定只是一种机制如何绑定才是难点,WebKit宿纳JavaScript引擎,绑定为每个DOM类在JavaScript引擎中实现JSObject类DocumentJSDocument用脚本生成h/cpp文件分裂对象模型DOM中的对象和JavaScript对象对应例如document.xxx会在全局对象JSDOMWindow的属性表里找“document”，然后找到对应的JSDocument对象但是大部分DOM对象对应的JavaScript对象是按需创建的，由toJs全局函数来实现,WebKit宿纳JavaScript引擎,JSXxxx类的一般形式一个指向DOM对象的引用指针m_impl由静态变量指向的初始属性表向全局对象注册（其实不需要，因为是static）,WebKit宿纳JavaScript引擎,在JavaScript中访问DOM基本思想：JSXxxx对象的成员变量m_imp