aboutsummaryrefslogtreecommitdiff
path: root/files/ja/tools/performance/how_to/index.html
blob: ff4d540ffe40c2c0a5a149edf56f923eb7d7d4b5 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
---
title: 操作手順
slug: Tools/Performance/How_to
translation_of: Tools/Performance/How_to
---
<div>{{ToolsSidebar}}</div><h2 id="Open_the_Performance_tools" name="Open_the_Performance_tools">パフォーマンスツールを開く</h2>

<p>パフォーマンスツールを開く方法は以下のとおりです:</p>

<ul>
 <li>Shift + F5 を押下する</li>
 <li>Firefox メニューの Web 開発サブメニュー (メニューバーを表示している場合や OS X ではツールメニュー) で "パフォーマンス" を選択する</li>
 <li>ツールバーに Web 開発ツールボタンがある場合は、ボタンを押して "パフォーマンス" を選択する:<img alt="" src="https://mdn.mozillademos.org/files/10997/devtools-button.png" style="height: 76px; width: 728px;"></li>
</ul>

<h2 id="Record_a_profile" name="Record_a_profile">プロファイルを記録する</h2>

<p>記録ペインでストップウォッチのアイコンを押下すると、新しい記録を開始します。もう一度押下すると、記録を終了します:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/10999/perf-start-stop-recording.png" style="display: block; height: 311px; margin-left: auto; margin-right: auto; width: 744px;"></p>

<p><code><a href="/ja/docs/Web/API/Console/profile">console.profile()</a></code><code><a href="/ja/docs/Web/API/Console/profileEnd">console.profileEnd()</a></code> を使用して、Web コンソールから記録を開始および終了することもできます。</p>

<h2 id="Save_a_profile" name="Save_a_profile">プロファイルを保存する</h2>

<p>記録ペインで "保存" と記載されたリンクをクリックすると、プロファイルを保存します:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/11001/perf-howto-save.png" style="display: block; height: 311px; margin-left: auto; margin-right: auto; width: 733px;"></p>

<h2 id="Load_a_profile" name="Load_a_profile">プロファイルを読み込む</h2>

<p>"インポート..." をクリックしてファイルを選択すると、プロファイルを読み込みます:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/11005/perf-import.png" style="display: block; height: 622px; margin-left: auto; margin-right: auto; width: 733px;"></p>

<h2 id="Clear_all_loaded_profiles" name="Clear_all_loaded_profiles">すべてのプロファイルを消去する</h2>

<p>"消去" をクリックすると、すべての読み込み済みプロファイルを消去します。</p>

<div class="note">
<p>これを行うと、すべての未保存プロファイルを失います。</p>
</div>

<p><img alt="" src="https://mdn.mozillademos.org/files/11007/perf-clear.png" style="display: block; height: 311px; margin-left: auto; margin-right: auto; width: 733px;"></p>

<h2 id="Select_a_tool" name="Select_a_tool">ツールを選択する</h2>

<p>ツールバーのボタンを使用して<a href="/ja/docs/Tools/Performance/Waterfall">ウォーターフォール</a><a href="/ja/docs/Tools/Performance/Call_Tree">呼び出しツリー</a><a href="/ja/docs/Tools/Performance/Flame_Chart">フレームチャート</a>を切り替えます:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/11009/perf-switch-tool.png" style="display: block; height: 311px; margin-left: auto; margin-right: auto; width: 733px;"></p>

<h2 id="Configure_markers_displayed" name="Configure_markers_displayed">表示するマーカーを設定する</h2>

<p>ツールバーのボタンを使用して、<a href="/ja/docs/Tools/Performance/Waterfall">ウォーターフォール</a>でどのマーカーを表示するかを設定できます:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/11011/perf-marker-filter.png" style="display: block; height: 311px; margin-left: auto; margin-right: auto; width: 733px;"></p>

<h2 id="Zoom_in" name="Zoom_in">拡大</h2>

<p>記録の概要で一部分を選択すると、その部分を拡大表示します:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/11013/perf-zoom.png" style="display: block; height: 311px; margin-left: auto; margin-right: auto; width: 733px;"></p>