スプーキーズのちょっとTech。

SPOOKIES社内のより技工的な、専門的なブログページです。

はんなりPython#3 で発表してきました

アンバサダーの id:masayuki14です。はんなりPython#3という勉強会で発表してきました。 この勉強会は「はんなりPythonの会」という京都のpythonコミュニティが主催していて、私も運営で参加しています。

今回は「JupyterNotebook入門」というタイトルで発表を行いました。 JupyteNotebookはPythonでのデータサイエンスには必須のツールなので、セットアップ方法や簡単な使い方を紹介しました。

speakerdeck.com

スライドなどの資料はこちらでも公開しています。 例として福井県の積雪量をグラフにしたんですが、今年以上に昭和の豪雪がすごかったことがわかりました。

f:id:masayuki14:20180226110359p:plain

さて、次回は 3/16 にはんなりPython #4 LT大会 with Beerが開催されます。 我らが専務 id:spookies-nishimura 氏も参加しLTを行います。 お近くの方はぜひ参加して下さい。

connpass.com

Are you Spookies?? 機械学習で顔の画像認識をしよう

最近、アニメを見まくっているIoT開発部の西村です。
こんにちは。
感動シーンでナミダしている僕の横で、犬がうるせーなって顔してるのがたまらないです。
どうぞよろしくお願い致します。

課題・モチベーション

ということで 人の顔を機械学習で覚えさせ、メンバーが来たかもよ君にバージョンアップだ!

Spookiesメンバーの顔画像認識パターンモデルを作ってみる

顔画像の収集

毎日顔を合わせて一緒に仕事してますが、いざメンバーの顔写真が必要となっても、あまり持っていないもんです。 携帯で何枚か撮ったかもしれませんが、そんなに数は無いですよね。

合宿等の写真を拾い集める

会社の共有フォルダーに、合宿の写真が入ってました。

  • 沖縄合宿
  • 和歌山合宿
  • 淡路島合宿

こちらを使いましょう。

DLしてフォルダを開くと、こんな写真がいっぱいあります。

f:id:spookies-nishimura:20171014200226p:plain

続きを読む

プログラミングをやってみよう

プログラミングに興味はあるけど何やったらいいの?

こんにちは、ももです。

スプーキーズで働きはじめて1ヶ月。

ちょっとプログラミングの話もしてみたいなと思っておりました。

ただ、スーパープログラマではないひよっこですので技術的なことはまだまだです。

そこで今回は、プログラミング初心者である私がどんなサービスを利用してきたのかご紹介したいと思います。

私は、基本的にはWEBで提供されているものを利用していました。

プログラミングをやってみたいけど...

何したらいいかわからない

どんなことするの?

状態の方はまずは無料のWEBプログラミング学習サービスを利用してみましょう。

有名なものは

・ドットインストール

https://dotinstall.com/

・Progate

prog-8.com

・CODEPREP

codeprep.jp

でしょうか

私はこの3つをまんべんなく利用しています。

こちらは基本無料で、興味が湧いてきたら、月額の有料会員に切り替えが可能になります。

私は、ドットインストールとCODEPREPは無料会員ですが、Progateは有料会員です。

3つもあるけどどれがいいの?と思われるかもしれませんが

オススメはProgateとCODEPREPです。

ProgateかCODEPREPから始めると、プログラミングに必要な環境が整った状態ですので

簡単にプログラミングを体験することができます。初心者にはわかりやすいと思います。

私はとてもわかりやすかったです。

無料の部分でまずはプログラミングってどんな感じか試してみましょう。

触ってみると自分がプログラミングが好きか嫌いかもわかるのではないかと思います。

次に、ドットインストールですが、こちらは一回3分の動画をみる形の学習スタイルになります。

私がドットインストールに大変お世話になったのは、開発環境の構築です。

ドットインストールのいいところって隣でプログラミングを教えてくれてる感じがあるんですよね。

実際に画面上のどの部分を選択するのだとか、動作がとてもわかりやすいです。

私は、いろんなものを試したかったのでまんべんなくスタイルですが

一つに絞ってやるのも、もちろん人それぞれだと思います。

プログラミングに慣れてくるときっとWEBサービスだけでは、物足りなくなってくると思います。

そんな時がくれば、興味のある言語を選んで参考書を買ってみましょう!

もっと楽しい世界が広がると思いますよ!!私もそうでした

ちなみにスプーキーズでは、会社の参考書の貸し出しも行っていて自由に借りて、勉強できる制度も整っています。

プログラミングに興味があって勉強する意欲のある方!ぜひ、一緒にスプーキーズで働いてみませんか?

スプーキーズでは、一緒に働く仲間を募集しています!

