タグ

2015年4月2日のブックマーク (9件)

  • create.js の使い方 - Qiita

    <html lang="ja"> <head> <meta charset="UTF-8"> <title>canvas</title> </head> <body> <canvas id="my-canvas" width="640" height="480"></canvas> <script src="https://code.createjs.com/easeljs-0.8.2.min.js"></script> <script> window.onload = function() { // 使用するcanvasを取得 var canvas = document.getElementById("my-canvas"); // ステージを関連付ける var stage = new createjs.Stage( canvas ); // 赤い丸を描画 var circle = ne

    create.js の使い方 - Qiita
  • UNTITLED

  • WebGLに対応し高速化したCreateJSの描画性能を探る - ICS MEDIA

    インタラクティブコンテンツ制作に役立つHTML5向けのフレームワークCreateJS (使い方は入門サイトを参照ください)。2014年1月に公式ブログでWebGLサポートが発表されました(参照記事「WebGL Support in EaselJS」)。公式ブログによるとパフォーマンスが従来比の6〜50倍にも達するとのことです。 果たしてどのぐらいの性能があるのか気になりましたので、以前の検証記事「HTML5開発者必見、最速のJavaScriptライブラリはどれだ!? パフォーマンスの徹底検証」を元に、WebGL対応版のCreateJS(描画を扱うJSライブラリ「EaselJS」)のパフォーマンスを比較検証してみました。検証に用いたデモは次のリンクをクリックすることで再生できます。 CreateJS (EaselJS 0.7.1) : 従来版。CanvasのContext2Dが利用されている

    WebGLに対応し高速化したCreateJSの描画性能を探る - ICS MEDIA
  • HTML5 Canvasパフォーマンスチューニング

    以前、HTML5 Canvasで表現する打ち上げ花火として、Canvasを使った作品をご紹介しましたが、 PC版Webkitを除く全てのブラウザ(スマホブラウザは勿論、IE9など)で重いという課題がありました。 PCブラウザに限定すれば、ブラウザやハードウェアの進化ととも改善される問題ではありますが、 スマホ(に限らず携帯端末)は2年縛りで購入するユーザーが圧倒的に多く、1・2年前の機種(環境)を使用する状況が続くことが容易に想像できます。 スマホサイトやアプリ制作を手掛けたことのある方はご存知の通り、Android2.xは色々と不都合があるだけでなく パフォーマンス面でも十分に配慮して制作する必要があります。 (Android4.xではGPUアクセラレーションがサポートされ、期待出来るのですが世代交代は先の話) そこで、エントリーではロジックを工夫することで得られたパフォーマンス改善の

  • requestAnimationFrame でフレームと再描画更新を制御する | Yomotsu net

    Canvas や SVG などを用いて、アニメーションを行う場合の描画繰り返しについて考えます。 描画の繰り返しアニメーションには requestAnimationFrame や setTimeout など利用し、そのタイミングで再描画を繰り返すという手法が一般的です。 これまで、 setTimeout を利用することが主流で、60 FPS のアニメーションの場合は例えば以下の様なコードで実現することも多かったかと思います。 var x = 0; ( function loop(){ setTimeout( loop, 1000 / 60 ); x += 1; console.log( x ); } )(); ただし、setTimeout や setInterval は、ブラウザー側で再描画の準備が整っているか否かにかかわらず、必ず実行されてしまいます。また、ブラウザーのタブが非表示 (バ

    requestAnimationFrame でフレームと再描画更新を制御する | Yomotsu net
  • ■音ゲーをつくろ~ ♪(^^)♪

  • dfltweb1.onamae.com – このドメインはお名前.comで取得されています。

    このドメインは お名前.com から取得されました。 お名前.com は GMOインターネットグループ(株) が運営する国内シェアNo.1のドメイン登録サービスです。 ※表示価格は、全て税込です。 ※サービス品質維持のため、一時的に対象となる料金へ一定割合の「サービス維持調整費」を加算させていただきます。 ※1 「国内シェア」は、ICANN(インターネットのドメイン名などの資源を管理する非営利団体)の公表数値をもとに集計。gTLDが集計の対象。 日のドメイン登録業者(レジストラ)(「ICANNがレジストラとして認定した企業」一覧(InterNIC提供)内に「Japan」の記載があるもの)を対象。 レジストラ「GMO Internet Group, Inc. d/b/a Onamae.com」のシェア値を集計。 2023年5月時点の調査。

    faibou
    faibou 2015/04/02
  • 50行で作る、HTML5+JavaScriptを使った簡単ライフゲームづくり - コードレシピ

    ライフゲームを知っていますか?ライフゲームは世界でとっても有名なシミュレーションゲームです。Wikipediaによると、 1970年にイギリスの数学者ジョン・ホートン・コンウェイ (John Horton Conway) が考案した生命の誕生、進化、淘汰などのプロセスを簡易的なモデルで再現したシミュレーションゲームである。 らしいです。 眺めているだけでもさまざまなパターンを観測することができてとても興味深く、魅力的なゲームです。 また、ライフゲームの世界は非常に単純なルールで成り立っています。つまり、僕を含めたプログラミング初心者にはうってつけの題材なのかもしれません。また今回はHTML5とJavaScriptで作ります。"index.html"と"main.js"の2ファイルだけでゲームが完成します。特殊なソフトウェアは必要ありません。 更に50行でコードが完成してしまうので、気軽にプ

    50行で作る、HTML5+JavaScriptを使った簡単ライフゲームづくり - コードレシピ
    faibou
    faibou 2015/04/02
  • 「tail -f」を使うのは情弱、情強は「less +F」を使う | ソフトアンテナ

    ログファイルの監視に「tail -f」コマンドを使っている方は多いかもしれません。ファイルの末尾を表示する「tail」コマンドに、ファイル末尾に追加されたデータを追跡表示する「-f」オプションを指定することで、手軽にログの監視ができる便利なコマンドです。 しかし最近、「tail -f」より便利なコマンドとして「less +F」の使用を推奨するブログ記事「Stop using tail -f (mostly)」が公開され話題となりました。 「less」はテキストファイルの内容を表示する、ページャーと呼ばれるソフトウェアですが、これに「+F」オプションを指定することで、「tail -f」より便利なファイル監視コマンドとして使えるらしいのです。具体的に「less +F」が「tail -f」より便利な点として以下の2点が挙げられています。 監視モードと通常モードをlessを起動したまま行き来できる

    「tail -f」を使うのは情弱、情強は「less +F」を使う | ソフトアンテナ