SlideShare a Scribd company logo
JSX Optimizer
    DeNA Co., Ltd.
     Kazuho Oku
The Basic Idea of the JSX Optimizer




    perform optimizations that JavaScript VMs
                     cannot




Jul 19 2012             JSX Optimizer       2
Benchmark Scores

   Box2D.jsx
         +13.5% (iOS 5.0, iPhone 4)
         +11.8% (iOS 5.1, iPhone 4S)
         +28.7% (Android 2.3, Xperia ray)
         numbers are increase in fps
   ToDo: post the details



Jul 19 2012                 JSX Optimizer    3
The Nature of JavaScript

   a dynamic language
         primitives are untyped
              a + 1 becomes "a1" if a is "a", 2 if a is 1
         objects are untyped
              a.p may point to whatever

   solution: inline caching
         V8, JavaScriptCore, SpiderMonkey



Jul 19 2012                        JSX Optimizer             4
Inline Caching

   The idea:
         most of the code will be called with the same
          types of arguments
         cache the expectation at the call site
   Example: point.x
         type of point will be { x: ?, y: ? }
         thus if the expectation succeeded, point.x will be:
              load point_addr[offset_of_x]


Jul 19 2012                     JSX Optimizer                   5
Guards in Inline Caching

   Example: a = b.p + 1
         typeof(b) is as expected
         load b.p
         typeof(b.p) is number
         add one
         store the result




