book

ハンズオンJavaScript

Name: ハンズオンJavaScript
Author: あんどうやすし
ISBN: 9784873119229

by あんどうやすし

November 2020

Intermediate to advanced

740 pages

9h 12m

Japanese

O'Reilly Japan, Inc.

Read now

Unlock full access

　大扉
　クレジット
　　
　まえがき
　　本書のコンセプト　　誰のための本か　　誰のための本ではないか　　本書の構成　　動作環境　　表記上のルール　　意見と質問　　謝辞
　1章　学び始めるまえに
　　1.1　プログラムについて　　1.2　JavaScriptについて　　　1.2.1　JavaScriptを始める　　　1.2.2　JavaScriptを続ける　　　1.2.3　JavaScriptの価値　　1.3　Chrome DevToolsの概要を理解する　　　1.3.1　起動する　　　1.3.2　コンソールを開く　　　1.3.3　JavaScriptのコードを実行する　　1.4　JavaScript文法の概要を理解する　　　1.4.1　各概念の関係を理解する　　　1.4.2　1次元セルオートマトン　　　1.4.3　セルオートマトン実装を確認する　　　　1.4.3.1　index.html　　　　1.4.3.2　ca.js　　1.5　Chrome DevToolsの実践的な使い方を理解する　　1.6　まとめ　　1.7　練習問題
　2章　データを学ぶ
　　2.1　データの種類　　2.2　リテラル　　2.3　定数　　　　　名前重要　　　2.3.1　識別子に利用できる文字　　　2.3.2　識別子に利用できない語　　2.4　変数　　　2.4.1　変数を宣言する　　　2.4.2　変数に値を代入する　　　2.4.3　変数と定数の使い分け　　2.5　Undefined　　2.6　Null　　2.7　真偽値　　　2.7.1　論理演算子　　　2.7.2　論理演算　　　2.7.3　論理演算子を真偽値型以外に適用する　　　2.7.4　デフォルト値の設定に論理演算子を使用する　　　2.7.5　等価演算子　　　　2.7.5.1　厳密な等価演算子　　　　2.7.5.2　厳密な不等価演算子　　　　2.7.5.3　抽象的な等価演算子　　　　2.7.5.4　抽象的な不等価演算子　　2.8　数値　　　2.8.1　指数表現　　　2.8.2　10進数以外の数　　　2.8.3　数値演算　　　2.8.4　ビット演算　　　2.8.5　代入演算子　　　2.8.6　関係演算子　　　2.8.7　演算子の優先順位　　2.9　長整数　　2.10　文字列　　　2.10.1　文字列を連結する　　　2.10.2　文字を取り出す　　2.11　テンプレート　　　2.11.1　文字列に改行を含める　　　2.11.2　文字列にJavaScriptの式を埋め込む　　2.12　配列　　　2.12.1　配列を作成する　　　2.12.2　配列の要素を取得する　　　　2.12.2.1　複数の要素をまとめて取得する　　　2.12.3　配列の要素を設定する　　2.13　オブジェクト　　　2.13.1　オブジェクトを作成する　　　2.13.2　プロパティの値を取得する　　　2.13.3　プロパティの値をまとめて取得する　　　2.13.4　複雑な構造のオブジェクトから値をまとめて取得する　　　2.13.5　プロパティに値を設定する　　　2.13.6　プロパティの有無を確認する　　　2.13.7　プロパティを削除する　　　2.13.8　オブジェクトの同一性を比較する　　2.14　まとめ　　2.15　練習問題
　3章　処理を学ぶ
　　3.1　構造化定理　　3.2　文と式　　3.3　処理をつなげる　　　3.3.1　文をつなげる　　　3.3.2　文をまとめる　　　3.3.3　式をまとめる　　3.4　処理を分岐する　　　3.4.1　if　　　3.4.2　switch　　　3.4.3　条件演算子　　3.5　処理を繰り返す　　　3.5.1　for　　　3.5.2　for-of　　　3.5.3　for-in　　　3.5.4　while　　　3.5.5　do ... while　　3.6　関数　　　3.6.1　関数を実行する　　　3.6.2　関数を定義する　　　　3.6.2.1　関数名　　　　3.6.2.2　仮引数リスト　　　　3.6.2.3　関数定義の中で関数自身を呼び出す　　　3.6.3　式で関数を定義する　　　　3.6.3.1　通常の関数宣言の代わりに関数式を使用する　　　　3.6.3.2　関数式を引数として使用する　　　　3.6.3.3　関数式を戻り値として使用する　　　　3.6.3.4　再帰関数を関数式で定義する　　　　3.6.3.5　アロー関数　　　3.6.4　タグ関数を使用してテンプレート文字列を処理する　　3.7　エラーを処理する　　　3.7.1　エラーの種類　　　3.7.2　エラーを投げる　　　3.7.3　エラーを捕捉する　　3.8　まとめ　　3.9　練習問題
　4章　オブジェクトを学ぶ
　　4.1　オブジェクト指向　　　4.1.1　オブジェクトの型同士の関係　　4.2　オブジェクト指向プログラミング　　4.3　関数から自身が所属するオブジェクトにアクセスする　　4.4　クラスを定義する　　　4.4.1　スーパークラスを継承する　　　4.4.2　インスタンスを生成する　　　4.4.3　ゲッター／セッターを定義する　　　4.4.4　静的メソッドを定義する　　　4.4.5　クラスを式で定義する　　4.5　オブジェクトリテラル再び　　　4.5.1　メソッドを定義する　　　4.5.2　継承　　4.6　Objectクラス　　　4.6.1　すべてのオブジェクトのメソッドとして利用できる機能　　　　4.6.1.1　プロパティを調べる　　　　4.6.1.2　文字列に変換する　　　4.6.2　Objectクラス経由で利用する機能　　　　4.6.2.1　オブジェクトを生成する　　　　4.6.2.2　オブジェクトの拡張性を管理する　　　　4.6.2.3　プロパティを一覧する　　　　4.6.2.4　プロパティを管理する　　　　4.6.2.5　プロパティをコピーする　　　　4.6.2.6　オブジェクトの同一性を確認する　　　　4.6.2.7　オブジェクトのクラスを確認する　　4.7　まとめ　　4.8　練習問題
　5章　モジュールを学ぶ
　　5.1　HTMLファイルでモジュールとしてJavaScriptファイルを読み込む　　5.2　他のモジュールで外部公開されたオブジェクトを使用する　　　5.2.1　オブジェクトを指定してインポートする　　　　5.2.1.1　別名を付けてインポートする　　　　5.2.1.2　モジュールオブジェクトのプロパティとしてインポートする　　　5.2.2　デフォルトエクスポートをインポートする　　5.3　動的にモジュールをインポートする　　5.4　モジュール内で定義されたオブジェクトをエクスポートする　　　5.4.1　名前付きエクスポートする　　　5.4.2　デフォルトエクスポートする　　5.5　インポートしたオブジェクトをエクスポートする　　　5.5.1　インポートした名前付きエクスポートをエクスポートする　　　5.5.2　インポートしたデフォルトエクスポートをエクスポートする　　5.6　まとめ　　5.7　練習問題
　6章　基本的な標準オブジェクトを学ぶ
　　6.1　プリミティブに対応するオブジェクト　　　6.1.1　オブジェクトとプリミティブを相互に変換する　　　6.1.2　Booleanオブジェクト　　　6.1.3　Numberオブジェクト　　　　6.1.3.1　数値の内部的な表現を理解する　　　　6.1.3.2　さまざまな最大値と最小値　　　　6.1.3.3　特殊な数を利用する　　　　　無限大と非数の内部表現　　　　6.1.3.4　文字列から数値に変換する　　　　6.1.3.5　数値から文字列に変換する　　　　　数値のプロパティアクセスについて　　　　6.1.3.6　数学の関数を利用する　　　6.1.4　BigIntオブジェクト　　　6.1.5　Stringオブジェクト　　　　6.1.5.1　文字列の内部的な表現を理解する　　　　6.1.5.2　文字列の一部を取り出す　　　　6.1.5.3　文字列を調べる　　　　6.1.5.4　文字列を変更する　　　　6.1.5.5　文字列を分割／結合する　　　　6.1.5.6　Unicodeを扱う　　　6.1.6　Symbolオブジェクト　　　　6.1.6.1　シンボルをプロパティのキーとして使用する　　　　6.1.6.2　グローバルシンボルレジストリを利用する　　　　6.1.6.3　Well-Known Symbol　　6.2　直接生成できるオブジェクト　　　6.2.1　Functionオブジェクト　　　6.2.2　RegExpオブジェクト　　　　6.2.2.1　繰り返しを指定する　　　　6.2.2.2　パターンの分岐を指定する　　　　6.2.2.3　正規表現の一部をグループ化する　　　　6.2.2.4　文字種を指定する　　　　6.2.2.5　位置を指定する　　　　6.2.2.6　オプションフラグを指定する　　　　6.2.2.7　文字列のメソッドで正規表現を利用する　　　　6.2.2.8　正規表現オブジェクトを使用する　　6.3　globalThisオブジェクト　　　6.3.1　組み込み関数　　6.4　まとめ　　6.5　練習問題

