Ruby in the Browser - RubyConf 2011
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Ruby in the Browser - RubyConf 2011

on

  • 15,544 views

JavaScript is great, but let's face it, being stuck with just JavaScript in the browser is no fun. ...

JavaScript is great, but let's face it, being stuck with just JavaScript in the browser is no fun.

Why not write and run Ruby in the browser, on the client, and on the server as part of your next web application?

Statistics

Views

Total Views
15,544
Views on SlideShare
14,939
Embed Views
605

Actions

Likes
7
Downloads
54
Comments
0

16 Embeds 605

http://code.kzakza.com 311
http://paper.li 90
http://paper.li 90
http://a0.twimg.com 29
http://daadigitalportfolio.weebly.com 24
http://nuevospowerpoints.blogspot.com 15
http://nuevospowerpoints.blogspot.com 15
http://coderwall.com 11
https://twitter.com 11
http://www.weebly.com 2
http://www.google.es 2
http://www.hanrss.com 1
http://us-w1.rockmelt.com 1
http://us-w1.rockmelt.com 1
http://webcache.googleusercontent.com 1
http://www.hanrss.com 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Ruby in the Browser - RubyConf 2011 Presentation Transcript

  • 1. Ruby in the Browser
    why, how, and how do we get there?
    Ilya Grigorik
    @igrigorik
  • 2. How many languages are you proficient in?
    take a few seconds…
  • 3.



  • 4. JavaScript
    CSS
    DOM
    ActionScript
    Java Applets
    ActiveX

  • 5. Don’t know it, therefore don’t like it
    Miserable experience with the DOM, hated it
    (long pause)
    Prototype + JQuery: hey, this is not bad
    Writing pure JS FF extension – fun!
    Maintaining extension + debug: it’s ok…
    (personal) conclusion: it’s a great language
    (personal) JavaScript retrospective
    in 6 acts…
  • 6. JavaScript as a monopoly?
    they (ECMA) are colluding against us!
  • 7. …


    Diversity is good!
    experimentation leads to innovation

  • 8. 50+ Ruby implementations
    credit to Konstantin Haase - @rkh
  • 9. Case in point…
  • 10. Disclaimer: I work for Google. I have no affiliation to NaCl, Chrome, … teams. All opinions are my own, etc… :-)
  • 11. Ruby in the browser?
    that would be nice…
  • 12. Ruby/Python/X/Y/Z in the browser
    would be even better!
  • 13. http://tryruby.org/
  • 14. require 'em-synchrony'
    require 'em-synchrony/em-http'
    require 'em-http/middleware/json_response'
    TRYRUBY = 'http://tryruby.org/levels/1/challenges/0/play’
    EM::HttpRequest.use EM::Middleware::JSONResponse
    EM.synchrony do
    r =EM::HttpRequest.new(TRYRUBY).put :body => {:cmd => '1+1'}
    puts r.response['output'] # => 2
    r =EM::HttpRequest.new(TRYRUBY).put :body => {:cmd => 'RUBY_VERSION'}
    puts r.response['output'] # => 1.9.2
    end
    Server-side sessions
    not really in your browser…
  • 15. require 'em-synchrony'
    require 'em-synchrony/em-http'
    require 'em-http/middleware/json_response'
    TRYRUBY = 'http://tryruby.org/levels/1/challenges/0/play’
    EM::HttpRequest.use EM::Middleware::JSONResponse
    EM.synchrony do
    r =EM::HttpRequest.new(TRYRUBY).put :body => {
    :cmd => ’”a” * (2**25)’
    }
    puts r.response['output'] # => ...
    end
    So, how much RAM can we claim?
    security is always an issue…
  • 16. In the browser, for real..
    anyone crazy enough to try?
  • 17. http://visitmix.com/work/gestalt/
  • 18. <script type="text/ruby">
    defonclick(s,e)
    window.alert"Hello, World!"
    end
    document.say_hello.attach_event('onclick',
    System::EventHandler [
    System::Windows::Browser::HtmlEventArgs
    ].new(method(:onclick))
    )
    </script>
    How awesome is that?
    IronRuby, IronPython, …
    Micorosoft’s Silverlight + DLR
    sweet!
  • 19. JavaScript
    CSS
    DOM
    Gestalt
    IronPython
    IronRuby
    C#
    F#
    Dynamic Language Runtime
  • 20. Is there a future for Silverlight?
    How about IronRuby?
    I hope so.. x2
  • 21. Browser plugins
    a brief detour…
  • 22. Setting: Live demo to Jim Clark (CEO of Netscape)
    Links to any file other than an image cause the user to be prompted to download the file.. However, when a user clicked on a link to a PDF file, the file instantly opened within the browser window, seamlessly blending HTML and PDF consumption!
    Clark: wow, who provided the support on our side?
    Adobe: we reverse-engineered it…
    Inception
  • 23.
    • Implemented in Netscape 2
    • 24. Implemented / in-use by most browsers to this day
    • 25. Plugin registers a content-type, ex: music/mp3
    • 26. Browser encounters the file, delegates to plugin
    • 27. Ex: Flash, Silverlight, Quicktime, Acrobat, etc..
    NPAPI is born
    Netscape Plugin API
  • 28. JavaScript
    CSS
    DOM
    NPAPI
    Flash
    Silverlight

    External binaries
  • 29. NPAPI
    • Standalone process
    • 30. Full access to your OS
    • 31. Full access to your filesystem
    • 32. …
    • 33. Full access to wreck havoc
    Security nightmare
    or we why we love to hate plugins
    Flash
    Silverlight

    External binaries
  • 34. Google Chrome
    WebKit, V8, NaCl, speed…
    * soon to be #2
  • 35. Process
    #1
    Process
    #2
    Process
    #3
    Tabs are:
    • Isolated processes
    • 36. Own security sandbox per tab
    Flash Movie
    Security ???
    Security & Isolation
    are a big focus in Chrome
  • 37. JavaScript
    CSS
    DOM
    NPAPI
    Flash
    Silverlight

    External binaries
  • 38. JavaScript
    CSS
    DOM
    Pepper (PPAPI)
    Pepper bridge
    Sandboxed plugin
    NaCl
    NaCl
    Plugin
    Plugin
    NaCl
    Native Client
    • Sandboxing technology for safe execution of native code
    • 39. Native machine code runs on the client CPU
    • 40. Not an interpreter
    • Compile code using specialized toolchain
    • 41. Modified GCC compiler, etc
    • 42. Build for different CPU architectures
    • 43. NaCl runtime verifies untrusted code (static analysis)
    • 44. NaCl executes verified code
    • 45. No fork, process control, file system access, etc.
    http://code.google.com/chrome/nativeclient/
  • 46. receive message
    functionmoduleDidLoad() {
    HelloTutorialModule=document.getElementById('hello_tutorial');
    HelloTutorialModule.addEventListener('message', handleMessage, false);
    // Send a message to the NaCl module
    HelloTutorialModule.postMessage('hello');
    }
    send message
    Talking to NaCl
    via Pepper API
  • 47. virtualvoidHandleMessage(constpp::Var& var_message) {
    if (!var_message.is_string())
    return;
    std::string message = var_message.AsString();
    pp::Varvar_reply;
    var_reply = pp::Var(kReplyString);
    PostMessage(var_reply);
    }
    dispatch response
    Talking to the Browser
    via Pepper API
  • 48. <embedname="nacl_module"
    id="hello_tutorial"
    width=0 height=0
    src="hello_tutorial.nmf"
    type="application/x-nacl" />
    Connecting the Pipes: NaCl, Pepper
    executing native code in the browser
  • 49. http://code.google.com/chrome/nativeclient/docs/reference/peppercpp/
    • Audio
    • 50. FileIO
    • 51. Graphics2D
    • 52. ImageData
    • 53. InputEvent
    • 54. MouseInputEvent
    • 55. PaintAggregator
    • 56. Resource
    • 57. URLLoader
    • 58. URLResponseInfo
    • 59. …
    Same privileges as JS runtime!
    NaCl SDK / API
    what can we do in NaCl?
  • 60.
    • Full C/C++ library
    • 61. Pthreads!
    • 62. Dozens of ported libraries
    • 63. …
    • 64. pthreads!
    • 65. boost
    • 66. gsl
    • 67. Gnuchess
    • 68. Lame
    • 69. libogg
    • 70. Libtheora
    • 71. … and many others
    NaCl SDK / API
    what can we do in NaCl?
  • 72. Ruby on NaCl?
    we did say it runs C/C++ code right?
  • 73. https://s3.amazonaws.com/ivan.krasin/ruby.html
    You’ll need ~ Chrome 9, with NaCl enabled
    <embedid="client"type="application/x-nacl-srpc"
    width="0"height="0"src="ruby.nexe" />
    Ruby + NaCl
    demo time!
  • 74. http://nacl-quake.appspot.com/
    You’ll need latest Chrome…
    Quake via NaCl
    Sounds, Graphics, etc
  • 75. Future of NaCl?
  • 76.
    • NaCl is a built-in plugin in Chrome
    • 77. PNaCl will replace NaCl in 2012
    • 78. Enable NaCl in about:plugins
    • 79. NaCl enabled in Chrome Webstore!
    (P)NaCl in the wild
    you may be using it already!
  • 80. +
    Exacycle
    (1B CPU hours for research)
    Netflix, AppEngine, Exacycle
    NaCl in the wild
  • 81. http://nativeclient.googlecode.com/svn/data/site/pnacl.pdf
    • Toolchainfor compiling Native Client applications to LLVM bitcode
    • 82. No more nmf manifests or *.nexe’s
    • 83. Compile to .pexe (portable executable)
    • 84. Support for: x86-32, x86-64, ARM
    • 85. $> pnacl-gcchello.c -o hello.pexe
    Portable NaCl (PNaCl)
    LLVM under the hood
  • 86. Mmm… LLVM in the browser
    imagine the possibilities…
  • 87. MacRuby
    C

    C++
    Rubinius

    PyPy

    Objective-C
    Fortran!
    Dozens of languages
    all within the browser
  • 88. EMScripten
    An LLVM-to-JavaScript Compiler
  • 89. Compiles LLVM bitcode to Javascript
    Example:
    • Compile C/C++/Objective C / etc to LLVM bitcode
    • 90. Run natively
    • 91. Compile LLVM bitcode to JS
    • 92. Run in the browser
    Python, Lua, C, C++, Objective C, …
    EMScripten
    LLVM-to-Javascript
  • 93. Ruby 1.8 to LLVM
    https://github.com/replit/emscripted-ruby
  • 94. Try it: http://repl.it/
    LLVM in the browser
    it works!
  • 95. This is not an exhaustive list…
    but where does that leave us?
  • 96. 1
    2
    3
    LLVM bitcode
    EMScripten
    JavaScript
    JavaScript
    JavaScript
    CSS
    CSS
    CSS
    DOM
    DOM
    DOM
    Silverlight
    (P)NaCl
    DLR
    C/C++, LLVM
    Complimentary
  • 97. LLVM bitcode
    EMScripten
    EMScripten
    JavaScript
    CSS
    DOM
    (P)NaCl
    PNacl
    “LLVM sandwich”
    in theory, it could work..
    C/C++, LLVM
  • 98. In summary:
    • innovation is good
    • 99. we need more of it in the browser
    • 100. I hopeJavascript is not the end all
    • 101. play, experiment, push the (existing) boundaries...
    Resources:
    • Google: NaCl / PNaCl
    • 102. Google IO 2011: Beyond Javascript
    Phew, time for questions?
    hope this convinced you to explore the area further…