SlideShare una empresa de Scribd logo
1 de 58
Descargar para leer sin conexión




Open Source Project
Proudly non-profit, Mozilla makes products
like Firefox with a mission to keep the power
of the Web in the hands of users everywhere.
Mozilla Mission (https://www.mozilla.org/en-US/mission/)
To ensure the Internet is a global public
resource, open and accessible to all.
Mozilla Mission(https://www.mozilla.org/en-US/mission/)
Web is the platform
Games
window.addEventListener("gamepadconnected", function(e) {
console.log("Gamepad connected at index %d: %s. %d buttons, %d axes.",
e.gamepad.index, e.gamepad.id,
e.gamepad.buttons.length, e.gamepad.axes.length);
});
window.addEventListener("gamepaddisconnected", function(e) {
console.log("Gamepad disconnected from index %d: %s",
e.gamepad.index, e.gamepad.id);
});
function pollGamepads() {
var gamepads = navigator.getGamepads() || [];
for (var i = 0; i < gamepads.length; i++) {
var gp = gamepads[i];
if (gp) {
gamepadInfo.innerHTML = "Gamepad connected at index " + gp.index + ": " + gp.id +
". It has " + gp.buttons.length + " buttons and " + gp.axes.length + " axes.";
gameLoop();
clearInterval(interval);
}
}
}
var x = 42;
var y = "a string";
var z = x + y; // z = "42a string"
eval("z = z.substr(1, 2)"); // z = "2a"
[1, "two", { three: 3 }].forEach(function(item) {
if (typeof item === typeof z) console.log([z, item]);
}); // emits ["2a", "two"]
function fib(n){
if(n < 2){
return 1;
}
return fib(n - 1) + fib(n - 2);
}
function fib(n){
if(n < 2){
return 1;
}
return fib(n - 1) + fib(n - 2);
}
function fib(n) {
n = n|0;
if(n >>> 0 < 3){
return 1 | 0;
}
return ((fib(n - 1 | 0) | 0) + (fib(n - 2 | 0) | 0)) | 0;
}
int func(int *p) {
int r = *p;
return calc(r, r << 16);
}
function func(p) {
var r = HEAP32[p >> 2];
return calc(r, r << 16);
}
float array[5000]; // C++
int main() {
for (int i = 0; i < 5000; ++i) {
array[i] += 1.0f;
}
}
float array[5000]; // C++
int main() {
for (int i = 0; i < 5000; ++i) {
array[i] += 1.0f;
}
}
var buffer = new ArrayBuffer(32768); // JavaScript
var HEAPF32 = new Float32Array(buffer);
function main() {
var a = 0, b = 0;
do {
a = (8 + (b << 2)) | 0;
HEAPF32[a >> 2] = +HEAPF32[a >> 2] + 1.0;
b = (b + 1) | 0;
} while ((b | 0) < 5000);
}
-rw-r--r-- 1 chiko staff 99B 12 22 17:38 Makefile
-rw-r--r-- 1 chiko staff 1.9K 12 22 17:29 app.js
-rw-r--r-- 1 chiko staff 247B 12 22 11:31 fib-asm.js
-rw-r--r-- 1 chiko staff 220B 12 21 17:36 fib.cpp
-rw-r--r-- 1 chiko staff 184K 12 22 17:38 fib.js
-rw-r--r-- 1 chiko staff 2.8K 12 22 17:38 fib.js.mem
-rw-r--r-- 1 chiko staff 1.2K 12 22 17:10 index.html
function () {
"use asm";
function add(x, y) {
x = x | 0;
y = y | 0;
return x + y | 0;
}
return { add: add };
}
(module
(memory 16777216 16777216)
(export "add" $add)
(func $add (param $x i32) (param $y i32) (result i32)
(i32.add
(get_local $x)
(get_local $y)
)
)
)
Thank you & Questions?
MozVR
2016 gunma.web games-and-asm.js
2016 gunma.web games-and-asm.js
2016 gunma.web games-and-asm.js

Más contenido relacionado

La actualidad más candente

Class array
Class arrayClass array
Class array
nky92
 
All I know about rsc.io/c2go
All I know about rsc.io/c2goAll I know about rsc.io/c2go
All I know about rsc.io/c2go
Moriyoshi Koizumi
 

La actualidad más candente (20)

Class array
Class arrayClass array
Class array
 
All I know about rsc.io/c2go
All I know about rsc.io/c2goAll I know about rsc.io/c2go
All I know about rsc.io/c2go
 
Finch + Finagle OAuth2
Finch + Finagle OAuth2Finch + Finagle OAuth2
Finch + Finagle OAuth2
 
C++ programs
C++ programsC++ programs
C++ programs
 
Letswift19-clean-architecture
Letswift19-clean-architectureLetswift19-clean-architecture
Letswift19-clean-architecture
 
dplyr
dplyrdplyr
dplyr
 
Introduzione a C#
Introduzione a C#Introduzione a C#
Introduzione a C#
 
Cpp tutorial
Cpp tutorialCpp tutorial
Cpp tutorial
 
Rcpp11 genentech
Rcpp11 genentechRcpp11 genentech
Rcpp11 genentech
 
Продвинутая отладка JavaScript с помощью Chrome Dev Tools
Продвинутая отладка JavaScript с помощью Chrome Dev ToolsПродвинутая отладка JavaScript с помощью Chrome Dev Tools
Продвинутая отладка JavaScript с помощью Chrome Dev Tools
 
Cpp
Cpp Cpp
Cpp
 
Debugging JavaScript with Chrome
Debugging JavaScript with ChromeDebugging JavaScript with Chrome
Debugging JavaScript with Chrome
 
Git avançado
Git avançadoGit avançado
Git avançado
 
Pratik Bakane C++
Pratik Bakane C++Pratik Bakane C++
Pratik Bakane C++
 
Un dsl pour ma base de données
Un dsl pour ma base de donnéesUn dsl pour ma base de données
Un dsl pour ma base de données
 
MongoDB Oplog入門
MongoDB Oplog入門MongoDB Oplog入門
MongoDB Oplog入門
 
Functional php
Functional phpFunctional php
Functional php
 
Introduction to Go for Java Programmers
Introduction to Go for Java ProgrammersIntroduction to Go for Java Programmers
Introduction to Go for Java Programmers
 
Basic Programs of C++
Basic Programs of C++Basic Programs of C++
Basic Programs of C++
 
How to stand on the shoulders of giants
How to stand on the shoulders of giantsHow to stand on the shoulders of giants
How to stand on the shoulders of giants
 

Destacado

論理思考とプログラミング第9回
論理思考とプログラミング第9回論理思考とプログラミング第9回
論理思考とプログラミング第9回
Noritada Shimizu
 

Destacado (7)

asm.js x emscripten: The foundation of the next level Web games
asm.js x emscripten: The foundation of the next level Web gamesasm.js x emscripten: The foundation of the next level Web games
asm.js x emscripten: The foundation of the next level Web games
 
20160428 html5jwebplat
20160428 html5jwebplat20160428 html5jwebplat
20160428 html5jwebplat
 
論理思考とプログラミング第9回
論理思考とプログラミング第9回論理思考とプログラミング第9回
論理思考とプログラミング第9回
 
20150512 webgl-off-the-main-thread
20150512 webgl-off-the-main-thread20150512 webgl-off-the-main-thread
20150512 webgl-off-the-main-thread
 
20160803 devrel
20160803 devrel20160803 devrel
20160803 devrel
 
20160601 devtools
20160601 devtools20160601 devtools
20160601 devtools
 
20160713 webvr
20160713 webvr20160713 webvr
20160713 webvr
 

Similar a 2016 gunma.web games-and-asm.js

JavaScript Advanced - Useful methods to power up your code
JavaScript Advanced - Useful methods to power up your codeJavaScript Advanced - Useful methods to power up your code
JavaScript Advanced - Useful methods to power up your code
Laurence Svekis ✔
 
Refactoring to Macros with Clojure
Refactoring to Macros with ClojureRefactoring to Macros with Clojure
Refactoring to Macros with Clojure
Dmitry Buzdin
 
Quest 1 define a class batsman with the following specifications
Quest  1 define a class batsman with the following specificationsQuest  1 define a class batsman with the following specifications
Quest 1 define a class batsman with the following specifications
rajkumari873
 
Android Best Practices
Android Best PracticesAndroid Best Practices
Android Best Practices
Yekmer Simsek
 
Python-GTK
Python-GTKPython-GTK
Python-GTK
Yuren Ju
 

Similar a 2016 gunma.web games-and-asm.js (20)

mobl
moblmobl
mobl
 
A More Flash Like Web?
A More Flash Like Web?A More Flash Like Web?
A More Flash Like Web?
 
HTML5 - Daha Flash bir web?
HTML5 - Daha Flash bir web?HTML5 - Daha Flash bir web?
HTML5 - Daha Flash bir web?
 
Java Applet and Graphics
Java Applet and GraphicsJava Applet and Graphics
Java Applet and Graphics
 
Java Applet and Graphics
Java Applet and GraphicsJava Applet and Graphics
Java Applet and Graphics
 
JavaScript Advanced - Useful methods to power up your code
JavaScript Advanced - Useful methods to power up your codeJavaScript Advanced - Useful methods to power up your code
JavaScript Advanced - Useful methods to power up your code
 
Refactoring to Macros with Clojure
Refactoring to Macros with ClojureRefactoring to Macros with Clojure
Refactoring to Macros with Clojure
 
ZIO: Powerful and Principled Functional Programming in Scala
ZIO: Powerful and Principled Functional Programming in ScalaZIO: Powerful and Principled Functional Programming in Scala
ZIO: Powerful and Principled Functional Programming in Scala
 
JVM Mechanics: When Does the JVM JIT & Deoptimize?
JVM Mechanics: When Does the JVM JIT & Deoptimize?JVM Mechanics: When Does the JVM JIT & Deoptimize?
JVM Mechanics: When Does the JVM JIT & Deoptimize?
 
lets play with "c"..!!! :):)
lets play with "c"..!!! :):)lets play with "c"..!!! :):)
lets play with "c"..!!! :):)
 
