グランブルーファンタジー（グラブル）はどんな技術で動いているのか

グランブルーファンタジー（グラブル）も今年で4周年を迎えました。いろいろ問題もありましたが、なんとかサービスも続いています。

2018年の今となっては、リッチなブラウザゲームというものは普通になりましたが、グラブルには4年前当時としてはわりと珍しい技術が使われています。

自分が遊んでいるゲームはどんな技術で動いているのだろう？と気になる人も多いと思います。そこで、この記事では、グラブルを取り巻く技術について簡単に解説したいと思います。

ハッシュ化されたパスワードをJavaScriptで解析してみよう

インターネットを利用する上で常について回るのがセキュリティの話です。特にパスワードに関するセキュリティの話題は毎日尽きません。私たちは「このパスワードで大丈夫か」「破られはしないか」という不安を抱きながら、眠れない夜を過ごすことになります。

そこでちょっと気分転換をしてみましょう。今日だけはパスワードを破られる側ではなく、破る側に回ってみるのです。いろいろなことが学べますし、きっと楽しいはずです。

とりあえず動けばいい、の精神でコードを書ける個人開発とは違い、仕事やオープンソースプロジェクトにおけるコーディングでは、「他人が読むコード」を意識して書く必要があります。

他人が読むのですから、もちろんわかりやすいコードでなくてはなりません。でも、「わかりやすい」とは何でしょう。どうしたら実現できるのでしょう。

この記事では、他人が読む可能性があるコードを書くときに気をつけていた方がいい事項について、いくつか紹介します。

JavaScriptからのクリップボードの操作は、長いあいだ開発者たちに切望されていました。かつてはFlashを使って実現するハックなどがありましたが、各ブラウザがexecCommandによるクリップボード操作を実装したことで、現在は落ち着きつつあります。

ただ、APIが綺麗に整備されているとは言いにくく、あまり現代的ではありません。そこで、スマートかつ現代的にクリップボードを扱うことができる、Async Clipboard APIの実装が進みつつあります。

WebGL、大変ですよね。OpenGLベースなのでC言語っぽいAPIと付き合っていかなければならず、JavaScriptの文化とはなかなか馴染みません。

そこでWebGLをオブジェクト指向っぽく触れるように、WebGL2用のラッパーライブラリであるXenoGLを開発・公開しました。

WebGLを扱う際には行列計算というのがどうしても必要になってきます。だいたいは既存のライブラリを使ってなんとかしたりするのですが、現状あまり選択肢は多くありません。そこで新しいライブラリであるMatrixGLを作って公開しました。

2018年1月30日 by 古都こと Posted in IT Tagged CSS, JavaScript

Houdiniというプロジェクトをご存知ですか？HoudiniはJavaScirptからアクセスできるCSSの機能を広げ、プログラマブルなCSSを実現するためのものです。Houdiniが実現すれば、まるでハリー・フーディーニのように物事を自在に操れるようになること間違いなしです！

そんなHoudiniの中で、CSS Paint API（CSS Painting API）がChrome 65で実装予定です。 CSS Paint APIを使って、ブラウザの上の魔術であるHoudiniを体験してみましょう。

WebGL2ではTransformFeedbackという機能が使えるようになりました。TransformFeedbackがあればGPUでの計算結果をバッファに書き出すことができるようになります。これを使えば、なかなか面白いことができるようになります。

この記事では、TransformFeedbackを利用したGPGPUと、パーティクル描画について解説します。

前回の記事では、配列・オブジェクトというデータ構造について学びました。今回はオブジェクト指向という設計思想について学びましょう。

前回の記事では関数について学びました。今回は新しいデータ構造、配列・オブジェクトについて学びましょう。