　7章　コレクションを学ぶ
　　7.1　Array　　　7.1.1　配列を生成する　　　　　配列風オブジェクトとArray.from()　　　7.1.2　配列を調べる　　　7.1.3　配列を検索する　　　7.1.4　配列を並べ替える　　　7.1.5　配列の要素を順に処理する　　　7.1.6　配列の要素をまとめて更新する　　　7.1.7　配列から異なる配列を生成する　　　7.1.8　配列の各要素を処理してひとつの値を返す　　　7.1.9　配列を結合する　　　7.1.10　配列をスタックやキューとして扱う　　7.2　TypedArray　　　7.2.1　型付き配列の種類　　　7.2.2　配列と共通する機能　　　7.2.3　配列にあり型付き配列にはない機能　　　7.2.4　配列になく型付き配列にある機能　　7.3　Map　　　7.3.1　Mapを生成する　　　7.3.2　Mapのエントリ数を取得する　　　7.3.3　Mapの値にアクセスする　　　7.3.4　Mapの要素を削除する　　　7.3.5　Mapの要素を順に処理する　　7.4　Set　　　7.4.1　Setを生成する　　　7.4.2　Setのエントリ数を取得する　　　7.4.3　Setのエントリにアクセスする　　　7.4.4　Setのエントリを削除する　　　7.4.5　Setの要素を順に処理する　　7.5　WeakMap　　　7.5.1　メモリ管理と弱参照　　　7.5.2　WeakMapの特徴　　　7.5.3　WeakMapのメソッド　　7.6　WeakSet　　　7.6.1　WeakSetのメソッド　　7.7　イテレータ　　　　　クロージャ　　　7.7.1　イテラブル　　7.8　ジェネレータ関数　　　7.8.1　ジェネレータ関数宣言　　　7.8.2　ジェネレータ式　　　7.8.3　ジェネレータメソッド　　　7.8.4　ジェネレータオブジェクトのメソッド　　7.9　まとめ　　7.10　練習問題
　8章　複雑なデータの扱いを学ぶ
　　8.1　バイナリデータ　　　8.1.1　バイナリデータとテキストデータ　　　8.1.2　バイナリデータをそのまま保持する　　　8.1.3　バイナリデータを読み書きする　　　　8.1.3.1　ひとつの型からなるバイナリデータを扱う　　　　8.1.3.2　さまざまな型のバイナリデータを統一的に扱う　　8.2　JavaScript Object Notation（JSON）　　　8.2.1　JSONとオブジェクトリテラルの違い　　　8.2.2　JSON形式の文字列をオブジェクトに変換する　　　8.2.3　オブジェクトをJSON形式の文字列に変換する　　　8.2.4　オブジェクトをディープコピーする　　8.3　まとめ　　8.4　練習問題
　9章　国際化を学ぶ
　　9.1　日時を扱う　　　9.1.1　日付を作成する　　　9.1.2　Dateオブジェクトのプロパティにアクセスする　　9.2　言語や地域を指定する　　9.3　日時の表記を国際化する　　9.4　数値の表記を国際化する　　　9.4.1　数値の桁数を指定する　　　9.4.2　通貨の表記を国際化する　　9.5　文字列の並べ替え順を国際化する　　9.6　まとめ　　9.7　練習問題
　10章　非同期処理を学ぶ
　　　　　イベントループ　　10.1　コールバック関数　　　10.1.1　コールバック関数の問題　　10.2　Promise　　　10.2.1　Promiseの状態　　　10.2.2　Promiseを作成する　　　10.2.3　完了時の処理を記述する　　　10.2.4　複数の非同期処理をまとめて扱う　　　10.2.5　非同期処理を同期処理のように記述する　　　10.2.6　非同期処理を繰り返す　　10.3　まとめ　　10.4　練習問題
　11章　メタプログラミングを学ぶ
　　　　　インタプリタ型言語とコンパイラ型言語　　11.1　Proxy　　　11.1.1　プロキシを作成する　　　11.1.2　プロパティアクセスをプロキシする　　　11.1.3　関数やコンストラクタの呼び出しをプロキシする　　　11.1.4　拡張可能性へのアクセスをプロキシする　　　11.1.5　プロパティ定義へのアクセスをプロキシする　　　11.1.6　取り消し可能なProxyを作成する　　11.2　Reflect　　　11.2.1　トラップの実装に利用する　　　11.2.2　単独で利用する　　11.3　まとめ　　11.4　練習問題
　12章　Webを学ぶ
　　12.1　Web（ウェブ）　　　12.1.1　HTML　　　12.1.2　CSS　　　12.1.3　JavaScript　　12.2　グローバルオブジェクト　　　12.2.1　console　　　12.2.2　location　　　12.2.3　navigator　　12.3　ドキュメントオブジェクトモデル　　　12.3.1　DOMの構造　　　12.3.2　主要なオブジェクト　　　12.3.3　要素の階層をたどる　　　12.3.4　要素を検索する　　　12.3.5　要素の情報を調べる　　　12.3.6　要素の属性を操作する　　　12.3.7　要素のコンテンツを操作する　　　12.3.8　要素を削除する　　　12.3.9　要素を追加する　　　12.3.10　要素を入れ替える　　　　　contentEditable　　12.4　CSSオブジェクトモデル　　　12.4.1　主要なオブジェクト　　　12.4.2　ルールを確認する　　　12.4.3　ルールを書き換える　　　12.4.4　新しいルールを追加する　　　12.4.5　既存のルールを削除する　　12.5　イベント　　　12.5.1　イベントを処理する　　　12.5.2　代表的なイベントを使用する　　　　12.5.2.1　キーボードイベント　　　　12.5.2.2　マウスイベント　　　12.5.3　イベントを作成する　　　12.5.4　イベントハンドラの探索順序を理解する　　　　12.5.4.1　イベントの伝播を止める　　　　12.5.4.2　イベントのデフォルトの動作を止める　　12.6　Web Components　　　12.6.1　Custom Elements　　　12.6.2　Shadow DOM　　　12.6.3　HTML Template　　12.7　まとめ　　12.8　練習問題
　13章　ネットワークを学ぶ
　　13.1　Webにおけるネットワーク通信の基礎を理解する　　　13.1.1　URI　　　13.1.2　HTTP　　　　13.1.2.1　HTTPの概要を理解する　　　　13.1.2.2　HTTPリクエストを送信する　　　　13.1.2.3　HTTPレスポンスを確認する　　　　13.1.2.4　Chrome DevToolsでリクエスト／レスポンスを確認する　　13.2　Web API　　　13.2.1　REST　　13.3　リソースを取得する　　　13.3.1　レスポンスを確認する　　13.4　リソースを追加する　　13.5　リクエストの失敗を処理する　　13.6　ビーコンを送信する　　13.7　HTTP以外のプロトコルを把握する　　13.8　まとめ　　13.9　練習問題
　14章　ストレージを学ぶ
　　14.1　Cookie　　　14.1.1　Cookieの内容を確認する　　　14.1.2　Cookieに値を設定する　　　14.1.3　Cookieに属性を設定する　　14.2　Web Storage　　　14.2.1　Storageの値を読み取る　　　14.2.2　Storageに値を設定する　　　14.2.3　Storageの値を削除する　　　14.2.4　Storageのキーをすべて確認する　　　14.2.5　Storageのイベントを処理する　　14.3　IndexedDB　　　14.3.1　全体像を理解する　　　14.3.2　データベースに接続する　　　14.3.3　オブジェクトストアを作成する　　　14.3.4　インデックスを定義する　　　　　インデックスの原理を理解する　　　14.3.5　オブジェクトを追加する　　　　　トランザクションを理解する　　　14.3.6　キーを使用してオブジェクトを取得する　　　14.3.7　インデックスを使用してオブジェクトを取得する　　　14.3.8　カーソルを使用してオブジェクトを取得する　　　14.3.9　オブジェクトを更新する　　　14.3.10　オブジェクトを削除する　　14.4　まとめ　　14.5　練習問題
　15章　マルチメディアを学ぶ
　　15.1　DOM　　　15.1.1　画像タグを利用する　　　15.1.2　動画タグを利用する　　　　15.1.2.1　イベントを監視する　　　15.1.3　音声タグを利用する　　15.2　CSS　　　15.2.1　CSSを使用して画像を移動する　　　15.2.2　CSSを使用して画像処理する　　　15.2.3　CSSを使用してアニメーションする　　　15.2.4　クラスを利用する　　15.3　SVG　　15.4　Canvas　　　15.4.1　図形を書く　　　15.4.2　描画のスタイルを設定する　　　15.4.3　画像を表示する　　　15.4.4　ピクセルを操作する　　　15.4.5　オフスクリーンバッファを利用する　　15.5　WebGL　　　15.5.1　WebGLの利点　　　15.5.2　GPU　　　15.5.3　ポリゴン　　　15.5.4　シェーダー　　　15.5.5　レンダリングパイプライン　　　15.5.6　ポリゴンを描画する　　15.6　Web Audio　　　15.6.1　音の内部表現を理解する　　　15.6.2　音を再生する　　　15.6.3　音にフィルタをかける　　　15.6.4　音を重ね合わせる　　　15.6.5　音を合成する　　　15.6.6　周波数を分析する　　15.7　マルチメディア系のアプリケーションでよく使用されるAPI　　　15.7.1　定期的に処理を繰り返す　　　15.7.2　フルスクリーンでアプリケーションを利用する　　　15.7.3　マウスポインタをロックする　　　　15.7.3.1　マウスイベントを使用する　　15.8　まとめ　　15.9　練習問題
　16章　センサーとデバイスを学ぶ
　　16.1　Chrome DevToolsをAndroid端末に接続する　　　16.1.1　Android端末のUSBデバッグを有効にする　　　16.1.2　Chrome DevToolsをリモートデバイスに接続する　　16.2　センサー　　　16.2.1　デバイスの位置を取得する　　　　　緯度と経度から住所を取得する　　　16.2.2　デバイスの向きを取得する　　　　16.2.2.1　デバイスの位置や向きの変化をテストする　　　16.2.3　画面の向きの変化を取得する　　　　16.2.3.1　画面の向きの変化をテストする　　　16.2.4　センサーを利用する　　　　16.2.4.1　デバイスの加速度を捕捉する　　　　16.2.4.2　デバイスの角加速度を捕捉する　　　　16.2.4.3　デバイスの動きを捕捉する　　16.3　デバイス　　　16.3.1　デバイスを振動させる　　　16.3.2　Webカメラを利用する　　16.4　まとめ　　16.5　練習問題
　17章　PWAを学ぶ
　　17.1　Service Worker　　　17.1.1　Service Workerのライフサイクルを理解する　　　17.1.2　Service Workerの利用を開始する　　　17.1.3　HTTPリクエストをプロキシする　　　17.1.4　キャッシュを利用してオフラインで動作させる　　　17.1.5　プッシュ通知を利用する　　　　17.1.5.1　プッシュ通知の仕組みを理解する　　　　17.1.5.2　プッシュ通知を登録する　　　　17.1.5.3　プッシュ通知を受け取る　　　　17.1.5.4　通知ダイアログを表示する　　17.2　Web App Manifest　　　17.2.1　アプリに関する情報を提供する　　　17.2.2　アプリをホーム画面に追加する　　17.3　ネイティブアプリを超える　　　17.3.1　Web Share API　　　17.3.2　Payment Request API　　17.4　まとめ　　17.5　練習問題
　18章　セキュリティを学ぶ
　　18.1　サンドボックス　　　18.1.1　同一オリジンポリシー　　　　18.1.1.1　CORS　　18.2　代表的な攻撃　　　18.2.1　クロスサイトスクリプティング　　　18.2.2　クロスサイトリクエストフォージェリ　　　18.2.3　セキュリティ機能　　18.3　ブラウザに保存された認証情報を利用する　　　18.3.1　パスワード認証を自動的に行う　　　18.3.2　IDプロバイダを使用した認証を自動的に行う　　　18.3.3　ログインに使用するアカウントを選択する　　　　　認可情報を削除する　　18.4　公開鍵暗号を使用してログインする　　　18.4.1　公開鍵暗号方式を理解する　　　18.4.2　WebAuthnの処理の流れを理解する　　　　18.4.2.1　公開鍵登録の流れを理解する　　　　18.4.2.2　認証の流れを理解する　　　18.4.3　WebAuthnの認証情報を生成する　　　18.4.4　WebAuthnの認証情報を取得する　　18.5　まとめ　　18.6　練習問題
　19章　パフォーマンスを学ぶ
　　19.1　パフォーマンスを定義する　　19.2　パフォーマンスを評価する　　　19.2.1　Chrome DevToolsを使用する　　　　19.2.1.1　［Lighthouse］タブを使用する　　　　19.2.1.2　［Performance］タブを使用する　　　19.2.2　独自に評価する　　　　19.2.2.1　詳細な時間を測定する　　　　19.2.2.2　リソース読み込みのパフォーマンスを確認する　　　　19.2.2.3　Webサイト表示のパフォーマンスを確認する　　　　19.2.2.4　独自のパフォーマンスを測定する　　　　19.2.2.5　パフォーマンスエントリの追加を監視する　　19.3　パフォーマンスを改善する　　　19.3.1　Web Worker　　　　19.3.1.1　ワーカーを開始する　　　　19.3.1.2　ワーカーとメッセージをやりとりする　　　　19.3.1.3　ワーカーで発生した例外を捕捉する　　　　19.3.1.4　ワーカーとやりとりするデータについて理解する　　　　19.3.1.5　ワーカーに別のスクリプトファイルを取り込む　　　　19.3.1.6　ワーカーでcanvasに描画する　　　　19.3.1.7　ワーカーを共有する　　　19.3.2　WebAssembly　　　　19.3.2.1　JavaScriptからwasmで記述された関数を呼び出す　　19.4　まとめ　　19.5　練習問題
　20章　学び続けるために
　　20.1　ECMAScript　　　20.1.1　標準化プロセス　　20.2　Web API　　　20.2.1　標準化プロセス　　20.3　参考サイト　　　20.3.1　TC39　　　20.3.2　JavaScriptエンジン　　　20.3.3　Web技術全般　　20.4　まとめ　　20.5　練習問題
　付録A　JavaScriptのオブジェクト指向
　　A.1　プロトタイプチェーン　　A.2　コンストラクタ　　A.3　継承　　A.4　クラス
　付録B　ローカル環境でサポートサイトを動作させる
　　B.1　サポートサイトのコードを取得する　　B.2　Webサーバを起動する
　付録C　練習問題の解答
　　C.1　1章学び始めるまえに　　C.2　2章データを学ぶ　　C.3　3章処理を学ぶ　　C.4　4章オブジェクトを学ぶ　　C.5　5章モジュールを学ぶ　　C.6　6章基本的な標準オブジェクトを学ぶ　　C.7　7章コレクションを学ぶ　　C.8　8章複雑なデータの扱いを学ぶ　　C.9　9章国際化を学ぶ　　C.10　10章非同期処理を学ぶ　　C.11　11章メタプログラミングを学ぶ　　C.12　12章 Webを学ぶ　　C.13　13章ネットワークを学ぶ　　C.14　14章ストレージを学ぶ　　C.15　15章マルチメディアを学ぶ　　C.16　16章センサーとデバイスを学ぶ　　C.17　17章 PWAを学ぶ　　C.18　18章セキュリティを学ぶ　　C.19　19章パフォーマンスを学ぶ　　C.20　20章学び続けるために
　奥付

