2018/06/19

[JS]ゲーム内に重力を追加し自然なジャンプモーションを実装する(3パターンで実装)

アクションゲームになくてはならない要素、それはジャンプモーション!
今回はゲーム内に重力を加え、自然なジャンプモーションを実装する。

方法としては3通りあるので、それぞれ解説していく。

  • 三角関数(sin)を使う
    • 月面でジャンプしているようなふんわりしたモーション
  • 速度に加速度を足しこむ
    • 簡単で自然なジャンプモーション
  • 鉛直投げ上げの公式(y = v0t - 0.5gt^2)を使う
    • より自然界に近いジャンプモーション

2018/06/14

オフスクリーンCanvasにプリレンダリングし、描画内容を可視領域に表示する

Canvas APIを使ってブラウザゲームやアニメーションなど複雑な描画処理を行う場合、オフスクリーン(描画領域外)Canvasにプリレンダリングし、その内容を可視領域にあるCanvas要素にコピーし表示する手法がある。


利用シーン

たとえば15個の要素からなる背景があったとする。(下図参照)
可視領域内にあるCanvasにレンダリングしていると、1フレームごとに15回の描画処理が行われる。

それをあらかじめ背景用のオフスクリーンCanvasに描画しておいて、1フレームごとに可視領域内のCanvasにコピーして描画すると、背景の描画処理は1回ですむ。
負荷の高い描画処理が15→1回になることでパフォーマンス向上が見込めるという技だ。

2018/05/31

OpenFaaSでFaaS環境を用意しサーバーレスアーキテクチャを体験する

数年前から何かと「サーバーレス」がバズワードになっている。自分でサーバーを用意してAPIサーバーを立てて使うという時代から、人間はより本質的な部分に注力すべきという考え方からFaaS環境を使う時代に変わってきた。

ただ私自身、AWS LambdaやGCP Cloud Functionsなどのいわゆる「サーバーレス」というものを体験したことがない。それらのサービスは従量課金で一歩間違ったらクラウド破産しかねないため、その恐怖感もあったからだ。


しかしこのままでは時代の波に取り残されてしまうと思い、いろいろ調べたところOpenFaaSというOSSに出会った。

ということで、OpenFaaSを使って自分専用のFaaS環境を用意し、思う存分使ってみようと思う。


開発環境は以下のとおり。
  • CentOS@7.4
  • OpenFaaS@0.8.2
  • docker@18.03.1-ce
  • docker-compose@1.21.2