0
NAS ENTRANHAS
DO
WEBKIT E DO V8
ZAEDY SAYÃO @zaedysayao
Zaedy Dantas Sayão
@zaedysayao
@javamanrj
@javamanrj
@WORKS
http://about.me/zaedy
BÁSICO
CONCEITO
O QUE É?
BROWSER
X
USER INTERFACE
BROWSER ENGINE
RENDER ENGINE
NETWORK
I/O
JAVASCRIPT
ENGINE
GRAPHICS
STACK
USER INTERFACE
BROWSER ENGINE
RENDER ENGINE
NETWORK
I/O
JAVASCRIPT
ENGINE
GRAPHICS
STACK
W
EBKIT
WEBKIT
NÃO É UM
BROWSER
WEBKIT
⊑
BROWSER
ENGINE
RENDER
ENGINE
ENGINE?
CONJUNTO
DE LIBS
CÓDIGO
FAZ O QUE?
C
Ó
D
I
G
O
C
Ó
D
I
G
O
C
Ó
D
I
G
O
C
Ó
D
I
G
O
C
Ó
D
I
G
O
42
C
Ó
D
I
G
O
C
Ó
D
I
G
O
HTML
CSS
JS
SVG
C
Ó
D
I
G
O
PAINT
HTML
CSS
JS
SVG
C
Ó
D
I
G
O
PAINT
HTML
CSS
JS
SVG
LAYOUT
PAST
HISTÓRIA
2001
KHTML
2005
CONTRIBUTOR
CONTRIBUTOR
CONTRIBUTOR
COMMITER
CONTRIBUTOR
COMMITER
CONTRIBUTOR
COMMITER
REVIEWER
APPLE
ENVIA
CONTA SVN
ONDE
RODA?
EVERYWHERE
APPLE
GOOGLE
NOKIA
BLACKBERRY
IGALIA (GNOME)
GETTING
CODE
svn checkout https://svn.webkit.org/repository/webkit/trunk
git clone git://git.webkit.org/WebKit.git
svn checkout https://svn.webkit.org/repository/webkit/trunk
git clone git://git.webkit.org/WebKit.git
1.2GB
svn checkout https://svn.webkit.org/repository/webkit/trunk
git clone git://git.webkit.org/WebKit.git
1.2GB
80% TESTES
BUILD
WebKitTools/Scripts/build-webkit
--qt for Qt,
--gtk for Gtk+
--debug for “Debug” mode
RUN
WebKitTools/Scripts/run-launcher
--qt for Qt,
--gtk for Gtk+
--debug for “Debug” mode
PORTS
SAFARI
IOS ≠WINDOWS
APPLE
PORT DO
COREFOUNDATION
PARA O WINDOWS
CHROME
CHROMIUM
ANDROID
QTWEBKIT
WEBKITGTK+
WEBKIT
NIGHTLY
MAC PORT -> SAFARI
PORTS
INTERFACE
IMPLEMENTAÇÃO
<input type=”number”/>
<input type=”number”/>
WEBKIT
<input type=”number” />
WebKit
ursday, November 3, 2011
<input type=”number”/>
WEBKIT
<input type=”number” />
WebKit
ursday, November 3, 2011
<input type=”number”/>
PINTA
PARA MIM
WEBKIT
<input type=”number” />
WebKit
ursday, November 3, 2011
<input type=”number”/>
PINTA
PARA MIM
WEBKIT
PORT
<input type=”number” />
WebKit
ursday, November 3, 2011
<input type=”number”/>
PINTA
PARA MIM
input type=”number” />WEBKIT...
<input type=”number” />
WebKit
ursday, November 3, 2011
<input type=”number”/>
PINTA
PARA MIM
input type=”number” />
EU SE...
<input type=”number” />
WebKit
ursday, November 3, 2011
<input type=”number”/>
WEBKIT
123
<input type=”number” />
WebKit
ursday, November 3, 2011
<input type=”number”/>
WEBKIT
123
AQUI
<input type=”number”/>
input type=”number” />
PORT
123
<input type=”number”/>
input type=”number” />
PORT
123
BLZ!
<input type=”number”/>
input type=”number” />
PORT
123
BLZ!
WEBKIT SABE
COMO
DESENHAR
RESPONSABILIDADE
É DO PORT
(COREGRAPHICS)
QTWEBKIT
QNETWORKACESSMANAGER
KDEWEBKIT
KDE NETWORK LAYER
NETWORK
INTERFACE
NADA DE HTTP, SSL...
MAS TEM CHAMADAS PARA
ENVIO DE DADOS
IMPLEMENTAÇÃO
LIB DO SISTEMA
SE QUISER FAZER
UM PORT?
IMPLEMENTE AS
INTERFACES
SE NÃO
IMPLEMENTAR?
fillRoundedRect()
BOTÃO
QUADRADO
SE WEBKIT
->
MENOS UM
BROWSER PARA
TESTAR
#1
NOVA FEATURE
->
DISPONÍVEL EM
TODO PORT
#2
WEBKIT
TAMBÉM É UMA
API
WEBKIT2
MULTI-PROCESS
JAVASCRIPTCORE
ENGINE
WEBCORE
CSS, HTML, DOM,
RENDER
WTF
WEB TEMPLATE
FRAMEWORK
PROPÓSITOS
WEBCORE
LOADING
PARSING
LAYOUT
PAINT
HTML EDITING
JS BINDINGS
LOADING
PEGANDO DADOS
COMPLICADA!!!
WEBKIT
WEBCORE
WEBCORE/LOADER
WEBCORE/PLATFORM/NETWORK
FRAMELOADERCLIENT
2 PASSOS
FRAMES E RESOURCES
LOADING A
FRAME
CLASSE FRAMELOADER
1)POLICY STAGE
BLOCK POP-UP
CROSS-PROCESS NAVIGATION
2)PROVISIONAL
STAGE
DOWNLOAD OU COMMIT
EX: LINK
3)COMMITED
STAGE
START PARSING
LOADING
SUBRESOURCES
DOCLOADER
CACHE
DOCLOADER
PEGA UMA URL
VERIFICA NO CACHE OU
LOADER
RETORNA UM
CACHEDRESOURCE
CACHEDRESOURCE
RESPONDE CALLBACK
PRODUZ UM OBJETO
(IMAGEM, FONTE...)
PARSING
HTML x XML
HTMLTOKENIZER E HTMLPARSER
XMLTOKENIZER
OUTRAS TASKS:
PRE-LOAD SCANNING
(CARREGAMENTO DE CSS ANTES
DO PARSE)
DOM TREE
RENDEROBJECT TREE
RENDERSTYLE TREE
RENDERLAYER TREE
LINEBOX TREE
LOADING -> SOURCE
PARSING -> DOM TREE
attach() -> RENDEROBJECT TREE
STYLE RESOLUTION -> RENDERSTYLE
TREE
LAYOUT -> RENDERL...
DOM TREE
<html>
<head>
<title>
foo
</title>
<head>
HTMLDocument
HTMLHTMLElement
HTMLHeadElement
HTMLTitleElement
Text(“foo...
RENDER TREE
LAYOUT
PAINTING
HIT TESTING
RENDER TREE
RENDEROBJECTS
RENDERSTYLE
RENDERLAYERS
INLINEBOXES
RENDEROBJECT
class RenderObject {
virtual void layout() = 0;
virtual void paint(PaintInfo) = 0;
virtual IntRect repaintRec...
RENDEROBJECT
RenderBlock(<div>, <p>)
RenderInline(<span>, <b>, <i>)
RenderImage(<image>)
RenderText(#text)
RenderTableCell...
OBJETOS DA
ENGINE JSString
Array
Number
Prototypes
.__proto__
.callee
__defineGetter__
.toString()
ABERTAS
FECHADAS
SPIDER MONKEY
JAVASCRIPTCORE (JSC, NITRO)
V8
V8
PARSER RUNTIME
INTERPRETER
PARSER
TOKENIZE
var answer = 42;
TOKENIZE
var answer = 42;
keyword
TOKENIZE
var answer = 42;
keyword identifier
TOKENIZE
var answer = 42;
keyword identifier
sinal igual
TOKENIZE
var answer = 42;
keyword identifier
sinal igual
número
TOKENIZE
var answer = 42;
keyword identifier
sinal igual
número
ponto e
vírgula
TOKENIZER
NOV8
src/scanner.*
KEYWORD
X
IDENTIFIER
#1
PERGUNTA 1
instanceof - instanceComponent
#1
PERGUNTA 1
instanceof - instanceComponent
#1
PERGUNTA 1
instanceof - instanceComponent
#1
PERGUNTA 1
#2
PERGUNTA 2
A G H J K L M O P Q XY Z
#2
PERGUNTA 2
GRAMÁTICA
SouceElement :: (Statement)*
FunctionDeclaration ::
‘function’ Identifier ‘(‘FormalParameters’)’	

‘{‘FunctionBody’}’
SYNTAX TREE
IDENTIFIER LITERAL
CONSTANT
VARIABLE
DECLARATION
answer 42
CONSEQUÊNCIA
ALTERNATIVA
BRANCH
VELHO
NOVO
CONDIÇÃO
idade > 60
PARSER NOV8
src/parser.*
CODE TRACE
(EVAL)
SCRIPT :: COMPILE
SCRIPT :: NEW
INTERNAL :: COMPILER :: COMPILE
INTERNAL :: MAKEFUNCIONINFO
INTERNAL :: ...
INTERPRETER
var answer = 42;
var answer = 42;
Declare um objeto local
Chame esse objeto de “answer”
Crie um número 42
De “assign” do número ao objeto
IDENTIFIER LITERAL
CONSTANT
VARIABLE
DECLARATION
answer 42
VELOCIDADE
BYTECODE
SERIALIZA EM UMA
LISTA DE “AÇÕES”
COMPILA O
BYTECODE
PARA ASSEMBLY
JIT (=JUST-IN-TIME) COMPILE
shell --print-code
shell --expose-debug-as deb
shell --print-code
shell --expose-debug-as deb
deb.Debug.disassemble(f)
LAZY
foobar = function(x, y, z)
{
...
}
foobar(x, y, z);
foobar = function(x, y, z)
{
...
}
foobar(x, y, z);
Analiza sintaxe
Guarda posição da função
foobar = function(x, y, z)
{
...
}
foobar(x, y, z);
Analiza sintaxe
Guarda posição da função
Compila e roda
foobar = function(x, y, z)
{
...
}
foobar(x, y, z);
Analiza sintaxe
Guarda posição da função
foobar = function(x, y, z, ru...
foobar = function(x, y, z)
{
...
}
foobar(x, y, z);
Analiza sintaxe
Guarda posição da função
foobar = function(x, y, z, ru...
RUNTIME
Date.now()
código
nativo
código
JavaScript
BRIDGE
BRIDGING
C++
Primitive
Date
Object
Array
Function
External
Handle<FunctionTemplate> systemObject = FunctionTemplate::New();
systemObject->Set(String::New(“exit”)),
FunctionTemplate:...
JSLINT
JSBEAUTIFY
YUI COMPRESSOR
OBRIGADO!
@zaedysayao
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013
Upcoming SlideShare
Loading in...5
×

Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013

1,756

Published on

Cada vez mais ferramentas, softwares e devices possuem soluções baseadas no WebKit. Contudo, poucas pessoas sabem o que ele é de verdade, como ele funciona internamente, seu potencial e o que ele oferece. Veremos seus core, discutiremos como é possível usar o WebKit para fazer o seu browser ou usá-lo dentro de sua aplicação e entenderemos seu funcionamento e suas ferramentas disponiveis.
Ainda, veremos como funciona a interpretação e run do JavaScript dentro da engine V8

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,756
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
16
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Transcript of "Nas entranhas do WebKit e do V8 - The Developers Conference 2013 SP - TDC2013"

  1. 1. NAS ENTRANHAS DO WEBKIT E DO V8 ZAEDY SAYÃO @zaedysayao
  2. 2. Zaedy Dantas Sayão @zaedysayao @javamanrj @javamanrj @WORKS http://about.me/zaedy
  3. 3. BÁSICO
  4. 4. CONCEITO
  5. 5. O QUE É?
  6. 6. BROWSER
  7. 7. X
  8. 8. USER INTERFACE BROWSER ENGINE RENDER ENGINE NETWORK I/O JAVASCRIPT ENGINE GRAPHICS STACK
  9. 9. USER INTERFACE BROWSER ENGINE RENDER ENGINE NETWORK I/O JAVASCRIPT ENGINE GRAPHICS STACK W EBKIT
  10. 10. WEBKIT NÃO É UM BROWSER
  11. 11. WEBKIT ⊑
  12. 12. BROWSER ENGINE
  13. 13. RENDER ENGINE
  14. 14. ENGINE?
  15. 15. CONJUNTO DE LIBS CÓDIGO
  16. 16. FAZ O QUE?
  17. 17. C Ó D I G O
  18. 18. C Ó D I G O
  19. 19. C Ó D I G O
  20. 20. C Ó D I G O
  21. 21. C Ó D I G O 42
  22. 22. C Ó D I G O
  23. 23. C Ó D I G O HTML CSS JS SVG
  24. 24. C Ó D I G O PAINT HTML CSS JS SVG
  25. 25. C Ó D I G O PAINT HTML CSS JS SVG LAYOUT
  26. 26. PAST
  27. 27. HISTÓRIA
  28. 28. 2001
  29. 29. KHTML
  30. 30. 2005
  31. 31. CONTRIBUTOR
  32. 32. CONTRIBUTOR
  33. 33. CONTRIBUTOR COMMITER
  34. 34. CONTRIBUTOR COMMITER
  35. 35. CONTRIBUTOR COMMITER REVIEWER
  36. 36. APPLE ENVIA CONTA SVN
  37. 37. ONDE RODA?
  38. 38. EVERYWHERE
  39. 39. APPLE GOOGLE NOKIA BLACKBERRY IGALIA (GNOME)
  40. 40. GETTING CODE
  41. 41. svn checkout https://svn.webkit.org/repository/webkit/trunk git clone git://git.webkit.org/WebKit.git
  42. 42. svn checkout https://svn.webkit.org/repository/webkit/trunk git clone git://git.webkit.org/WebKit.git 1.2GB
  43. 43. svn checkout https://svn.webkit.org/repository/webkit/trunk git clone git://git.webkit.org/WebKit.git 1.2GB 80% TESTES
  44. 44. BUILD
  45. 45. WebKitTools/Scripts/build-webkit --qt for Qt, --gtk for Gtk+ --debug for “Debug” mode
  46. 46. RUN
  47. 47. WebKitTools/Scripts/run-launcher --qt for Qt, --gtk for Gtk+ --debug for “Debug” mode
  48. 48. PORTS
  49. 49. SAFARI IOS ≠WINDOWS
  50. 50. APPLE PORT DO COREFOUNDATION PARA O WINDOWS
  51. 51. CHROME CHROMIUM
  52. 52. ANDROID
  53. 53. QTWEBKIT
  54. 54. WEBKITGTK+
  55. 55. WEBKIT NIGHTLY MAC PORT -> SAFARI
  56. 56. PORTS
  57. 57. INTERFACE
  58. 58. IMPLEMENTAÇÃO
  59. 59. <input type=”number”/>
  60. 60. <input type=”number”/> WEBKIT
  61. 61. <input type=”number” /> WebKit ursday, November 3, 2011 <input type=”number”/> WEBKIT
  62. 62. <input type=”number” /> WebKit ursday, November 3, 2011 <input type=”number”/> PINTA PARA MIM WEBKIT
  63. 63. <input type=”number” /> WebKit ursday, November 3, 2011 <input type=”number”/> PINTA PARA MIM WEBKIT PORT
  64. 64. <input type=”number” /> WebKit ursday, November 3, 2011 <input type=”number”/> PINTA PARA MIM input type=”number” />WEBKIT PORT
  65. 65. <input type=”number” /> WebKit ursday, November 3, 2011 <input type=”number”/> PINTA PARA MIM input type=”number” /> EU SEI FAZER! WEBKIT PORT
  66. 66. <input type=”number” /> WebKit ursday, November 3, 2011 <input type=”number”/> WEBKIT 123
  67. 67. <input type=”number” /> WebKit ursday, November 3, 2011 <input type=”number”/> WEBKIT 123 AQUI
  68. 68. <input type=”number”/> input type=”number” /> PORT 123
  69. 69. <input type=”number”/> input type=”number” /> PORT 123 BLZ!
  70. 70. <input type=”number”/> input type=”number” /> PORT 123 BLZ!
  71. 71. WEBKIT SABE COMO DESENHAR
  72. 72. RESPONSABILIDADE É DO PORT (COREGRAPHICS)
  73. 73. QTWEBKIT QNETWORKACESSMANAGER
  74. 74. KDEWEBKIT KDE NETWORK LAYER
  75. 75. NETWORK INTERFACE NADA DE HTTP, SSL... MAS TEM CHAMADAS PARA ENVIO DE DADOS
  76. 76. IMPLEMENTAÇÃO LIB DO SISTEMA
  77. 77. SE QUISER FAZER UM PORT?
  78. 78. IMPLEMENTE AS INTERFACES
  79. 79. SE NÃO IMPLEMENTAR?
  80. 80. fillRoundedRect() BOTÃO QUADRADO
  81. 81. SE WEBKIT -> MENOS UM BROWSER PARA TESTAR #1
  82. 82. NOVA FEATURE -> DISPONÍVEL EM TODO PORT #2
  83. 83. WEBKIT TAMBÉM É UMA API
  84. 84. WEBKIT2 MULTI-PROCESS
  85. 85. JAVASCRIPTCORE ENGINE
  86. 86. WEBCORE CSS, HTML, DOM, RENDER
  87. 87. WTF WEB TEMPLATE FRAMEWORK
  88. 88. PROPÓSITOS
  89. 89. WEBCORE
  90. 90. LOADING PARSING LAYOUT PAINT HTML EDITING JS BINDINGS
  91. 91. LOADING PEGANDO DADOS
  92. 92. COMPLICADA!!!
  93. 93. WEBKIT WEBCORE WEBCORE/LOADER WEBCORE/PLATFORM/NETWORK FRAMELOADERCLIENT
  94. 94. 2 PASSOS FRAMES E RESOURCES
  95. 95. LOADING A FRAME CLASSE FRAMELOADER
  96. 96. 1)POLICY STAGE BLOCK POP-UP CROSS-PROCESS NAVIGATION
  97. 97. 2)PROVISIONAL STAGE DOWNLOAD OU COMMIT EX: LINK
  98. 98. 3)COMMITED STAGE START PARSING
  99. 99. LOADING SUBRESOURCES
  100. 100. DOCLOADER CACHE
  101. 101. DOCLOADER PEGA UMA URL VERIFICA NO CACHE OU LOADER RETORNA UM CACHEDRESOURCE
  102. 102. CACHEDRESOURCE RESPONDE CALLBACK PRODUZ UM OBJETO (IMAGEM, FONTE...)
  103. 103. PARSING
  104. 104. HTML x XML HTMLTOKENIZER E HTMLPARSER XMLTOKENIZER OUTRAS TASKS: PRE-LOAD SCANNING (CARREGAMENTO DE CSS ANTES DO PARSE)
  105. 105. DOM TREE RENDEROBJECT TREE RENDERSTYLE TREE RENDERLAYER TREE LINEBOX TREE
  106. 106. LOADING -> SOURCE PARSING -> DOM TREE attach() -> RENDEROBJECT TREE STYLE RESOLUTION -> RENDERSTYLE TREE LAYOUT -> RENDERLAYER TREE LINEBOX TREE
  107. 107. DOM TREE <html> <head> <title> foo </title> <head> HTMLDocument HTMLHTMLElement HTMLHeadElement HTMLTitleElement Text(“foo”)
  108. 108. RENDER TREE LAYOUT PAINTING HIT TESTING
  109. 109. RENDER TREE RENDEROBJECTS RENDERSTYLE RENDERLAYERS INLINEBOXES
  110. 110. RENDEROBJECT class RenderObject { virtual void layout() = 0; virtual void paint(PaintInfo) = 0; virtual IntRect repaintRect() = 0; Node* node(); RenderStyle* style() const; RenderLayer* containingLayer(); ..... }
  111. 111. RENDEROBJECT RenderBlock(<div>, <p>) RenderInline(<span>, <b>, <i>) RenderImage(<image>) RenderText(#text) RenderTableCell (<td>)
  112. 112. OBJETOS DA ENGINE JSString Array Number Prototypes .__proto__ .callee __defineGetter__ .toString()
  113. 113. ABERTAS FECHADAS
  114. 114. SPIDER MONKEY JAVASCRIPTCORE (JSC, NITRO) V8
  115. 115. V8
  116. 116. PARSER RUNTIME INTERPRETER
  117. 117. PARSER
  118. 118. TOKENIZE var answer = 42;
  119. 119. TOKENIZE var answer = 42; keyword
  120. 120. TOKENIZE var answer = 42; keyword identifier
  121. 121. TOKENIZE var answer = 42; keyword identifier sinal igual
  122. 122. TOKENIZE var answer = 42; keyword identifier sinal igual número
  123. 123. TOKENIZE var answer = 42; keyword identifier sinal igual número ponto e vírgula
  124. 124. TOKENIZER NOV8 src/scanner.*
  125. 125. KEYWORD X IDENTIFIER
  126. 126. #1 PERGUNTA 1
  127. 127. instanceof - instanceComponent #1 PERGUNTA 1
  128. 128. instanceof - instanceComponent #1 PERGUNTA 1
  129. 129. instanceof - instanceComponent #1 PERGUNTA 1
  130. 130. #2 PERGUNTA 2
  131. 131. A G H J K L M O P Q XY Z #2 PERGUNTA 2
  132. 132. GRAMÁTICA
  133. 133. SouceElement :: (Statement)* FunctionDeclaration :: ‘function’ Identifier ‘(‘FormalParameters’)’ ‘{‘FunctionBody’}’
  134. 134. SYNTAX TREE
  135. 135. IDENTIFIER LITERAL CONSTANT VARIABLE DECLARATION answer 42
  136. 136. CONSEQUÊNCIA ALTERNATIVA BRANCH VELHO NOVO CONDIÇÃO idade > 60
  137. 137. PARSER NOV8 src/parser.*
  138. 138. CODE TRACE (EVAL) SCRIPT :: COMPILE SCRIPT :: NEW INTERNAL :: COMPILER :: COMPILE INTERNAL :: MAKEFUNCIONINFO INTERNAL :: PARSEAPI :: PARSE
  139. 139. INTERPRETER
  140. 140. var answer = 42;
  141. 141. var answer = 42; Declare um objeto local Chame esse objeto de “answer” Crie um número 42 De “assign” do número ao objeto
  142. 142. IDENTIFIER LITERAL CONSTANT VARIABLE DECLARATION answer 42
  143. 143. VELOCIDADE
  144. 144. BYTECODE SERIALIZA EM UMA LISTA DE “AÇÕES”
  145. 145. COMPILA O BYTECODE PARA ASSEMBLY JIT (=JUST-IN-TIME) COMPILE
  146. 146. shell --print-code shell --expose-debug-as deb
  147. 147. shell --print-code shell --expose-debug-as deb deb.Debug.disassemble(f)
  148. 148. LAZY
  149. 149. foobar = function(x, y, z) { ... } foobar(x, y, z);
  150. 150. foobar = function(x, y, z) { ... } foobar(x, y, z); Analiza sintaxe Guarda posição da função
  151. 151. foobar = function(x, y, z) { ... } foobar(x, y, z); Analiza sintaxe Guarda posição da função Compila e roda
  152. 152. foobar = function(x, y, z) { ... } foobar(x, y, z); Analiza sintaxe Guarda posição da função foobar = function(x, y, z, run) { ... } foobar(x, y, z, false); Compila e roda
  153. 153. foobar = function(x, y, z) { ... } foobar(x, y, z); Analiza sintaxe Guarda posição da função foobar = function(x, y, z, run) { ... } foobar(x, y, z, false); HACK Compila e roda
  154. 154. RUNTIME
  155. 155. Date.now() código nativo código JavaScript
  156. 156. BRIDGE BRIDGING
  157. 157. C++ Primitive Date Object Array Function External
  158. 158. Handle<FunctionTemplate> systemObject = FunctionTemplate::New(); systemObject->Set(String::New(“exit”)), FunctionTemplate::New(system_exit)->GetFunction()); static Handle<value> system_exit(const Arguments& args) { int status = args[0]->Int32Value(); ::exit(status); return Undefined(); } EXPONDO FUNÇÃO
  159. 159. JSLINT JSBEAUTIFY YUI COMPRESSOR
  160. 160. OBRIGADO! @zaedysayao
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×