Novidades do c# 7 e 8
Novidades do c# 7 e 8Novidades do c# 7 e 8
Novidades do c# 7 e 8
 
TypeScript Introduction
TypeScript IntroductionTypeScript Introduction
TypeScript Introduction
 
NetPonto - The Future Of C# - NetConf Edition
NetPonto - The Future Of C# - NetConf EditionNetPonto - The Future Of C# - NetConf Edition
NetPonto - The Future Of C# - NetConf Edition
 
Quest 1 define a class batsman with the following specifications
Quest  1 define a class batsman with the following specificationsQuest  1 define a class batsman with the following specifications
Quest 1 define a class batsman with the following specifications
 
TDC2018SP | Trilha .Net - Novidades do C# 7 e 8
TDC2018SP | Trilha .Net - Novidades do C# 7 e 8TDC2018SP | Trilha .Net - Novidades do C# 7 e 8
TDC2018SP | Trilha .Net - Novidades do C# 7 e 8
 
JQuery Flot
JQuery FlotJQuery Flot
JQuery Flot
 
C programs pbq final
C programs pbq finalC programs pbq final
C programs pbq final
 
Build Your Own WebAssembly Compiler
Build Your Own WebAssembly CompilerBuild Your Own WebAssembly Compiler
Build Your Own WebAssembly Compiler
 
