Web workers¶llel.js html5勉強会lt大会
1 like•1,172 views
ユーザーベースさんとの勉強会で発表しました。 2014/06/05
![<script src= 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>](https://image.slidesharecdn.com/webworkersparallel-140605074739-phpapp01/85/Web-workers-parallel-js-html5-lt-25-320.jpg)
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 : 株式会社リブセンス } })();
- 6. 直接DOMは操作できない
- 7. 専用ワーカと共有ワーカ
- 8. 専用ワーカと共有ワーカ
- 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/
- 23. <script src= 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. map/reduceができるよ
- 25. <script src= 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>