aboutsummaryrefslogtreecommitdiff
path: root/files/uk/інструменти/network_monitor/index.html
blob: 7f3fb7d1f7bed6da8323d7031bf22a2fa95f5e86 (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
---
title: Монітор мережі
slug: Інструменти/Network_Monitor
translation_of: Tools/Network_Monitor
---
<div>{{ToolsSidebar}}</div>

<div><span class="tlid-translation translation"><span title="">Монітор мережі показує всі мережні запити Firefox (наприклад, коли він завантажує сторінку або виконується </span></span><a href="/uk/docs/Web/API/XMLHttpRequest">XMLHttpRequests</a><span class="tlid-translation translation"><span title="">), тривалість і деталі кожного запиту.</span></span></div>

<h2 id="Відкривання_Монітору_мережі">Відкривання Монітору мережі</h2>

<p>Є декілька способів відкрити Монітор мережі:</p>

<ul>
 <li>Натиснути <kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>E</kbd> ( <kbd>Command</kbd> + <kbd>Option</kbd> + <kbd>E</kbd> на Mac).</li>
 <li>З меню Веб-розробки вибрати "Мережа", (що є підменю меню Інструменти на OS X та Linux).</li>
 <li>Натиснути на піктограму гайкового ключа (<img alt="" src="https://mdn.mozillademos.org/files/12710/wrench-icon.png" style="height: 21px; width: 21px;">), яка знаходиться в основному меню або під Гамбургер-меню  (<img alt="" src="https://mdn.mozillademos.org/files/12712/hamburger.png" style="height: 20px; width: 22px;">), тоді вибрати "Мережа".</li>
</ul>

<p><span class="tlid-translation translation"><span title="">У нижній частині вікна браузера з'явиться Монітор мережі.</span> <span title="">Щоб побачити запити, перезавантажте сторінку:</span></span></p>

<p><img alt="" src="https://mdn.mozillademos.org/files/16245/network_monitor.png" style="border: 1px solid black; display: block; height: 541px; margin: 0px auto; width: 800px;" title=""></p>

<p><span class="tlid-translation translation"><span title="">Поки панель інструментів відкрита, Монітор мережі записує мережні запити, навіть якщо він сам не вибраний.</span> <span title="">Це значить, що Ви можете почати налагодження сторінки, наприклад, у Веб-консолі, а потім перейти до Монітора мережі, щоб побачити мережну активність без перезавантаження сторінки.</span></span></p>

<h2 id="Огляд_користувацького_інтерфейсу_(UI)">Огляд користувацького інтерфейсу (UI)</h2>

<p>Користувацький інтерфейс складається з чотирьох основних частин :</p>

<ul>
 <li>Основний екран містить <a href="/uk/docs/Tools/Network_Monitor/Toolbar">панель інструментів</a><a href="/uk/docs/Tools/Network_Monitor/request_list">список мережних запитів</a> та <a href="/uk/docs/Tools/Network_Monitor/request_details">панель подробиць запитів</a>:</li>
</ul>

<p><img alt="" src="https://mdn.mozillademos.org/files/16246/Network_Monitor_Closeup.png" style="border: 1px solid black; display: block; height: 747px; margin: 0px auto; width: 800px;" title=""></p>

<ul>
 <li><a href="/uk/docs/Tools/Network_Monitor/Performance_analysis">Аналіз швидкодії</a> відображається у окремому вікні:</li>
</ul>

<p><img alt="Performance analysis view" src="https://mdn.mozillademos.org/files/16276/network_performance.png" style="border: 1px solid black; display: block; height: 1176px; margin-left: auto; margin-right: auto; width: 1382px;" title=""></p>

<h2 id="Робота_з_Монітором_мережі">Робота з Монітором мережі</h2>

<p><span class="tlid-translation translation"><span title="">Наступні статті охоплюють різні аспекти використання Монітора мережі</span></span>:</p>

<ul>
 <li><a href="/uk/docs/Tools/Network_Monitor/Toolbar">Панель інструментів</a></li>
 <li><a href="/uk/docs/Tools/Network_Monitor/request_list">Список мережних запитів</a></li>
 <li><a href="/uk/docs/Tools/Network_Monitor/request_details">Подробиці мережних запитів</a></li>
 <li><a href="/uk/docs/Tools/Network_Monitor/recording">Запис мережного трафіку</a></li>
 <li><a href="/uk/docs/Tools/Network_Monitor/Performance_Analysis">Аналіз швидкодії</a></li>
 <li><a href="/uk/docs/Tools/Network_Monitor/Throttling">Обмеження швидкості передачі</a></li>
</ul>