SlideShare a Scribd company logo




Plugin free
API
window.addEventListener("gamepadconnected", function(e) {
console.log("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 = "connected at index " + gp.index + ": " + gp.id +
". It has " + gp.buttons.length +
" buttons and " + gp.axes.length + " axes.";
gameLoop();
clearInterval(interval);
}
}
}
canvas.onclick = function() {
canvas.requestPointerLock();
}
function canvasLoop(e) {
x += e.movementX;
y += e.movementY;
canvasDraw();
requestAnimationFrame(canvasLoop);
}
function toggleFullScreen(elmenet){
if(document.fullscreenElement){
document.exitFullscreen();
}else

element.requestFullScreen();
}
}
Web Workers
var myWorker = new Worker("worker.js");
myWorker.postMessage([first.value,second.value]);
onmessage = function(e) {
console.log('Message received from main script');
var workerResult = 'Result: ' + (e.data[0] * e.data[1]);
console.log('Posting message back to main script');
postMessage(workerResult);
}
var myWorker = new SharedWorker("worker.js");
myWorker.port.start();
myWorker.port.postMessage([squareNumber.value,squareNumber.value]);
onconnect = function(e) {
var port = e.ports[0];
port.onmessage = function(e) {
var workerResult = 'Result: ' + (e.data[0] * e.data[1]);
port.postMessage(workerResult);
}
port.start(); // onmessage イベントを使用していますので必須ではありません
}
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"]
var buf = new ArrayBuffer(32);
var typed = new Int8Array(buf);
typed[0] = 1; // typed[0] -> 1
typed[1] = 3.14; // typed[1] -> 3
typed[2] = "Firefox"; // typed[2] -> 0
typed[3] = 127; // typed[3] -> 127
typed[4] = 128; // typed[4] -> —128
typed[32] = 32; // typed[32] -> undefined
Sahred Array Buffer
var ab = new ArrayBuffer(1024);
var uInt8Array = new Uint8Array(ab);
for (var i = 0; i < uInt8Array.length; ++i) {
uInt8Array[i] = i;
}
var worker = new Worker("worker.js");
console.log(uInt8Array.byteLength); // before transferring: 1024
worker.postMessage(uInt8Array.buffer, [uInt8Array.buffer]);
console.log(uInt8Array.byteLength); // after transferring: 0
var sab = new SharedArrayBuffer(1024);
// before transferring
console.log(sab.byteLength); // 1024
worker.postMessage(sab, [sab]);
// after transferring
console.log(sab.byteLength); // 1024
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;
}
-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 fib(n) {
n = n|0;
if(n >>> 0 < 3){
return 1 | 0;
}
return ((fib(n - 1 | 0) | 0) + (fib(n - 2 | 0) | 0)) | 0;
}
(module
(memory 16777216 16777216)
(export "fib" $fib)
(func $fib (param $n i32)
(result i32)
(if
(i32.lt_u
(get_local $n)
(i32.const 3))
(return
(i32.const 1)))
(return
(i32.add
(call $fib
(i32.sub
(get_local $n)
(i32.const 1)))
(call $fib
(i32.sub
(get_local $n)
(i32.const 2)))
))))
Firefox Developer Edition
MozVR
Mozilla とブラウザゲーム
Mozilla とブラウザゲーム
Mozilla とブラウザゲーム

More Related Content

What's hot

ES6 in Real Life
ES6 in Real LifeES6 in Real Life
ES6 in Real Life
Domenic Denicola
 
ES6 generators
ES6 generatorsES6 generators
ES6 generators
Steven Foote
 
Poor Man's Functional Programming
Poor Man's Functional ProgrammingPoor Man's Functional Programming
Poor Man's Functional ProgrammingDmitry Buzdin
 
Refactoring to Macros with Clojure
Refactoring to Macros with ClojureRefactoring to Macros with Clojure
Refactoring to Macros with ClojureDmitry Buzdin
 
Ricky Bobby's World
Ricky Bobby's WorldRicky Bobby's World
Ricky Bobby's World
Brian Lonsdorf
 