Android Best Practices
Android Best PracticesAndroid Best Practices
Android Best Practices
 
Python-GTK
Python-GTKPython-GTK
Python-GTK
 

Más de Noritada Shimizu

20140629_lod_x_firefox_os_x_html5
20140629_lod_x_firefox_os_x_html520140629_lod_x_firefox_os_x_html5
20140629_lod_x_firefox_os_x_html5
Noritada Shimizu
 

Más de Noritada Shimizu (20)

20151128 firefoxos-handson
20151128 firefoxos-handson20151128 firefoxos-handson
20151128 firefoxos-handson
 
20151117 devtools
20151117 devtools20151117 devtools
20151117 devtools
 
Inspection & Tweak: Firefox を使ったフロント開発
Inspection & Tweak: Firefox を使ったフロント開発Inspection & Tweak: Firefox を使ったフロント開発
Inspection & Tweak: Firefox を使ったフロント開発
 
20150822 osc-shimane
20150822 osc-shimane20150822 osc-shimane
20150822 osc-shimane
 
20150829 firefox-os-handson
20150829 firefox-os-handson20150829 firefox-os-handson
20150829 firefox-os-handson
 
20150829 firefox-os
20150829 firefox-os20150829 firefox-os
20150829 firefox-os
 
20150727 Development tools for Firefox OS apps
20150727 Development tools for Firefox OS apps20150727 Development tools for Firefox OS apps
20150727 Development tools for Firefox OS apps
 