Content preview from ハンズオンJavaScript

19章パフォーマンスを学ぶ

パフォーマンスとはサイトの重要な要素が表示されるまでの時間やすべての読み込みが完了するまでの時間、サイトの操作が実際に可能になるまでの時間、何らかの操作に対してレスポンスが返るまでの時間など、非機能要件のうち時間に関わる指標を包括的に表す言葉です。

パフォーマンスは重要です。これはパフォーマンスのよいWebアプリやライブラリは利用して快適であるというプラスの意味合いもありますが、それ以上にパフォーマンスが極端に悪いサービスやライブラリはそもそも利用してもらえないという部分が重要です。どんなにすばらしい機能を持つWebアプリだったとしても実際に画面が表示されるまでに何十秒もかかるようではほとんどのユーザーは利用に至る前に離脱してしまうでしょう。

Webアプリに限らず、あらゆるシステムでパフォーマンスを改善する手順はほぼ共通です。

具体的な数値としてパフォーマンスを測定可能にするための基準（メトリクス）とその目標値を決定する
定義したメトリクスに従ってパフォーマンスを測定する
システムに何らかの修正を加えてメトリクスを測定し、2の値より改善が見られれば修正を取り込み、改善が見られなければ修正を破棄する
目標値に達するまで3.のステップを繰り返す

本章ではWebサイトでの上記の1.から3.のステップについて、そのために利用できるAPIとあわせて説明します。

19.1　パフォーマンスを定義する

WebサイトはHTMLや画像、CSS、JavaScriptなどさまざまな要素が組み合わさって動作し、その目的もさまざまであるため、Webサイトのパフォーマンスといっても一義的に決まるものではありません。また、Webサイト自体もまったく何も表示されていない状態からユーザーの入力を受け付けられる状態になるまで、連続的に変化していくものであるため、パフォーマンスといってもどの状態からどの状態までの時間を測定すべきかという問題があります。 ...

Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.

Read now

Unlock full access

More than 5,000 organizations count on O’Reilly

O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.

Julian F.

Head of Cybersecurity

I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.

Addison B.

Field Engineer

I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.

Amir M.

Data Platform Tech Lead

I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.

Mark W.

Embedded Software Engineer

Publisher Resources

ISBN: 9784873119229Other

Cloud Computing

Data Engineering

Data Science

AI & ML

Programming Languages

Software Architecture

IT/Ops

Security

Design

Business

Soft Skills

ハンズオンJavaScript

by あんどうやすし

19章パフォーマンスを学ぶ

19.1　パフォーマンスを定義する

Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.