EcmaScript 6 - The future is here
EcmaScript 6 - The future is hereEcmaScript 6 - The future is here
EcmaScript 6 - The future is here
Sebastiano Armeli
 
An Intro To ES6
An Intro To ES6An Intro To ES6
An Intro To ES6
FITC
 
Introduction to cron queue
Introduction to cron queueIntroduction to cron queue
Introduction to cron queue
ADCI Solutions
 
Python postgre sql a wonderful wedding
Python postgre sql   a wonderful weddingPython postgre sql   a wonderful wedding
Python postgre sql a wonderful wedding
Stéphane Wirtel
 
20180721 code defragment
20180721 code defragment20180721 code defragment
20180721 code defragment
Chiwon Song
 
Debugging JavaScript with Chrome
Debugging JavaScript with ChromeDebugging JavaScript with Chrome
Debugging JavaScript with Chrome
Igor Zalutsky
 
はじめてのGroovy
はじめてのGroovyはじめてのGroovy
はじめてのGroovy
Tsuyoshi Yamamoto
 
Jggug 2010 330 Grails 1.3 観察
Jggug 2010 330 Grails 1.3 観察Jggug 2010 330 Grails 1.3 観察
Jggug 2010 330 Grails 1.3 観察Tsuyoshi Yamamoto
 
ES6 - Next Generation Javascript
ES6 - Next Generation JavascriptES6 - Next Generation Javascript
ES6 - Next Generation Javascript
Ramesh Nair
 
"PostgreSQL and Python" Lightning Talk @EuroPython2014
"PostgreSQL and Python" Lightning Talk @EuroPython2014"PostgreSQL and Python" Lightning Talk @EuroPython2014
"PostgreSQL and Python" Lightning Talk @EuroPython2014
Henning Jacobs
 
Fact, Fiction, and FP
Fact, Fiction, and FPFact, Fiction, and FP
Fact, Fiction, and FP
Brian Lonsdorf
 
20181020 advanced higher-order function
20181020 advanced higher-order function20181020 advanced higher-order function
20181020 advanced higher-order function
Chiwon Song
 
Super Advanced Python –act1
Super Advanced Python –act1Super Advanced Python –act1
Super Advanced Python –act1
Ke Wei Louis
 
Writing a compiler in go
Writing a compiler in goWriting a compiler in go
Writing a compiler in go
Yusuke Kita
 

What's hot (20)

ES6 in Real Life
ES6 in Real LifeES6 in Real Life
ES6 in Real Life
 
ES6 generators
ES6 generatorsES6 generators
ES6 generators
 
Poor Man's Functional Programming
Poor Man's Functional ProgrammingPoor Man's Functional Programming
Poor Man's Functional Programming
 
Refactoring to Macros with Clojure
Refactoring to Macros with ClojureRefactoring to Macros with Clojure
Refactoring to Macros with Clojure
 
ECMAScript 6
ECMAScript 6ECMAScript 6
ECMAScript 6
 
Ricky Bobby's World
Ricky Bobby's WorldRicky Bobby's World
Ricky Bobby's World
 
EcmaScript 6 - The future is here
EcmaScript 6 - The future is hereEcmaScript 6 - The future is here
EcmaScript 6 - The future is here
 
An Intro To ES6
An Intro To ES6An Intro To ES6
An Intro To ES6
 
Introduction to cron queue
Introduction to cron queueIntroduction to cron queue
Introduction to cron queue
 
Python postgre sql a wonderful wedding
Python postgre sql   a wonderful weddingPython postgre sql   a wonderful wedding
Python postgre sql a wonderful wedding
 
20180721 code defragment
20180721 code defragment20180721 code defragment
20180721 code defragment
 
Debugging JavaScript with Chrome
Debugging JavaScript with ChromeDebugging JavaScript with Chrome
Debugging JavaScript with Chrome
 
はじめてのGroovy
はじめてのGroovyはじめてのGroovy
はじめてのGroovy
 
