`
damengjiejie
  • 浏览: 9847 次
  • 性别: Icon_minigender_1
  • 来自: 北京
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

深入了解webkit内核第一篇:JavaScript引擎深度解析

 
阅读更多

   看到HorkeyChen写的文章《[WebKit] JavaScriptCore解析--基础篇(三)从脚本代码到JIT编译的代码实现》,写的很好,深受启发。想补充一些Horkey没有写到的细节比如字节码是如何生成的等等,为此成文。

      JSC对JavaScript的处理,其实与Webkit对CSS的处理许多地方是类似的,它这么几个部分:

(1)词法分析->出来词语(Token);

(2)语法分析->出来抽象语法树(AST:Abstract Syntax Tree);

(3)遍历抽象语法树->生成字节码(Bytecode);

(4)用解释器(LLInt:Low Level Interpreter)执行字节码;

(5)如果性能不够好就用Baseline JIT编译字节码生成机器码、然后执行此机器码;

(6)如果性能还不够好,就用DFG JIT重新编译字节码生成更好的机器码、然后执行此机器码;

(7)最后,如果还不好,就祭出重器--虚拟器(LLVM:Low Level Virtual Machine)来编译DFG的中间表示代码、生成更高优化的机器码并执行。接下来,我将会用一下系列文章描述此过程。

      其中,步骤1、2是类似的,3、4、5步的思想,CSS JIT也是采用类似方法,请参考[1]。想写写JSC的文章,用菜鸟和愚公移山的方式,敲开JSC的冰山一角。

本篇主要描述词法和语法解析的细节。

 一、 JavaScriptCore的词法分析器工作流程分析

    W3C是这么解释词法和语法工作流程的:

 词法器Tokenizer的工作过程如下,就是不断从字符串中寻找一个个的词(Token),比如找到连续的“true”字符串,就创建一个TokenTrue。词法器工作过程如下:

JavaScriptCore/interpreter/interpreter.cpp:
template <typename CharType>

 

[cpp] view plaincopy在CODE上查看代码片派生到我的代码片
 
  1. template <ParserMode mode> TokenType LiteralParser<CharType>::Lexer::lex(LiteralParserToken<CharType>& token)  
  2. {  
  3.     while (m_ptr < m_end && isJSONWhiteSpace(*m_ptr))  
  4.         ++m_ptr;  
  5.    
  6.     if (m_ptr >= m_end) {  
  7.         token.type = TokEnd;  
  8.         token.start = token.end = m_ptr;  
  9.         return TokEnd;  
  10.     }  
  11.     token.type = TokError;  
  12.     token.start = m_ptr;  
  13.     switch (*m_ptr) {  
  14.         case '[':  
  15.             token.type = TokLBracket;  
  16.             token.end = ++m_ptr;  
  17.             return TokLBracket;  
  18.         case ']':  
  19.             token.type = TokRBracket;  
  20.             token.end = ++m_ptr;  
  21.             return TokRBracket;  
  22.         case '(':  
  23.             token.type = TokLParen;  
  24.             token.end = ++m_ptr;  
  25.             return TokLParen;  
  26.         case ')':  
  27.             token.type = TokRParen;  
  28.             token.end = ++m_ptr;  
  29.             return TokRParen;  
  30.         case ',':  
  31.             token.type = TokComma;  
  32.             token.end = ++m_ptr;  
  33.             return TokComma;  
  34.         case ':':  
  35.             token.type = TokColon;  
  36.             token.end = ++m_ptr;  
  37.             return TokColon;  
  38.         case '"':  
  39.             return lexString<mode, '"'>(token);  
  40.         case 't':  
  41.             if (m_end - m_ptr >= 4 && m_ptr[1] == 'r' && m_ptr[2] == 'u' && m_ptr[3] == 'e') {  
  42.                 m_ptr += 4;  
  43.                 token.type = TokTrue;  
  44.                 token.end = m_ptr;  
  45.                 return TokTrue;  
  46.             }  
  47.             break;  
  48.         case '-':  
  49.         case '0':  
[cpp] view plaincopy在CODE上查看代码片派生到我的代码片
 
  1. <span style="font-family: Arial, Helvetica, sans-serif;">经过此过程,一个完整的JSC世界的Token就生成了。然后,再进行语法分析,生成抽象语法树.</span></span>  

 



UString Parser<LexerType>::parseInner()

 

[cpp] view plaincopy在CODE上查看代码片派生到我的代码片
 
  1. {  
  2.     UString parseError = UString();  
  3.        
  4.     unsigned oldFunctionCacheSize = m_functionCache ? m_functionCache->byteSize() : 0;  
  5.        
  6.         //抽象语法树Builder:  
  7.     ASTBuilder context(const_cast<JSGlobalData*>(m_globalData), const_cast<SourceCode*>(m_source));  
  8.     if (m_lexer->isReparsing())  
  9.         m_statementDepth--;  
  10.     ScopeRef scope = currentScope();  
  11.        
  12.         //开始解析生成语法树的一个节点:  
  13.     SourceElements* sourceElements = parseSourceElements<CheckForStrictMode>(context);  
  14.     if (!sourceElements || !consume(EOFTOK))  

 


         举例说来,根据Token的类型,JSC认为输入的Token是一个常量声明,就会使用如下的模板函数生成语法节点(Node),然后放入ASTBuilder里面:

    接下来,就会调用BytecodeGenerator::generate生成字节码,具体分下节分析。我们先看看下面来自JavaScript的一个个语法树节点生成字节码的过程:

JavaScriptCore/bytecompiler/NodeCodeGen.cpp:
RegisterID* BooleanNode::emitBytecode(BytecodeGenerator& generator, RegisterID* dst)

 

第一时间获得博客更新提醒,以及更多技术信息分享,欢迎关注个人微信公众平台:程序员互动联盟(coder_online)

1.直接帮你解答wekit技术疑点

2.第一时间获得业内十多个领域技术文章

3.针对文章内疑点提出问题,第一时间回复你,帮你耐心解答

4.让你和原创作者成为很好的朋友,拓展自己的人脉资源

扫一扫下方二维码或搜索微信号coder_online即可关注,我们可以在线交流。

分享到:
评论

相关推荐

    CSS -webkit-box-orient: vertical属性编译后丢失问题详解

    一、起因 需求要求展示两行,多余的文字用三个点替代,于是用了这几个不太规范的属性 display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; 后来发现代码里写的好好的,一到页面上居然没有...

    WebKit内核源代

    WebKit 是一个开源的网页渲染引擎,被广泛应用于各种操作系统和浏览器,如苹果的Safari和谷歌的Chrome。在Android平台上,WebKit被用作原生浏览器和其他应用的网页显示组件。深入理解WebKit内核源代码对于优化网页...

    webkit JS引擎深入分析

    ### WebKit JavaScript引擎深入分析 #### 一、概述 **WebKit**是一款开源的浏览器引擎,由Apple公司在2005年发起,旨在提供一个高效、跨平台的网页浏览体验。WebKit不仅仅是一个渲染引擎,它还包含了一系列核心...

    Android_WebView、Webkit内核深入讲解

    Android WebView 与 WebKit 内核深入讲解 Android WebView 是 Android 平台上的一种基于 WebKit 内核的浏览器控件,可以用来在移动应用程序中显示网页内容。WebKit 是一个开源的浏览器网页排版引擎,包含 WebCore ...

    android webkit 内核

    对于开发者来说,了解和分析WebKit的源码可以深入理解其工作原理,优化性能,或解决特定问题。可以通过以下方式入手: 1. **源码获取**:WebKit是开源的,可以在GitHub上找到Android的WebKit分支。同样,Chromium...

    VB webkit内核 利用控件操作网页内元素

    本篇文章将深入探讨如何在VB中使用Webkit内核以及如何控制网页内的元素。 首先,要使用VB Webkit内核,我们需要一个支持Webkit的VB控件,例如Awesomium或WebKit.NET。这些控件提供了与Webkit引擎交互的接口,使VB...

    webKit等内核实现的webBrowser

    本文将深入探讨“webkit”等非IE内核的Web浏览器实现及其优势。 WebKit是一个开源的Web浏览器渲染引擎,广泛应用于苹果的Safari、谷歌的Chrome以及其他许多移动设备上的浏览器。它基于KHTML和KJS库,源自Konqueror...

    Webkit内核源代码分析

    通过深入研究Webkit内核源代码,我们可以了解浏览器如何解析和渲染网页,如何执行JavaScript,以及如何处理网络请求和本地存储,这对于前端开发人员优化性能、解决兼容性问题和开发自定义浏览器具有极大的帮助。...

    duilib webkit内核浏览器控件 duilib webkit内核浏览器控件,基于BlaFans的wke内核

    Duilib WebKit内核浏览器控件是用于Windows平台上的一个用户界面库,它提供了一种高效、便捷的方式来集成WebKit内核,实现具有现代Web浏览功能的桌面应用程序。这个控件基于BlaFans的Wke内核,Wke是一个轻量级、高...

    duilib webkit内核浏览器控件

    duilib webkit内核浏览器控件,基于BlaFans的wke内核 duilib webkit内核浏览器控件,基于BlaFans的wke内核 duilib webkit内核浏览器控件,基于BlaFans的wke内核

    WebKit内核源代码分析3

    《WebKit内核源代码分析3》是一篇深入探讨WebKit内核设计与架构的专题文章,主要聚焦于WebKit的源码解析,尤其是针对Qt平台的移植。尽管移植内容不是重点,但这一系列文章的核心仍然是WebKit内核本身。WebKit是全球...

    WebKit内核源代码分析(三)

    总的来说,这篇文档提供了关于WebKit在Android平台上的实现原理和技术细节的深入了解。通过学习这些内容,开发人员可以更好地理解WebKit的工作方式,并能够在实际项目中更有效地利用WebKit的各种功能。无论是对于...

    Webkit内核的浏览器默认CSS属性

    WebKit作为一款流行的浏览器引擎,被广泛应用于Safari、Google Chrome等浏览器中。本文将深入探讨WebKit内核浏览器的默认CSS属性,帮助开发者更好地理解这些属性如何影响页面布局与呈现。 #### 默认样式概述 根据...

    Webkit内核,含导入WebKit.Interop.dll

    Webkit内核是一种开源的网页渲染引擎,广泛用于各种浏览器和操作系统中,如Apple的Safari和Google的Chrome早期版本。这个内核负责解析HTML、CSS、JavaScript等Web标准,呈现网页内容,并处理用户交互。在.NET环境中...

    c# webkit 内核浏览器简例

    通过阅读和分析这些代码,你可以更深入地理解如何利用C#和WebKit内核构建一个功能完备的浏览器。 总之,C# WebKit内核浏览器是利用C#的强大功能和WebKit的高性能网页渲染能力,实现高度定制化和优化的B/S架构浏览...

    易语言调webkit内核多页面浏览器

    转webkit内核多页面浏览器,自动填表功能还没实现!请大家测试修改

    webkit内核源代码分析

    webkit开发学习笔记(全面)_第一版 webkit内核源代码分析(1)

    webkit内核浏览器.rar

    WebKit 内核是苹果2005年先开发并提出开源的,后面 Google 也以此为基础,并独立开发出 Chromium 的,2008年 Google 为 WebKit 为内核创建了一个新项目 chormium ,后来 Google 的 chrom 占领了浏览器的大部分市场。

    深入了解WebKit

    **深入探索WebKit** WebKit是一款开源的网页渲染引擎,被广泛应用于许多知名浏览器,如Apple的Safari和Google的Chrome。...而“深入了解浏览器加载渲染及内核原理.pdf”则为深入理解浏览器工作提供了宝贵资料。

Global site tag (gtag.js) - Google Analytics