Firefox OS でアプリを作るときに気をつけたい N 個のこと
Firefox OS  でアプリを作るときに気をつけたい N 個のことFirefox OS  でアプリを作るときに気をつけたい N 個のこと
Firefox OS でアプリを作るときに気をつけたい N 個のこと
 
Firefox OSアプリ開発ハンズオン(Hello World編)
Firefox OSアプリ開発ハンズオン(Hello World編)Firefox OSアプリ開発ハンズオン(Hello World編)
Firefox OSアプリ開発ハンズオン(Hello World編)
 
WebVR(html5j TV部、WebVRとかVRのUIとか勉強会)
WebVR(html5j TV部、WebVRとかVRのUIとか勉強会)WebVR(html5j TV部、WebVRとかVRのUIとか勉強会)
WebVR(html5j TV部、WebVRとかVRのUIとか勉強会)
 
Application submission, management and manetization in Firefox Marketplace
Application submission, management and manetization in Firefox MarketplaceApplication submission, management and manetization in Firefox Marketplace
Application submission, management and manetization in Firefox Marketplace
 
つくろう!Firefox OS アプリ
つくろう!Firefox OS アプリつくろう!Firefox OS アプリ
つくろう!Firefox OS アプリ
 
20150118 firefoxos-handson-helloworld
20150118 firefoxos-handson-helloworld20150118 firefoxos-handson-helloworld
20150118 firefoxos-handson-helloworld
 
20141115 fx os-codereading
20141115 fx os-codereading20141115 fx os-codereading
20141115 fx os-codereading
 
20141030 html5j-firefox os-deviceapi
20141030 html5j-firefox os-deviceapi20141030 html5j-firefox os-deviceapi
20141030 html5j-firefox os-deviceapi
 
20140830 firefox os-sampler
20140830 firefox os-sampler20140830 firefox os-sampler
20140830 firefox os-sampler
 
20140801 webrtc on-firefox
20140801 webrtc on-firefox20140801 webrtc on-firefox
20140801 webrtc on-firefox
 
20140702 webide
20140702 webide20140702 webide
20140702 webide
 
20140629 firefoxos-devenv
20140629 firefoxos-devenv20140629 firefoxos-devenv
20140629 firefoxos-devenv
 
20140629_lod_x_firefox_os_x_html5
20140629_lod_x_firefox_os_x_html520140629_lod_x_firefox_os_x_html5
20140629_lod_x_firefox_os_x_html5
 

Último

Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
WSO2
 

Último (20)

presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodPolkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
 
Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
Platformless Horizons for Digital Adaptability
Platformless Horizons for Digital AdaptabilityPlatformless Horizons for Digital Adaptability
Platformless Horizons for Digital Adaptability
 
Vector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptxVector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptx
 
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 