Jggug 2010 330 Grails 1.3 観察
Jggug 2010 330 Grails 1.3 観察Jggug 2010 330 Grails 1.3 観察
Jggug 2010 330 Grails 1.3 観察
 
ES6 - Next Generation Javascript
ES6 - Next Generation JavascriptES6 - Next Generation Javascript
ES6 - Next Generation Javascript
 
"PostgreSQL and Python" Lightning Talk @EuroPython2014
"PostgreSQL and Python" Lightning Talk @EuroPython2014"PostgreSQL and Python" Lightning Talk @EuroPython2014
"PostgreSQL and Python" Lightning Talk @EuroPython2014
 
Fact, Fiction, and FP
Fact, Fiction, and FPFact, Fiction, and FP
Fact, Fiction, and FP
 
20181020 advanced higher-order function
20181020 advanced higher-order function20181020 advanced higher-order function
20181020 advanced higher-order function
 
Super Advanced Python –act1
Super Advanced Python –act1Super Advanced Python –act1
Super Advanced Python –act1
 
Writing a compiler in go
Writing a compiler in goWriting a compiler in go
Writing a compiler in go
 

Viewers also liked

Una Cobaya como mascota?
Una Cobaya como mascota?Una Cobaya como mascota?
Una Cobaya como mascota?
mrmascota rd
 
How to do delegate & ditch with confidence webinar
How to do delegate & ditch with confidence webinarHow to do delegate & ditch with confidence webinar
How to do delegate & ditch with confidence webinar
Sheryl Andrews
 
HCF 2016: Christine Däumling
HCF 2016: Christine DäumlingHCF 2016: Christine Däumling
HCF 2016: Christine Däumling
Chemicals Forum Association
 
IN ISTANBUL
IN ISTANBULIN ISTANBUL
IN ISTANBUL
cprgraus
 
Examen marín
Examen marínExamen marín
第1回ゼミ
第1回ゼミ第1回ゼミ
第1回ゼミ
sagalabo
 
オープンソースとプラットフォームとお金
オープンソースとプラットフォームとお金オープンソースとプラットフォームとお金
オープンソースとプラットフォームとお金
masayoshi takahashi
 
WebVR - JAX 2016
WebVR -  JAX 2016WebVR -  JAX 2016
WebVR - JAX 2016
Carsten Sandtner
 
Color psychology
Color psychologyColor psychology
Color psychology
sagalabo
 
WebVR
WebVRWebVR
HCF 2016: Ian Cousins
HCF 2016: Ian CousinsHCF 2016: Ian Cousins
HCF 2016: Ian Cousins
Chemicals Forum Association
 
HCF 2016: Jee Yoon Lee
HCF 2016: Jee Yoon LeeHCF 2016: Jee Yoon Lee
HCF 2016: Jee Yoon Lee
Chemicals Forum Association
 
20160713 webvr
20160713 webvr20160713 webvr
20160713 webvr
Noritada Shimizu
 
Understanding Social Media for Office Furniture Dealers
Understanding Social Media for Office Furniture DealersUnderstanding Social Media for Office Furniture Dealers
Understanding Social Media for Office Furniture Dealers
Jason Kirby
 
HCF 2016: Sandra Averous Monnery
HCF 2016: Sandra Averous MonneryHCF 2016: Sandra Averous Monnery
HCF 2016: Sandra Averous Monnery
Chemicals Forum Association
 
AS LEIS DA VIDA - Reflexões bíblicas no sistema sacrificial em Levíticus
AS LEIS DA VIDA - Reflexões bíblicas no sistema sacrificial em LevíticusAS LEIS DA VIDA - Reflexões bíblicas no sistema sacrificial em Levíticus
AS LEIS DA VIDA - Reflexões bíblicas no sistema sacrificial em Levíticus
Daniel Deusdete
 

Viewers also liked (20)

Una Cobaya como mascota?
Una Cobaya como mascota?Una Cobaya como mascota?
Una Cobaya como mascota?
 
How to do delegate & ditch with confidence webinar
How to do delegate & ditch with confidence webinarHow to do delegate & ditch with confidence webinar
How to do delegate & ditch with confidence webinar
 
