狠狠撸
Search
Submit Search
Web workers¶llel.js html5勉強会lt大会
?
1 like
?
1,172 views
Yuta Shimakawa
ユーザーベースさんとの勉強会で発表しました。 2014/06/05
Read less
Read more
1 of 25
Download now
Download to read offline
More Related Content
Web workers¶llel.js html5勉強会lt大会
1.
Web Workers &
Parallel.js
2.
(function() { let me
= { name : 島川悠太 , twitter : @banana_umai , as : Server Side Engineer , belogns_to : 株式会社リブセンス } })();
3.
Web Workers おさらい
4.
メインページに並行してバッ クグラウンドで走るワーカスク リプトを生成させられるAPI http://www.hcn.zaq.ne.jp/___/WEB/Workers-ja.html
5.
メインページに並行してバッ クグラウンドで走るワーカスク リプトを生成させられるAPI http://www.hcn.zaq.ne.jp/___/WEB/Workers-ja.html
6.
直接顿翱惭は操作できない
7.
専用ワーカと共有ワーカ
8.
専用ワーカと共有ワーカ
9.
使いドコロはUIスレッド を専有したくない重たい 処理の記述
10.
<script> var worker =
new Worker("js/worker.js"); worker.onmessage = function(event) { console.log(event.data); }; worker.postMessage(msg); </script> self.onmessage = function(event) { loadScripts( proc.js ); postMessage(procWithData(event.data)); }
11.
<script> var worker =
new Worker("js/worker.js"); worker.onmessage = function(event) { console.log(event.data); }; worker.postMessage(msg); </script> self.onmessage = function(event) { loadScripts( proc.js ); postMessage(procWithData(event.data)); }
12.
<script> var worker =
new Worker("js/worker.js"); worker.onmessage = function(event) { console.log(event.data); }; worker.postMessage(msg); </script> self.onmessage = function(event) { loadScripts( proc.js ); postMessage(procWithData(event.data)); }
13.
<script> var worker =
new Worker("js/worker.js"); worker.onmessage = function(event) { console.log(event.data); }; worker.postMessage(msg); </script> self.onmessage = function(event) { loadScripts( proc.js ); postMessage(procWithData(event.data)); }
14.
<script> var worker =
new Worker("js/worker.js"); worker.onmessage = function(event) { console.log(event.data); }; worker.postMessage(msg); </script> self.onmessage = function(event) { loadScripts( proc.js ); postMessage(procWithData(event.data)); }
15.
<script> var worker =
new Worker("js/worker.js"); worker.onmessage = function(event) { console.log(event.data); }; worker.postMessage(msg); </script> self.onmessage = function(event) { loadScripts( proc.js ); postMessage(procWithData(event.data)); }
16.
<script> var worker =
new Worker("js/worker.js"); worker.onmessage = function(event) { console.log(event.data); }; worker.postMessage(msg); </script> self.onmessage = function(event) { loadScripts( proc.js ); postMessage(procWithData(event.data)); }
17.
<script> var worker =
new Worker("js/worker.js"); worker.onmessage = function(event) { console.log(event.data); }; worker.postMessage(msg); </script> self.onmessage = function(event) { loadScripts( proc.js ); postMessage(procWithData(event.data)); }
18.
<script> var worker =
new Worker("js/worker.js"); worker.onmessage = function(event) { console.log(event.data); }; worker.postMessage(msg); </script> self.onmessage = function(event) { loadScripts( proc.js ); postMessage(procWithData(event.data)); }
19.
Parallel.js http://adambom.github.io/parallel.js/
20.
ブラウザでも サーバーサイドでも 使える
21.
ブラウザでは内部的に 専用ワーカを使って 並列処理を実現
22.
バックグラウンド処理を 書き下せる
23.
<script src= /slideshow/web-workersparalleljs-html5lt/35522767/js/parallel.js
></script> <script> var data = …; var p = new Parallel(data); p.spawn(function (data) { // some proc with data running in background … return result; }).then(function (result) { // some proc with result … }); </script>
24.
尘补辫/谤别诲耻肠别ができるよ
25.
<script src= /slideshow/web-workersparalleljs-html5lt/35522767/js/parallel.js
></script> <script> var data = [1, 2, 3, 4]; var p = new Parallel(data); p.map(function (datum) { return datum * 2; }).reduce(function (mappedData) { return mappedData[0] + mappedData[1]; }).then(function (reduced) { console.log(mappedData); // 20 }); </script>
Download