Що таке "bottleneck" в алгоритмах?
1. Що означає "bottleneck"
Bottleneck (вузьке місце) - це частина алгоритму (або системи), яка обмежує загальну продуктивність, тобто найповільніша або найресурсомісткіша частина, через яку все інше працює повільніше.
Назва походить від "шийки пляшки": крізь вузьке горлечко рідина тече повільно, хоча сама пляшка може бути великою.
2. У контексті алгоритмів
В алгоритмі bottleneck - це операція або ділянка коду, чия часова або просторова складність домінує над іншими частинами.
Приклад:
function processData(data) {
// 1. Швидка фільтрація (O(n))
const filtered = data.filter(x => x > 10);
// 2. Сортування (O(n log n))
const sorted = filtered.sort((a, b) => a - b);
// 3. Легкий прохід (O(n))
return sorted.map(x => x * 2);
}Bottleneck тут - сортування (O(n log n)),
тому що саме вона визначає загальну продуктивність.
Навіть якщо оптимізувати інші кроки, прискорення буде мінімальним.
Загальна складність:
O(n) + O(n log n) + O(n)≈ O(n log n)
3. Приклад із числовим ефектом
| Етап | Час | Частка від загального |
|---|---|---|
| Фільтрація | 10 мс | 5% |
| Сортування | 170 мс | 85% |
| Постобробка | 20 мс | 10% |
"Вузьке місце" - сортування. Оптимізація інших 15% майже не дасть приросту.
Закон Амдала:
покращення 90% коду не має сенсу, якщо 10% залишаються bottleneck.
4. Як знаходять bottleneck
У браузері:
- Chrome DevTools → Performance → шукаємо, де "горить" більше CPU.
- Lighthouse → показує "Long tasks", "Recalculate Style", "Layout".
У Node.js:
--inspect→ Flamegraph у DevTools;clinic.js,0x,node --prof;- вимірювання з
performance.now(),console.time().
В алгоритмах:
- Теоретичний аналіз складності (Big O);
- Вимірювання часу на великих вхідних даних;
- Порівняння частин функції (loop, recursion, sort, filter).
5. Типові bottlenecks у JS-коді
| Категорія | Приклад | Чому "вузьке місце" |
|---|---|---|
| CPU-bound | великі цикли, сортування, рекурсії | блокують event loop |
| Алгоритми | неефективна структура даних (пошук у масиві замість Map) | зростає складність |
| Пам'ять | зберігання великих структур без очищення | GC, лаги |
| I/O | мережеві запити, читання файлів | чекаємо відповідь |
| DOM | часті reflow/repaint | довгий рендер |
| React | зайві перерендери, повторне створення функцій | навантаження на reconciliation |
6. Як усувають bottlenecks
| Підхід | Що робить |
|---|---|
| Профілювання | спочатку вимірюємо, де "вузьке місце" |
| Оптимізація алгоритму | замінюємо O(n²) на O(n log n) |
| Мемоізація / кешування | повторно використовуємо обчислення |
| Паралелізація (Web Workers) | переносимо CPU-важке в інший потік |
| Асинхронність / batching | робимо I/O-операції неблокуючими |
| Оптимізація пам'яті | видаляємо зайві об'єкти |
| Вибір іншої структури даних | Set замість Array.includes(), Map замість Object |
7. Аналогія
Уяви фабрику:
- Один верстат виробляє 100 деталей/хв.
- Другий обробляє 10 деталей/хв. → саме він стає bottleneck.
- Навіть якщо прискорити перший верстат, швидкість усієї системи не зросте, поки не оптимізуєш другий.
8. Коротке резюме
| Термін | Значення |
|---|---|
| Bottleneck | Найповільніша частина алгоритму, що обмежує загальну продуктивність |
| Прояв | Тривале виконання, висока завантаженість CPU, затримки |
| Як знайти | Профілювання, вимірювання, аналіз Big O |
| Як усунути | Змінити алгоритм, структуру даних, розпаралелити |
Коротка відповідь
Для співбесідиКоротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.