HCF 2016: Christine Däumling
HCF 2016: Christine DäumlingHCF 2016: Christine Däumling
HCF 2016: Christine Däumling
 
IN ISTANBUL
IN ISTANBULIN ISTANBUL
IN ISTANBUL
 
Annex 3
Annex 3Annex 3
Annex 3
 
Cateq pt 21
Cateq pt 21Cateq pt 21
Cateq pt 21
 
Examen marín
Examen marínExamen marín
Examen marín
 
第1回ゼミ
第1回ゼミ第1回ゼミ
第1回ゼミ
 
Tarea competencial 12
Tarea competencial 12Tarea competencial 12
Tarea competencial 12
 
Tercer ciclo
Tercer cicloTercer ciclo
Tercer ciclo
 
オープンソースとプラットフォームとお金
オープンソースとプラットフォームとお金オープンソースとプラットフォームとお金
オープンソースとプラットフォームとお金
 
WebVR - JAX 2016
WebVR -  JAX 2016WebVR -  JAX 2016
WebVR - JAX 2016
 
Color psychology
Color psychologyColor psychology
Color psychology
 
WebVR
WebVRWebVR
WebVR
 
HCF 2016: Ian Cousins
HCF 2016: Ian CousinsHCF 2016: Ian Cousins
HCF 2016: Ian Cousins
 
HCF 2016: Jee Yoon Lee
HCF 2016: Jee Yoon LeeHCF 2016: Jee Yoon Lee
HCF 2016: Jee Yoon Lee
 
20160713 webvr
20160713 webvr20160713 webvr
20160713 webvr
 
Understanding Social Media for Office Furniture Dealers
Understanding Social Media for Office Furniture DealersUnderstanding Social Media for Office Furniture Dealers
Understanding Social Media for Office Furniture Dealers
 
HCF 2016: Sandra Averous Monnery
HCF 2016: Sandra Averous MonneryHCF 2016: Sandra Averous Monnery
HCF 2016: Sandra Averous Monnery
 
AS LEIS DA VIDA - Reflexões bíblicas no sistema sacrificial em Levíticus
AS LEIS DA VIDA - Reflexões bíblicas no sistema sacrificial em LevíticusAS LEIS DA VIDA - Reflexões bíblicas no sistema sacrificial em Levíticus
AS LEIS DA VIDA - Reflexões bíblicas no sistema sacrificial em Levíticus
 

Similar to Mozilla とブラウザゲーム

Cnam azure 2014 mobile services
Cnam azure 2014   mobile servicesCnam azure 2014   mobile services
Cnam azure 2014 mobile services
Aymeric Weinbach
 
Arduino and the real time web
Arduino and the real time webArduino and the real time web
Arduino and the real time web
Andrew Fisher
 
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
 
Is HTML5 Ready? (workshop)
Is HTML5 Ready? (workshop)Is HTML5 Ready? (workshop)
Is HTML5 Ready? (workshop)Remy Sharp
 
Is html5-ready-workshop-110727181512-phpapp02
Is html5-ready-workshop-110727181512-phpapp02Is html5-ready-workshop-110727181512-phpapp02
Is html5-ready-workshop-110727181512-phpapp02PL dream
 
HTML5って必要?
HTML5って必要?HTML5って必要?
HTML5って必要?
GCS2013
 
Paris js extensions
Paris js extensionsParis js extensions
Paris js extensions
erwanl
 
Some examples of the 64-bit code errors
Some examples of the 64-bit code errorsSome examples of the 64-bit code errors
Some examples of the 64-bit code errors
PVS-Studio
 
服务框架: Thrift & PasteScript
服务框架: Thrift & PasteScript服务框架: Thrift & PasteScript
服务框架: Thrift & PasteScriptQiangning Hong
 
Network security
Network securityNetwork security
Network security
babyangle
 
HTML5 - Daha Flash bir web?
HTML5 - Daha Flash bir web?HTML5 - Daha Flash bir web?
HTML5 - Daha Flash bir web?
Ankara JUG
 