2016 gunma.web games-and-asm.js

  • 1.
  • 3.
  • 4.
  • 6. Proudly non-profit, Mozilla makes products like Firefox with a mission to keep the power of the Web in the hands of users everywhere. Mozilla Mission (https://www.mozilla.org/en-US/mission/)
  • 7. To ensure the Internet is a global public resource, open and accessible to all. Mozilla Mission(https://www.mozilla.org/en-US/mission/)
  • 8. Web is the platform
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17. Games
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25. window.addEventListener("gamepadconnected", function(e) { console.log("Gamepad connected at index %d: %s. %d buttons, %d axes.", e.gamepad.index, e.gamepad.id, e.gamepad.buttons.length, e.gamepad.axes.length); }); window.addEventListener("gamepaddisconnected", function(e) { console.log("Gamepad disconnected from index %d: %s", e.gamepad.index, e.gamepad.id); });
  • 26. function pollGamepads() { var gamepads = navigator.getGamepads() || []; for (var i = 0; i < gamepads.length; i++) { var gp = gamepads[i]; if (gp) { gamepadInfo.innerHTML = "Gamepad connected at index " + gp.index + ": " + gp.id + ". It has " + gp.buttons.length + " buttons and " + gp.axes.length + " axes."; gameLoop(); clearInterval(interval); } } }
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34. var x = 42; var y = "a string"; var z = x + y; // z = "42a string" eval("z = z.substr(1, 2)"); // z = "2a" [1, "two", { three: 3 }].forEach(function(item) { if (typeof item === typeof z) console.log([z, item]); }); // emits ["2a", "two"]
  • 35.
  • 36. function fib(n){ if(n < 2){ return 1; } return fib(n - 1) + fib(n - 2); }
  • 37. function fib(n){ if(n < 2){ return 1; } return fib(n - 1) + fib(n - 2); } function fib(n) { n = n|0; if(n >>> 0 < 3){ return 1 | 0; } return ((fib(n - 1 | 0) | 0) + (fib(n - 2 | 0) | 0)) | 0; }
  • 38.
  • 39.
  • 40.
  • 41. int func(int *p) { int r = *p; return calc(r, r << 16); } function func(p) { var r = HEAP32[p >> 2]; return calc(r, r << 16); }
  • 42. float array[5000]; // C++ int main() { for (int i = 0; i < 5000; ++i) { array[i] += 1.0f; } }
  • 43. float array[5000]; // C++ int main() { for (int i = 0; i < 5000; ++i) { array[i] += 1.0f; } } var buffer = new ArrayBuffer(32768); // JavaScript var HEAPF32 = new Float32Array(buffer); function main() { var a = 0, b = 0; do { a = (8 + (b << 2)) | 0; HEAPF32[a >> 2] = +HEAPF32[a >> 2] + 1.0; b = (b + 1) | 0; } while ((b | 0) < 5000); }
  • 44.
  • 45.
  • 46.
  • 47. -rw-r--r-- 1 chiko staff 99B 12 22 17:38 Makefile -rw-r--r-- 1 chiko staff 1.9K 12 22 17:29 app.js -rw-r--r-- 1 chiko staff 247B 12 22 11:31 fib-asm.js -rw-r--r-- 1 chiko staff 220B 12 21 17:36 fib.cpp -rw-r--r-- 1 chiko staff 184K 12 22 17:38 fib.js -rw-r--r-- 1 chiko staff 2.8K 12 22 17:38 fib.js.mem -rw-r--r-- 1 chiko staff 1.2K 12 22 17:10 index.html
  • 48.
  • 49.
  • 50.
  • 51. function () { "use asm"; function add(x, y) { x = x | 0; y = y | 0; return x + y | 0; } return { add: add }; }
  • 52. (module (memory 16777216 16777216) (export "add" $add) (func $add (param $x i32) (param $y i32) (result i32) (i32.add (get_local $x) (get_local $y) ) ) )
  • 53.
  • 54. Thank you & Questions?
  • 55. MozVR