デバッグと最適化

このセクションでは、実行中の PlayCanvas アプリケーションの内部を調べ、期待どおりに動作しない理由や、期待どおりのパフォーマンスが出ない理由を見つけるツールと、アプリケーションのロードと実行を速くする方法を説明します。

使うツール

調べたいこと	使うもの
コードが何をしていて、どこで問題が起きているか	コンソールロギングとブラウザ開発者ツール
アプリケーションの中身：エンティティとコンポーネント、カメラ、アセット、GPU リソース	Inspector
フレームがパスごと、描画ごとにどうレンダリングされるか	Inspector の Frame graph タブと、フレームのステップ実行
コードがシーン内で計算するもの（バウンディング、方向、レンダーターゲットの内容など）	デバッグ描画
操作中にアプリケーションがフレームレートを保てているか	MiniStats
どのフレームが遅く、何がそれを遅らせているか：CPU、GPU、スクリプト、ロード	Inspector の Performance タブ
アプリケーションの起動にかかる時間と、何がいつロードされるか	Inspector の Performance タブ、または Editor Profiler
ダッシュボードや自動比較のための、コードからのエンジンの統計	AppStatsによるプロファイリング
フレーム内で GPU が行う処理の詳細	ネイティブ GPU ツールによる GPUプロファイリング

最適化は、PlayCanvasアプリケーション開発の重要な部分です。それは、優れたユーザーエクスペリエンスとひどいユーザーエクスペリエンスの分かれ目となることがあります。

ヒント

プロジェクトが完成に近づくまで最適化を考慮するのを待たないでください。最初から考慮するようにしてください。それはアプリケーションの設計方法に大きな影響を与える可能性があります。

まず、最適化の主要な目標を設定し、それぞれの目標がなぜ重要なのかを強調することから始めましょう。

目標	なぜ重要か
⏱️ ロード時間の最小化	ユーザーの忍耐力は限られています。アプリのロードが速くない場合、ユーザーは待つのを諦めて他の場所へ行ってしまうかもしれません。
🎞️ フレームレートの最大化	高い（そして安定した）フレームレートは、心地よいビジュアルとユーザー入力に対する低遅延の応答をもたらします。
🔋 CPUとGPUの負荷の最小化	アプリが1秒間に60フレームを維持しているからといって、作業が完了したわけではありません。プロセッサーの負荷を減らすことでバッテリー電力を節約し、デバイスを低温に保ちます。
🧠 メモリ使用量の最小化	ブラウザはアプリケーションに割り当てるメモリプールを制限しています。このプールが枯渇すると、タブがクラッシュして再ロードされます。ユーザーは不満に感じるでしょう！

再現可能なシーンや操作を選び、対象デバイスでベースラインを記録してから、使うツールのプロファイリングツールを使い、同じ条件で各変更を測定します。何を変更するかは、ガイドラインとそれに続くページで説明しています。

AIアシスタントに目標、再現手順、AppStatsのベースラインレポートを渡すと、MiniStatsやブラウザーの結果と組み合わせ、測定可能な変更を1つずつ提案できます。EditorではEditor MCP Server、スタンドアロンではAIを活用した開発を使用します。