Виправити проблеми з аудіо в iOS Safari у React Video Player (HLS/ReactPlayer). Nextjs/typescript
Огляд проекту
Проблема
- ❌ Витоки пам’яті аудіо на iOS Safari
- ❌ Непостійне відтворення аудіо
- ❌ Зниження продуктивності після кількох перемикань відео
- ❌ Аудіодоріжки неправильно звільняють ресурси
Технічний стек
- Frontend: Next.js 14, React 18, TypeScript
- Відеоплеєр: ReactPlayer з HLS.js
- Управління станом: Zustand stores
- Стилізація: Tailwind CSS
- Формат відео: HLS потоки (.m3u8)
-
3530 51 2 Доброго дня!
Я звернув увагу на опис проблем із відеоплеєром у вашому проєкті — зокрема, на витоки пам’яті та нестабільну поведінку на iOS Safari при використанні ReactPlayer з HLS.js.
Важливо відзначити, що iOS Safari має вбудовану підтримку HLS і не підтримує MediaSource Extensions (MSE) у повному обсязі, які є критично необхідними для роботи HLS.js. Через це:
1) HLS.js не повинен використовуватись в iOS Safari — це не лише неефективно, а й може призводити до витоків памʼяті та збоїв.
2) ReactPlayer, який автоматично підключає HLS.js для HLS-стрімів, не враховує специфіку iOS Safari, що й призводить до описаних вами проблем.
Я можу запропонувати вам наступне рішення:
1) Використання кастомного відеоплеєра, який умовно визначає iOS Safari та відтворює HLS напряму через , без HLS.js.
2) Для всіх інших платформ — підключення HLS.js лише там, де це справді потрібно.
3) Коректне очищення медіа-ресурсів (pause, removeAttribute('src'), load, destroy) для уникнення витоків при перемиканні потоків.
… Якщо цікаво — я можу оперативно впровадити прототип такого плеєра або переписати існуючий компонент під цю логіку. Готовий обговорити деталі проєкту, стек, і задачі.
Актуальні фриланс-проєкти в категорії Javascript та Typescript
Розробка інтерактивної карти Palworld для сайтуПотрібно розробити інтерактивну карту Palworld за прикладом: https://palworld.gg/map Нам потрібна не просто статична картинка, а повноцінна інтерактивна карта, де користувач може дивитися локації, вмикати / вимикати категорії об’єктів, шукати потрібні точки та взаємодіяти з… HTML та CSS верстання, Javascript та Typescript ∙ 10 хвилин тому ∙ 1 ставка |
Розробка платформи AM Mobility (автосервіс, парковка, страхування, оренда автомобілів)
259 176 UAH
Шукаємо команду або досвідченого Full Stack розробника для створення MVP платформи AM Mobility. AM Mobility — це єдина цифрова екосистема для автомобілістів, що об'єднує в одному додатку та веб-платформі: парковку; автосервіс; шиномонтаж; автомийку; оренду автомобілів;… Javascript та Typescript, Веб-програмування ∙ 5 днів 6 годин тому ∙ 114 ставок |
Gsap анімації
1000 UAH
Доброго дня. Треба внести правки в поточному проєкті. Потрібен фахівець, який добре працює на gsap/lenis Треба зробити анімацію карточок. Детально ТЗ тут: https://www.figma.com/design/5bLEJudN5LPpB9ZSoJa2Eb/Untitled?m=auto&t=qwyluUctL1lrMNvh-6 Треба проявити креатив та… Javascript та Typescript, Веб-програмування ∙ 5 днів 12 годин тому ∙ 21 ставка |
Шукаю наставника з Claude Code для запуску веб-проєкту з нуля**Коротко про завдання:** Я новачок без досвіду в програмуванні. Є готове ТЗ на розробку сайту (42 сторінки, Next.js, PostgreSQL). Хочу реалізувати його самостійно за допомогою Claude Code - потрібен спеціаліст, який налаштує середовище і навчить мене працювати з інструментом.… Javascript та Typescript, Навчання ∙ 7 днів 11 годин тому ∙ 19 ставок |
Оновлення дизайну на сайтіПотрібно оновити дизайн існуючого сайту, використовуючи HTML, CSS, JS: освіжити зовнішній вигляд, зробити його сучасним і адаптивним під мобільні пристрої. Потрібно додати плавні анімації та інтерактивні елементи. HTML та CSS верстання, Javascript та Typescript ∙ 8 днів 4 години тому ∙ 97 ставок |