今日読んだ本と感想。
Webテクノロジーが進化したことによりJavaScriptグラフィックスを使ったリッチなWebアプリケーション開発が可能になりました。本書ではJavaScriptによる最新のグラフィックスプログラミングについて解説します。ゲームやDHTMLエフェクト、HTML5 Canvasなどの実例を通して、高性能なJavaScriptグラフィックスの実装方法を学びます。グラフィックスやアニメーションだけでなく、WebSocketを用いた通信、Google Chart Tools、スマートフォン向けのトピックまで幅広く扱います。日本語版では、パソコン向けのWebゲームをjQuery Mobileでモバイル向けに改造し、PhoneGapでネイティブアプリへ変換する方法について加筆しました。
目次
まえがき
- 1章 コードの再利用と最適化
- 1.1 高速化
- 1.2 何をいつ最適化するか
- 1.3 自家製コードプロファイリング
- 1.4 JavaScriptの最適化
- 1.4.1 ルックアップテーブル
- 1.4.2 ビット演算、整数、2進数
- 1.5 jQueryとDOM操作の最適化
- 1.5.1 CSSスタイル変更の最適化
- 1.5.2 DOM挿入の最適化
- 1.6 その他の情報
- 2章 DHTML
- 2.1 DHTMLスプライトの作成
- 2.1.1 アニメーション
- 2.1.2 カプセル化と描画の抽象化(詳細隠蔽)
- 2.1.3 DOMの挿入と削除を最小化
- 2.1.4 スプライトのコード
- 2.1.5 簡単な Spriteアプリ
- 2.1.6 より動きのあるスプライト
- 2.2 jQueryプラグインに変換
- 2.3 タイマー、スピード、フレームレート
- 2.3.1 setIntervalとsetTimeoutの使用
- 2.3.2 タイマーの精度
- 2.3.3 一定スピードの実現
- 2.3.4 Internet Explorer 6の背景画像キャッシュ
- 3章 スクロール
- 3.1 CSSだけを使ったスクロール効果
- 3.2 JavaScriptを使ったスクロール
- 3.2.1 背景画像のスクロール
- 3.2.2 タイルベース画像のスクロール
- 4章 高度な UI
- 4.1 HTML5のフォーム
- 4.2 JavaScriptのUIライブラリ
- 4.2.1 jQueryUIを用いた Webインタフェース強化
- 4.2.2 ExtJSを用いた強力なUI
- 4.3 UI要素の自作
- 4.3.1 3D回転木馬の作成
- 5章 JavaScriptゲーム
- 5.1 ゲームで使うオブジェクトの概要
- 5.2 ゲームのコード
- 5.2.1 ゲーム全体で用いる変数
- 5.2.2 キーの読み込み
- 5.2.3 キャラクタの移動
- 5.2.4 簡単なアニメーション効果
- 5.2.5 衝突判定
- 5.2.6 インベーダー
- 5.2.7 プレイヤー
- 5.2.8 シールド
- 5.2.9 UFO
- 5.2.10 gameオブジェクト
- 5.2.11 ひとつにまとめる
- 6章 HTML5 Canvas
- 6.1 Canvasのサポート
- 6.2ビットマップかベクターか?あるいは、その両方か?
- 6.3 Canvasの制限
- 6.4 CanvasとSVGの比較
- 6.5 CanvasとFlashの違い
- 6.6 Canvasエクスポータ
- 6.7 Canvasの描画の基本
- 6.7.1 Canvas要素
- 6.7.2 描画コンテクスト
- 6.7.3 矩形の描画
- 6.7.4 直線と曲線を使ったパスの描画
- 6.7.5 ビットマップ画像の描画
- 6.7.6 色、境界線、塗り潰し
- 6.8 Canvasを使ったアニメーション
- 6.9 Canvasと再帰的な描画
- 6.9.1 Canvasによる樹木のページレイアウト
- 6.10 DHTMLスプライトをCanvasのスプライトに置き換える
- 6.10.1 CanvasSpriteオブジェクト
- 6.10.2 他のコード修正
- 6.11 CanvasとWebSocketを使ったグラフィカルなチャットアプリ
- 6.11.1 WebSocketの利点
- 6.11.2 WebSocketのサポートとセキュリティ
- 6.11.3 チャットアプリ
- 7章 ベクトル計算
- 7.1 ベクトルの演算
- 7.1.1 足し算と引き算
- 7.1.2 拡大・縮小
- 7.1.3 正規化
- 7.1.4 回転
- 7.1.5 内積
- 7.2 JavaScriptによるベクトルオブジェクトの作成
- 7.3 ベクトルを使った大砲シミュレーション
- 7.3.1 シミュレーション全体で用いる変数
- 7.3.2 弾丸
- 7.3.3 大砲
- 7.3.4 背景
- 7.3.5 メインループ
- 7.3.6 ページレイアウト
- 7.4 ロケットのシミュレーション
- 7.4.1 ゲームオブジェクト
- 7.4.2 障害物オブジェクト
- 7.4.3 ロケットオブジェクト
- 7.4.4 背景
- 7.4.5 衝突判定と反作用
- 7.4.6 ページレイアウト
- 7.4.7 改良・改造のアイデア
- 8章 Google Chart Tools
- 8.1 制限事項
- 8.2 グラフ一覧
- 8.3 画像グラフ
- 8.3.1 データ形式とグラフ分解能
- 8.3.2 動的なデータの使用
- 8.3.3 まとめ
- 8.4 インタラクティブなグラフ
- 8.4.1 インタラクティブなグラフのイベント
- 9章 jQuery Mobile
- 9.1 jQuery Mobileの基本
- 9.2 TilePic:モバイル向けのWebアプリ
- 9.2.1 TilePicゲームの説明
- 9.2.2 TilePicゲームのコード
- 9.3 PhoneGapとは
- 10章 PhoneGap
- 10.1 インストール
- 10.1.1 JDKのインストール
- 10.1.2 AndroidSDKのインストール
- 10.1.3 Eclipseのインストール
- 10.1.4 ADTのインストール
- 10.1.5 PhoneGapのインストール
- 10.2 Eclipseでの PhoneGapプロジェクトの作成
- 10.2.1 App.javaファイルの変更
- 10.2.2 AndroidManifest.xmlファイルの変更
- 10.2.3 簡単な Webアプリを作成してのテスト
- 10.2.4 TilePicアプリのテスト
- 付録 A ソケットサーバのソースコード
- 付録 B モバイル版Orbit Assault
- B.1 jQuery Mobileによるモバイル対応
- B.1.1 タッチによる砲台操作
- B.1.2 画面回転の対応
- B.1.3 ページレイアウト
- B.2 PhoneGapによるネイティブアプリ化
本書の原書、Supercharged Javascript GraphicsはJavaScript Development and ResourcesでAdvancedにあったから、難しいのかなぁと思ったけど私のJavaScriptの知識でも十分理解しながら楽しく読み進めることができた。(私のJavaScriptのレベルは本ブログのJavaScriptラベルの記事等で判断してください。m(_ _)m)
もちろん本書の題名にもある通り、JavaScriptのグラフィックの全般、いろいろな方法、使い方等について知ることができてに面白かったけど、特にベクトルを使った部分がとても面白かった。簡単なベクトルの予備知識(あるいは簡単な基礎の部分だけだから予備知識がなくても、本書を読みながらちょっと調べるだけで十分理解できると思う)とJavaScriptを組み合わせるだけで楽しいことが出来るということを知る事ができて大満足した。JavaScriptの本を読んでるのに数学のベクトルの凄さ、面白さ、便利さを再認識できた。
ただ、JavaScriptについては最初に書いたように難易度的にはadvancedみたいだし、ベクトルについても、必要な予備知識は簡単な基礎の部分とはいっても算数、数学が苦手、好きではないという方には大変だろうから、誰でも楽しく読み進められる本というわけではないかも。
ということで、本書のおかげでJavaScriptのグラフィックスについてだけではなく、ベクトルの面白さも思い出す事ができたので、しばらく止まったままになってる数学学習を再開して、ベクトルのこともいろいろ思い出そうかなあと思った今日この頃。
0 コメント:
コメントを投稿