Mouse programming in c
Mouse programming in cMouse programming in c
Mouse programming in cgkgaur1987
 
mobl
moblmobl
mobl
zefhemel
 
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 ✔
 
ES6 Overview
ES6 OverviewES6 Overview
ES6 Overview
Bruno Scopelliti
 
A la découverte de TypeScript
A la découverte de TypeScriptA la découverte de TypeScript
A la découverte de TypeScript
Denis Voituron
 

Similar to Mozilla とブラウザゲーム (20)

Cnam azure 2014 mobile services
Cnam azure 2014   mobile servicesCnam azure 2014   mobile services
Cnam azure 2014 mobile services
 
Arduino and the real time web
Arduino and the real time webArduino and the real time web
Arduino and the real time web
 
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
 
Is HTML5 Ready? (workshop)
Is HTML5 Ready? (workshop)Is HTML5 Ready? (workshop)
Is HTML5 Ready? (workshop)
 
Is html5-ready-workshop-110727181512-phpapp02
Is html5-ready-workshop-110727181512-phpapp02Is html5-ready-workshop-110727181512-phpapp02
Is html5-ready-workshop-110727181512-phpapp02
 
HTML5って必要?
HTML5って必要?HTML5って必要?
HTML5って必要?
 
Paris js extensions
Paris js extensionsParis js extensions
Paris js extensions
 
Ac2
Ac2Ac2
Ac2
 
A More Flash Like Web?
A More Flash Like Web?A More Flash Like Web?
A More Flash Like Web?
 
Some examples of the 64-bit code errors
Some examples of the 64-bit code errorsSome examples of the 64-bit code errors
Some examples of the 64-bit code errors
 
服务框架: Thrift & PasteScript
服务框架: Thrift & PasteScript服务框架: Thrift & PasteScript
服务框架: Thrift & PasteScript
 
Network security
Network securityNetwork security
Network security
 
HTML5 - Daha Flash bir web?
HTML5 - Daha Flash bir web?HTML5 - Daha Flash bir web?
HTML5 - Daha Flash bir web?
 
Mouse programming in c
Mouse programming in cMouse programming in c
Mouse programming in c
 
mobl
moblmobl
mobl
 
Anti patterns
Anti patternsAnti patterns
Anti patterns
 
JQuery Flot
JQuery FlotJQuery Flot
JQuery Flot
 
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
 
ES6 Overview
ES6 OverviewES6 Overview
ES6 Overview
 
A la découverte de TypeScript
A la découverte de TypeScriptA la découverte de TypeScript
A la découverte de TypeScript
 

More from Noritada Shimizu

20160803 devrel
20160803 devrel20160803 devrel
20160803 devrel
Noritada Shimizu
 
20160601 devtools
20160601 devtools20160601 devtools
20160601 devtools
Noritada Shimizu
 
20150512 webgl-off-the-main-thread
20150512 webgl-off-the-main-thread20150512 webgl-off-the-main-thread
20150512 webgl-off-the-main-thread
Noritada Shimizu
 
20160428 html5jwebplat
20160428 html5jwebplat20160428 html5jwebplat
20160428 html5jwebplat
Noritada Shimizu
 
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
Noritada Shimizu
 
20151128 firefoxos-handson
20151128 firefoxos-handson20151128 firefoxos-handson
20151128 firefoxos-handson
Noritada Shimizu
 
20151117 devtools
20151117 devtools20151117 devtools
20151117 devtools
Noritada Shimizu
 
Inspection & Tweak: Firefox を使ったフロント開発
Inspection & Tweak: Firefox を使ったフロント開発Inspection & Tweak: Firefox を使ったフロント開発
Inspection & Tweak: Firefox を使ったフロント開発
Noritada Shimizu
 
20150822 osc-shimane
20150822 osc-shimane20150822 osc-shimane
20150822 osc-shimane
Noritada Shimizu
 
20150829 firefox-os-handson
20150829 firefox-os-handson20150829 firefox-os-handson
20150829 firefox-os-handson
Noritada Shimizu
 
