Видео-виджет для сайтов

Технологический стек:

Backend

PHP (Yii2), MySQL

Frontend

Typescript (React, react-shadow)

В 2021 году появился новый трендовый инструмент интернет-маркетинга — видеовиджеты. Данный инструмент призван увеличить уровень конверсии веб-сайтов благодаря сразу нескольким факторам:

Как только мы столкнулись с таким инструментом — мы сразу приняли его на вооружение и рекомендовали своим клиентам поступить таким же образом. Тем не менее, нас совершенно не устраивала ценовая политика существующих на рынке решений. Мы оценили свои трудозатраты на разработку аналогичного решения и оказалось, что такой подход нам обойдется в сумму, сопоставимую с 6 месяцами использования стороннего решения. Поэтому мы решили разработать собственный сервис для создания видео-виджетов.

По мимо экономии средств, разработка собственного решения позволяет получить бесценный опыт внедрения новых технологий. В процессе разработки, мы столкнулись с новыми для себя задачами, такими как:

Конвертация видео

Казалось бы — довольно тривиальная задача, которую любой пользователь без труда может выполнить на ПК или мобильном устройстве. Но стоит учитывать, что при использовании онлайн-сервиса, пользователь может указать некорректные настройки при конвертации видео, что, в свою очередь, может привести к большому размеру загружаемого файла. И даже, если при тестировании, виджет отображается корректно, это совершенно не означает, что при просмотре сайта используя мобильный интернет, видео в виджете будет загружаться также плавно. Также, пользователь может загрузить видео в формате, который не поддерживается тем или иным браузером (в особенности: Apple Safari и Firefox для Android). Поэтому, в обязательном порядке, каждый видео-ролик, который был загружен в личном кабинете должен быть оптимизирован с помощью конвертации на стороне нашего сервера. Работа с видео — это довольно ресурсоёмкий процесс, поэтому для решения такой задачи мы выделили отдельный сервер обработки видео с регулируемым объемом ресурсов. Такой подход позволит сохранить время на процесс обработки видео неизменным, даже в случае пиковой нагрузки, когда одновременно видео решили загрузить сразу несколько пользователей. В тоже время, такой подход позволит исключить издержки на содержание сервера с излишними вычислительными мощностями.

Разработка CDN

Возможность загрузки довольно длительных видео-роликов обуславливает необходимость наличия большого хранилища данных. Изначально мы планировали использовать S3-хранилища от известных провайдеров. При этом, для обеспечения плавной загрузки видео и соблюдения законодательства, необходимо было выбрать провайдера с дата-центрами на территории РФ. К сожалению, отечественные провайдеры за подобные услуги называют довольно высокую цену. Поэтому, изучив вопрос, нами было принято решение реализовать собственный CDN-сервер, который позволит управлять загрузками, передавать файлы к и от сервера обработки, а при заполнении дискового пространства, автоматически изменять тариф сервера-хранилища или же переключать обработчик на новое хранилище. Разработка собственного CDN-сервера позволила сократить наши расходы на организацию хранилища видео-роликов более чем на 20%.

Спустя неделю после начала работ, в свет вышла первая версия нашего сервиса, которая имеет следующий функционал:

Так как сервис был изначально разработан для внутреннего использования и мы не закладывали в него какой-либо коммерческой составляющей, было принято решение сделать сервис общедоступным.

Вы можете ознакомиться с сервисом «Видвиджет» более подробно на сайте проекта: https://vidwidget.ru/, а пример использования такого виджета — доступен на этой странице.

Поделиться
Share on vk
Share on twitter
Share on facebook
Share on telegram
Share on whatsapp

Обсудите ваш проект с менеджером

    Я согласен на обработку персональных данных согласно политике конфиденциальности

    Служба поддержки