プログラミング

フレームレートを指定して Canvas に描画するサンプルページを作りました

投稿日:2017年8月4日 更新日:

フレームレートを指定して Canvas に描画するサンプルページを作りました。

1. スクリーンショット

スクリーンショット

2. デモ

以下のURLでデモを見ることができます。

3. 説明

  • 1フレーム内にCanvasへの描画処理を実行します。
  • フレームレートを指定することができます。
  • 1フレームあたりに実行する描画処理の回数も指定することができます。
  • 描画処理の回数を増やしていくと、1フレームに想定された時間内に処理が終わらなくなることが分かります。

4. ソースコード

📂-プログラミング
-

執筆者:labo


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

web development

Web Development for Beginners を読む:レッスン11

目次1. はじめに2. Lesson 11: Creating a game using eventsEvent driven programmingCommon eventsCreating the …

web development

User Timing API を使って、特定の処理に掛かった時間を計測する

目次1. User Timing API について2. サンプルコード3. デモページ4. 参考仕様MDNブラウザの対応状況 1. User Timing API について User Timing L …

プログラミング

Rubyのように書け、Cのように速いプログラム言語 Crystal の基本的な使い方

Crystal というプログラミング言語の基本的な使い方について紹介します。 実際に「使ってみたい」「試してみたい」といった方に向けて、コードを書き始めるまでの導入方法について書きました。文法の説明な …

Web Components

Web Components のサンプルコード

Web Components を使ったサンプルコードを紹介します。

JavaScript でスロットマシーンを作ってみました(3回目)

「JavaScript でスロットマシーンを作ってみる」の3回目です。 今回は ゲームっぽくしてみました。 目次1. スクリーンショット2. デモページ3. 内容4. ソースコード5. 参考情報 1. …