f:id:spookies_momo:20170928191623j:plain

JavaScriptを高速化する5つの手法

こんにちは、モリタです。

JSを高速化 する

f:id:moritanian:20170926151527p:plain:w160

nativeに比べて遅いと言われるjsですがパフォーマンスチューニングによりずいぶん改善しているようです。しかしながらWebGLなどまだまだ高速化が必要な分野も数多くあります。そこで、今回はjavascriptを高速化する手法を簡単に見ていきたいと思います。

Typed Array

動的な配列であるjsの通常の配列に対し、固定長の配列であるTypedArrayが用意されています。低機能ですが、各要素に高速でアクセスする事ができます。以下のようにまずサイズを決めてバッファを確保してからTypedArrayを生成します。 canvasの getImageData () で取得できる画像データもTypedArrayのようですね。

var buffer = new ArrayBuffer(8); // 8byteのサイズのバッファ確保
var arr   = new Int32Array(buffer); // 32bit(4byte)のint配列
console.log(arr); // [0, 0]

WebAssembly

動的型付け言語であるJsは実行時に型チェックや型変換が行われ、それがネイティブに比べて遅くなる原因のひとつになっていました。そこでMozillaからasm.jsという手法が提案されました。asm.jsでは全ての変数が静的な型付けを行います。TypedArrayの考え方をさらに推し進めたものと言えるでしょう。

このasm.jsに対して各ブラウザベンダーが協力して策定しているバイナリフォーマットの規格がwebAssemblyです。 webAssemblyを利用するにはc, c++ コードをEmscriptenツールによって.wasmバイナリに変換するのが一般的なようです。  各ブラウザの実装状況は以下のようにデスクトップではほぼすべてのブラウザ最新で実装されています。 f:id:moritanian:20170926114309p:plain

また、unityのwebGLビルドでもオプション設定でwebAssemblyを使用できるようです。

WebWorker

jsは本来シングルスレッドで動作しますが、webWorkerを利用することでマルチスレッド動作を実現できます。 以下のように new Worker("ファイル名") で実行することができます。 また、postMessage() , onmessage() でスレッド間でデータをやり取りできます。

main.js

var myWorker = new Worker("worker.js"); // worker.js  を別スレッドで実行
 myWorker.postMessage([first.value,second.value]); // Sending message as an array to the worker
myWorker.onmessage = function(e) {
        result.textContent = e.data;
        console.log('Message received from worker');
    };

worker.js

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);
}

参考

github.com

gpgpu

gpgpuとは本来画像処理に使われるgpuの計算資源を画像処理以外の演算に使うことです。gpuは行列計算など計算密度が大き(条件分岐などが少ない)く、並列度が大きい演算に関してCPUに比べて性能を発揮します。最近は機械学習が利用例としてホットですね。 gpgpuを利用するために以下のライブラリがあります。 gpu.rocks

github.com

gpu.jsでは以下のように記述できます。

const gpu = new GPU();
const multiplyMatrix = gpu.createKernel(function(a, b) {
  var sum = 0;
  for (var i = 0; i < 512; i++) {
    sum += a[this.thread.y][i] * b[i][this.thread.x];
  }
  return sum;
}).setOutput([512, 512]);

const c = multiplyMatrix(a, b);

Simd

こちらも並列化により高速化を実現する試みの一種で命令セットレベルの並列化を実現します。 以下ではベクトル演算を並列化しています。

var a = SIMD.Float32x4(1, 2, 3, 4);
var b = SIMD.Float32x4(5, 6, 7, 8);
var c = SIMD.Float32x4.add(a,b); // Float32x4[6,8,10,12]

残念ながらEcmascriptでまだドラフト段階のためリリース版ブラウザの実装はまだのようです。

番外編

javasciptで演算子オーバーロードしたい

高速化とは全く関係ありませんがみなさんも一度はjsでも演算子オーバーロードしたいと思ったことがあるはずです。いや、そんなことはないですね。 少し気になったので調べてみたのですが結論としては、 【Javascript】演算子をオーバーロードしたい話 - Qiita にある通り普通のやり方では実現できずコードを構文解析して演算子オーバーロードしている箇所を書き換える必要があるようです。 そこで実際に実装してライブラリ化してみました!

GitHub - moritanian/minamike.js: このライブラリに過度な期待はしないでください

f:id:moritanian:20170926124329p:plain

このライブラリでCのstd::cout 風に記述するとこのようになります

const cout = "std::cout";
String.prototype.__operators__ = {
    "<<" : function(s1, s2){
        console.log(s2);
    }
  };
 
 
 cout << "Hello World!";

まあ、全く需要なさそうですが。

それではよきjsライフを!