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?

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

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

30. Full access to your OS

31. Full access to your filesystem

32. …

33. Full access to wreck havocSecurity nightmare or we why we love to hate plugins Flash Silverlight … External binaries

34. Google Chrome WebKit, V8, NaCl, speed… * soon to be #2

36. Own security sandbox per tabFlash Movie Security ??? Security & Isolation are a big focus in Chrome

37. JavaScript CSS DOM NPAPI Flash Silverlight … External binaries

39. Native machine code runs on the client CPU

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

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?

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 othersNaCl 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?

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

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.pexePortable 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

90. Run natively

91. Compile LLVM bitcode to JS

92. Run in the browserPython, 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

99. we need more of it in the browser

100. I hopeJavascript is not the end all

102. Google IO 2011: Beyond JavascriptPhew, time for questions? hope this convinced you to explore the area further…