20150829 firefox-os
20150829 firefox-os20150829 firefox-os
20150829 firefox-os
Noritada Shimizu
 
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
Noritada Shimizu
 
Firefox OS でアプリを作るときに気をつけたい N 個のこと
Firefox OS  でアプリを作るときに気をつけたい N 個のことFirefox OS  でアプリを作るときに気をつけたい N 個のこと
Firefox OS でアプリを作るときに気をつけたい N 個のこと
Noritada Shimizu
 
Firefox OSアプリ開発ハンズオン(Hello World編)
Firefox OSアプリ開発ハンズオン(Hello World編)Firefox OSアプリ開発ハンズオン(Hello World編)
Firefox OSアプリ開発ハンズオン(Hello World編)
Noritada Shimizu
 
WebVR(html5j TV部、WebVRとかVRのUIとか勉強会)
WebVR(html5j TV部、WebVRとかVRのUIとか勉強会)WebVR(html5j TV部、WebVRとかVRのUIとか勉強会)
WebVR(html5j TV部、WebVRとかVRのUIとか勉強会)
Noritada Shimizu
 
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
Noritada Shimizu
 
つくろう!Firefox OS アプリ
つくろう!Firefox OS アプリつくろう!Firefox OS アプリ
つくろう!Firefox OS アプリ
Noritada Shimizu
 
20150118 firefoxos-handson-helloworld
20150118 firefoxos-handson-helloworld20150118 firefoxos-handson-helloworld
20150118 firefoxos-handson-helloworld
Noritada Shimizu
 
20141115 fx os-codereading
20141115 fx os-codereading20141115 fx os-codereading
20141115 fx os-codereading
Noritada Shimizu
 
20141030 html5j-firefox os-deviceapi
20141030 html5j-firefox os-deviceapi20141030 html5j-firefox os-deviceapi
20141030 html5j-firefox os-deviceapi
Noritada Shimizu
 

More from Noritada Shimizu (20)

20160803 devrel
20160803 devrel20160803 devrel
20160803 devrel
 
20160601 devtools
20160601 devtools20160601 devtools
20160601 devtools
 
20150512 webgl-off-the-main-thread
20150512 webgl-off-the-main-thread20150512 webgl-off-the-main-thread
20150512 webgl-off-the-main-thread
 
20160428 html5jwebplat
20160428 html5jwebplat20160428 html5jwebplat
20160428 html5jwebplat
 
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
 
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
 

Recently uploaded

PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)
Ralf Eggert
 
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Jeffrey Haguewood
 
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdfFIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance
 
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Tobias Schneck
 
Knowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and backKnowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and back
Elena Simperl
 
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
Product School
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
Thijs Feryn
 
Designing Great Products: The Power of Design and Leadership by Chief Designe...
Designing Great Products: The Power of Design and Leadership by Chief Designe...Designing Great Products: The Power of Design and Leadership by Chief Designe...
Designing Great Products: The Power of Design and Leadership by Chief Designe...
Product School
 
UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4
DianaGray10
 
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Product School
 
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
James Anderson
 
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
Product School
 
DevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA ConnectDevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA Connect
Kari Kakkonen
 
Assuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyesAssuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyes
ThousandEyes
 
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
Product School
 
Key Trends Shaping the Future of Infrastructure.pdf
Key Trends Shaping the Future of Infrastructure.pdfKey Trends Shaping the Future of Infrastructure.pdf
Key Trends Shaping the Future of Infrastructure.pdf
Cheryl Hung
 
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdfFIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
Alan Dix
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
DianaGray10
 
GraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge GraphGraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge Graph
Guy Korland
 

Recently uploaded (20)

PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)
 
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
 
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdfFIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
 
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
 
Knowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and backKnowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and back
 
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
 
Designing Great Products: The Power of Design and Leadership by Chief Designe...
Designing Great Products: The Power of Design and Leadership by Chief Designe...Designing Great Products: The Power of Design and Leadership by Chief Designe...
Designing Great Products: The Power of Design and Leadership by Chief Designe...
 
UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4UiPath Test Automation using UiPath Test Suite series, part 4
UiPath Test Automation using UiPath Test Suite series, part 4
 
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...
 
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
 
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
 
DevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA ConnectDevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA Connect
 
Assuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyesAssuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyes
 
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
AI for Every Business: Unlocking Your Product's Universal Potential by VP of ...
 
Key Trends Shaping the Future of Infrastructure.pdf
Key Trends Shaping the Future of Infrastructure.pdfKey Trends Shaping the Future of Infrastructure.pdf
Key Trends Shaping the Future of Infrastructure.pdf
 
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdfFIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
 
GraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge GraphGraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge Graph
 

Mozilla とブラウザゲーム

  • 1.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17. API
  • 18.
  • 19. window.addEventListener("gamepadconnected", function(e) { console.log("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); });
  • 20. function pollGamepads() { var gamepads = navigator.getGamepads() || []; for (var i = 0; i < gamepads.length; i++) { var gp = gamepads[i]; if (gp) { gamepadInfo.innerHTML = "connected at index " + gp.index + ": " + gp.id + ". It has " + gp.buttons.length + " buttons and " + gp.axes.length + " axes."; gameLoop(); clearInterval(interval); } } }
  • 21.
  • 22. canvas.onclick = function() { canvas.requestPointerLock(); } function canvasLoop(e) { x += e.movementX; y += e.movementY; canvasDraw(); requestAnimationFrame(canvasLoop); }
  • 23.
  • 26. var myWorker = new Worker("worker.js"); myWorker.postMessage([first.value,second.value]); onmessage = function(e) { console.log('Message received from main script'); var workerResult = 'Result: ' + (e.data[0] * e.data[1]); console.log('Posting message back to main script'); postMessage(workerResult); }
  • 27. var myWorker = new SharedWorker("worker.js"); myWorker.port.start(); myWorker.port.postMessage([squareNumber.value,squareNumber.value]); onconnect = function(e) { var port = e.ports[0]; port.onmessage = function(e) { var workerResult = 'Result: ' + (e.data[0] * e.data[1]); port.postMessage(workerResult); } port.start(); // onmessage イベントを使用していますので必須ではありません }
  • 28.
  • 29. 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"]
  • 30.
  • 31.
  • 32. var buf = new ArrayBuffer(32); var typed = new Int8Array(buf); typed[0] = 1; // typed[0] -> 1 typed[1] = 3.14; // typed[1] -> 3 typed[2] = "Firefox"; // typed[2] -> 0 typed[3] = 127; // typed[3] -> 127 typed[4] = 128; // typed[4] -> —128 typed[32] = 32; // typed[32] -> undefined
  • 33.
  • 35. var ab = new ArrayBuffer(1024); var uInt8Array = new Uint8Array(ab); for (var i = 0; i < uInt8Array.length; ++i) { uInt8Array[i] = i; } var worker = new Worker("worker.js"); console.log(uInt8Array.byteLength); // before transferring: 1024 worker.postMessage(uInt8Array.buffer, [uInt8Array.buffer]); console.log(uInt8Array.byteLength); // after transferring: 0
  • 36. var sab = new SharedArrayBuffer(1024); // before transferring console.log(sab.byteLength); // 1024 worker.postMessage(sab, [sab]); // after transferring console.log(sab.byteLength); // 1024
  • 37.
  • 38. function fib(n){ if(n < 2){ return 1; } return fib(n - 1) + fib(n - 2); }
  • 39. 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; }
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 46. -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
  • 47.
  • 48. 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; }
  • 49. (module (memory 16777216 16777216) (export "fib" $fib) (func $fib (param $n i32) (result i32) (if (i32.lt_u (get_local $n) (i32.const 3)) (return (i32.const 1))) (return (i32.add (call $fib (i32.sub (get_local $n) (i32.const 1))) (call $fib (i32.sub (get_local $n) (i32.const 2))) ))))
  • 50.
  • 51.
  • 53. MozVR