Jul 19 2012                 JSX Optimizer   6
Guards in Inline Caching (cont'd)

   Example: f()
         typeof(f) is function
         setup stack frame
         jump to the code of f




Jul 19 2012                 JSX Optimizer   7
Guards in Inline Caching (cont'd)

   Example: f() // after inlined
         typeof(f) is function
          f has not been altered
         execute the code expanded in-line




Jul 19 2012                 JSX Optimizer     8
Guards in Inline Caching (cont'd)

   Example: o.f()
         typeof(o) is as expected
         load o.prototype
         typeof (o.prototype) is as expected
         load o.prototype.f
         typeof(f) is function
         setup stack frame
         jump to the code of f


Jul 19 2012                  JSX Optimizer      9
Guards in Inline Caching (cont'd)

   Example: o.f() // after inlined
         typeof(o) is as expected
         load o.prototype
         typeof (o.prototype) is as expected
         load o.prototype.f
         typeof(f) is function
          f has not been altered
         execute the code expanded in-line


Jul 19 2012                  JSX Optimizer      10
What interpreters do / do not

   inter-statement optimization
         V8 does
         SpiderMonkey and JavaScriptCore seem not
   inline-expand the JavaScript functions
         at least V8 does




Jul 19 2012                  JSX Optimizer           11
JSX optimizer

   minimizes the need for IC
         caches property access
              JSX does not have accessors (Object.defineProperty)
         inline-expands the functions
         converts member methods to static functions
   generates IC-friendly code
         always initializes the properties in same order
              Note: { x: 0, y: 0 } and { y: 1, x: 1 } are different
               types

Jul 19 2012                        JSX Optimizer                       12
JSX optimizer

   minimizes the pressure on GC
         unboxing
   folds constants
         JavaScript does not have a true const




Jul 19 2012                 JSX Optimizer         13
Example: affine transformation

   input:
         new Matrix(1, 0, 0, 0, 2, 0).transform(new Point(x, y))

   output:
         {x: x + 0 * y, y: 0 * x + 2 * y}

         Note: 0 * n cannot be optimized to 0, since it becomes NaN if n is NaN




Jul 19 2012                                 JSX Optimizer                         14
Current Optimization Subcommands

      lto
      no-assert
      no-log
      unclassify
      fold-const
      inline
      dce
      return-if
      lcse
      unbox
      array-length
Jul 19 2012             JSX Optimizer     15
Diffs. from an ordinary optimizing compiler

   ordinary compiler
         generate a low-level non-redundant code
   JSX compiler
         most code are left as is
         while optimizing the code wherever possible




Jul 19 2012                 JSX Optimizer               16
The Difficulties and Considerations

   switch to SSA-based code?
         might end-up in generating a very different code
          from source
              would be difficult to debug (by the users)
              may become slow (than the same-looking code in
               JavaScript); GCC has the problem
         it is troublesome to optimize the code while
          maintaining the original code structure
              example. support various kind of loops: do-while, for,
               for..in, while

Jul 19 2012                       JSX Optimizer                         17
The Difficulties and Considerations (cont'd)

   Other optimization techniques?
         inline allocation?
         more powerful dce / dse
         reduce the number of locals?




Jul 19 2012                 JSX Optimizer            18
Some Microbenchmarks
   http://jsperf.com/local-vs-member/2
   http://jsperf.com/construct-object-vs-array/3
   http://jsperf.com/inherit-object-vs-array-set
   http://jsperf.com/vars-in-nested-closure




Jul 19 2012                            JSX Optimizer   19

More Related Content

PPTX
PDF
JSX - developing a statically-typed programming language for the Web
PDF
Groovy Finesse
PDF
Rcs project Training Bangalore
PPTX
Core java
ODP
00_VB_Intro
PDF
HTTP Potpourri
PDF
Internationalize your JavaScript Application: Prepare for "the next billion" ...
JSX - developing a statically-typed programming language for the Web
Groovy Finesse
Rcs project Training Bangalore
Core java
00_VB_Intro
HTTP Potpourri
Internationalize your JavaScript Application: Prepare for "the next billion" ...

What's hot (9)

PDF
Configuring in the Browser, Really!
PDF
Creating Large Scale Software Platforms with OSGi and an Extension Point Mode...
PDF
openCPQ - A React-Based Product-Configuration Toolkit
PDF
Practical Domain-Specific Languages in Groovy
PPTX
PHP Development Tools 2.0 - Success Story
PDF
CSS :has() - The story so far and the path ahead
PDF
Language-Oriented Programming and Language Workbenches: Building Domain Langu...
DOC
.Net framework interview questions
PDF
Professional JavaScript Development (An Introduction for Java Developers)
Configuring in the Browser, Really!
Creating Large Scale Software Platforms with OSGi and an Extension Point Mode...
openCPQ - A React-Based Product-Configuration Toolkit
Practical Domain-Specific Languages in Groovy
PHP Development Tools 2.0 - Success Story
CSS :has() - The story so far and the path ahead
Language-Oriented Programming and Language Workbenches: Building Domain Langu...
.Net framework interview questions
Professional JavaScript Development (An Introduction for Java Developers)
Ad

Viewers also liked (20)

PPTX
JSX Design Overview (日本語)
PDF
Test Engineering on Mobage
PDF
OpenVis Conference Report Part 1 (and Introduction to D3.js)
PDF
Sprawne Smoki 2010-2011
PPTX
Lyddie: Unit2 lesson1
PDF
Sprawozdanie
PDF
Bezalel: Introduction to Interactive Design: ב4 - מבוא לעיצוב אינטראקטיבי - ה...
PPT
102報稅懶人包
ODP
Chef - the second presentation
PPTX
Lyddie: Unit3 lesson9
PDF
Overview for Technical Nearshore Investment in Costa Rica
PPSX
The Roots of Innovation
PPSX
Donde esta el Dios de justicia
PPT
What's in a habitat?
PPTX
Origen, filosofía
PDF
Электронные журналы для планшетов. Новые возможности в Magtoapp Editor 1.42
PPT
A Tour of Google Earth
PDF
Clientbridge
PDF
ruchome miejsca i etnografia translokalności
PPSX
Mis 2 Princesas Chico 2
JSX Design Overview (日本語)
Test Engineering on Mobage
OpenVis Conference Report Part 1 (and Introduction to D3.js)
Sprawne Smoki 2010-2011
Lyddie: Unit2 lesson1
Sprawozdanie
Bezalel: Introduction to Interactive Design: ב4 - מבוא לעיצוב אינטראקטיבי - ה...
102報稅懶人包
Chef - the second presentation
Lyddie: Unit3 lesson9
Overview for Technical Nearshore Investment in Costa Rica
The Roots of Innovation
Donde esta el Dios de justicia
What's in a habitat?
Origen, filosofía
Электронные журналы для планшетов. Новые возможности в Magtoapp Editor 1.42
A Tour of Google Earth
Clientbridge
ruchome miejsca i etnografia translokalności
Mis 2 Princesas Chico 2
Ad

Similar to JSX Optimizer (20)

KEY
Exciting JavaScript - Part II
PDF
Java 8 Lambda
PDF
Advanced Node.JS Meetup
PPTX
Performance #5 cpu and battery
ODP
How to develop an iOS application
PPTX
Modern server side development with node.js - Benjamin gruenbaum
PDF
Stranger in These Parts. A Hired Gun in the JS Corral (JSConf US 2012)
DOCX
Decorating code (Research Paper)
PDF
Kandroid for nhn_deview_20131013_v5_final
PPT
Dojo Toolkit from a Flex developer's perspective
PDF
Eric Lafortune - The Jack and Jill build system
PDF
Welcome to React & Flux !
PDF
High performance web programming with C++14
PPTX
Advance Android Application Development
PPTX
Using the android ndk - DroidCon Paris 2014
PDF
JavaScript Miller Columns
PDF
Integrate Spring MVC with RequireJS & Backbone.js & Spring Data JPA
PDF
Ajax for-coldfusion-developers
PDF
Eric Lafortune - The Jack and Jill build system
Exciting JavaScript - Part II
Java 8 Lambda
Advanced Node.JS Meetup
Performance #5 cpu and battery
How to develop an iOS application
Modern server side development with node.js - Benjamin gruenbaum
Stranger in These Parts. A Hired Gun in the JS Corral (JSConf US 2012)
Decorating code (Research Paper)
Kandroid for nhn_deview_20131013_v5_final
Dojo Toolkit from a Flex developer's perspective
Eric Lafortune - The Jack and Jill build system
Welcome to React & Flux !
High performance web programming with C++14
Advance Android Application Development
Using the android ndk - DroidCon Paris 2014
JavaScript Miller Columns
Integrate Spring MVC with RequireJS & Backbone.js & Spring Data JPA
Ajax for-coldfusion-developers
Eric Lafortune - The Jack and Jill build system

More from Kazuho Oku (20)

PDF
HTTP/2で 速くなるとき ならないとき
PDF
QUIC標準化動向 〜2017/7
PDF
HTTP/2の課題と将来
PDF
TLS 1.3 と 0-RTT のこわ〜い話
PDF
Reorganizing Website Architecture for HTTP/2 and Beyond
PPTX
Recent Advances in HTTP, controlling them using ruby
PPTX
Programming TCP for responsiveness
PDF
Programming TCP for responsiveness
PDF
Developing the fastest HTTP/2 server
PPTX
TLS & LURK @ IETF 95
PPTX
HTTPとサーバ技術の最新動向
PPTX
ウェブを速くするためにDeNAがやっていること - HTTP/2と、さらにその先
PPTX
Cache aware-server-push in H2O version 1.5
PDF
HTTP/2時代のウェブサイト設計
PDF
H2O - making the Web faster
PDF
H2O - making HTTP better
PDF
H2O - the optimized HTTP server
PPTX
JSON SQL Injection and the Lessons Learned
PPTX
JSX 速さの秘密 - 高速なJavaScriptを書く方法
PPTX
JSX の現在と未来 - Oct 26 2013
HTTP/2で 速くなるとき ならないとき
QUIC標準化動向 〜2017/7
HTTP/2の課題と将来
TLS 1.3 と 0-RTT のこわ〜い話
Reorganizing Website Architecture for HTTP/2 and Beyond
Recent Advances in HTTP, controlling them using ruby
Programming TCP for responsiveness
Programming TCP for responsiveness
Developing the fastest HTTP/2 server
TLS & LURK @ IETF 95
HTTPとサーバ技術の最新動向
ウェブを速くするためにDeNAがやっていること - HTTP/2と、さらにその先
Cache aware-server-push in H2O version 1.5
HTTP/2時代のウェブサイト設計
H2O - making the Web faster
H2O - making HTTP better
H2O - the optimized HTTP server
JSON SQL Injection and the Lessons Learned
JSX 速さの秘密 - 高速なJavaScriptを書く方法
JSX の現在と未来 - Oct 26 2013

Recently uploaded (20)

PDF
Diabetes mellitus diagnosis method based random forest with bat algorithm
PPTX
Spectroscopy.pptx food analysis technology
DOCX
The AUB Centre for AI in Media Proposal.docx
PPTX
Understanding_Digital_Forensics_Presentation.pptx
PDF
KodekX | Application Modernization Development
PDF
Per capita expenditure prediction using model stacking based on satellite ima...
PPTX
Cloud computing and distributed systems.
PDF
NewMind AI Weekly Chronicles - August'25 Week I
PPTX
Big Data Technologies - Introduction.pptx
PDF
Optimiser vos workloads AI/ML sur Amazon EC2 et AWS Graviton
PDF
Spectral efficient network and resource selection model in 5G networks
PDF
How UI/UX Design Impacts User Retention in Mobile Apps.pdf
PDF
Architecting across the Boundaries of two Complex Domains - Healthcare & Tech...
PDF
TokAI - TikTok AI Agent : The First AI Application That Analyzes 10,000+ Vira...
PDF
Review of recent advances in non-invasive hemoglobin estimation
PDF
Agricultural_Statistics_at_a_Glance_2022_0.pdf
PDF
Approach and Philosophy of On baking technology
PDF
Profit Center Accounting in SAP S/4HANA, S4F28 Col11
PDF
Encapsulation theory and applications.pdf
PPTX
Effective Security Operations Center (SOC) A Modern, Strategic, and Threat-In...
Diabetes mellitus diagnosis method based random forest with bat algorithm
Spectroscopy.pptx food analysis technology
The AUB Centre for AI in Media Proposal.docx
Understanding_Digital_Forensics_Presentation.pptx
KodekX | Application Modernization Development
Per capita expenditure prediction using model stacking based on satellite ima...
Cloud computing and distributed systems.
NewMind AI Weekly Chronicles - August'25 Week I
Big Data Technologies - Introduction.pptx
Optimiser vos workloads AI/ML sur Amazon EC2 et AWS Graviton
Spectral efficient network and resource selection model in 5G networks
How UI/UX Design Impacts User Retention in Mobile Apps.pdf
Architecting across the Boundaries of two Complex Domains - Healthcare & Tech...
TokAI - TikTok AI Agent : The First AI Application That Analyzes 10,000+ Vira...
Review of recent advances in non-invasive hemoglobin estimation
Agricultural_Statistics_at_a_Glance_2022_0.pdf
Approach and Philosophy of On baking technology
Profit Center Accounting in SAP S/4HANA, S4F28 Col11
Encapsulation theory and applications.pdf
Effective Security Operations Center (SOC) A Modern, Strategic, and Threat-In...

JSX Optimizer

  • 1. JSX Optimizer DeNA Co., Ltd. Kazuho Oku
  • 2. The Basic Idea of the JSX Optimizer perform optimizations that JavaScript VMs cannot Jul 19 2012 JSX Optimizer 2
  • 3. Benchmark Scores Box2D.jsx +13.5% (iOS 5.0, iPhone 4) +11.8% (iOS 5.1, iPhone 4S) +28.7% (Android 2.3, Xperia ray) numbers are increase in fps ToDo: post the details Jul 19 2012 JSX Optimizer 3
  • 4. The Nature of JavaScript a dynamic language primitives are untyped a + 1 becomes "a1" if a is "a", 2 if a is 1 objects are untyped a.p may point to whatever solution: inline caching V8, JavaScriptCore, SpiderMonkey Jul 19 2012 JSX Optimizer 4
  • 5. Inline Caching The idea: most of the code will be called with the same types of arguments cache the expectation at the call site Example: point.x type of point will be { x: ?, y: ? } thus if the expectation succeeded, point.x will be: load point_addr[offset_of_x] Jul 19 2012 JSX Optimizer 5
  • 6. Guards in Inline Caching Example: a = b.p + 1 typeof(b) is as expected load b.p typeof(b.p) is number add one store the result Jul 19 2012 JSX Optimizer 6
  • 7. Guards in Inline Caching (cont'd) Example: f() typeof(f) is function setup stack frame jump to the code of f Jul 19 2012 JSX Optimizer 7
  • 8. Guards in Inline Caching (cont'd) Example: f() // after inlined typeof(f) is function  f has not been altered execute the code expanded in-line Jul 19 2012 JSX Optimizer 8
  • 9. Guards in Inline Caching (cont'd) Example: o.f() typeof(o) is as expected load o.prototype typeof (o.prototype) is as expected load o.prototype.f typeof(f) is function setup stack frame jump to the code of f Jul 19 2012 JSX Optimizer 9
  • 10. Guards in Inline Caching (cont'd) Example: o.f() // after inlined typeof(o) is as expected load o.prototype typeof (o.prototype) is as expected load o.prototype.f typeof(f) is function  f has not been altered execute the code expanded in-line Jul 19 2012 JSX Optimizer 10
  • 11. What interpreters do / do not inter-statement optimization V8 does SpiderMonkey and JavaScriptCore seem not inline-expand the JavaScript functions at least V8 does Jul 19 2012 JSX Optimizer 11
  • 12. JSX optimizer minimizes the need for IC caches property access JSX does not have accessors (Object.defineProperty) inline-expands the functions converts member methods to static functions generates IC-friendly code always initializes the properties in same order Note: { x: 0, y: 0 } and { y: 1, x: 1 } are different types Jul 19 2012 JSX Optimizer 12
  • 13. JSX optimizer minimizes the pressure on GC unboxing folds constants JavaScript does not have a true const Jul 19 2012 JSX Optimizer 13
  • 14. Example: affine transformation input: new Matrix(1, 0, 0, 0, 2, 0).transform(new Point(x, y)) output: {x: x + 0 * y, y: 0 * x + 2 * y} Note: 0 * n cannot be optimized to 0, since it becomes NaN if n is NaN Jul 19 2012 JSX Optimizer 14
  • 15. Current Optimization Subcommands  lto  no-assert  no-log  unclassify  fold-const  inline  dce  return-if  lcse  unbox  array-length Jul 19 2012 JSX Optimizer 15
  • 16. Diffs. from an ordinary optimizing compiler ordinary compiler generate a low-level non-redundant code JSX compiler most code are left as is while optimizing the code wherever possible Jul 19 2012 JSX Optimizer 16
  • 17. The Difficulties and Considerations switch to SSA-based code? might end-up in generating a very different code from source would be difficult to debug (by the users) may become slow (than the same-looking code in JavaScript); GCC has the problem it is troublesome to optimize the code while maintaining the original code structure example. support various kind of loops: do-while, for, for..in, while Jul 19 2012 JSX Optimizer 17
  • 18. The Difficulties and Considerations (cont'd) Other optimization techniques? inline allocation? more powerful dce / dse reduce the number of locals? Jul 19 2012 JSX Optimizer 18
  • 19. Some Microbenchmarks http://jsperf.com/local-vs-member/2 http://jsperf.com/construct-object-vs-array/3 http://jsperf.com/inherit-object-vs-array-set http://jsperf.com/vars-in-nested-closure Jul 19 2012 JSX Optimizer 19