Daniil Filippov

+2
с 2021
0 подписчиков
3 подписки

А чего babylonjs не упомянули?

Библиотека babylon.js очень большая, и нужно серьезно повозиться, чтобы можно было ее применить на сайте. Ведь на последнем помимо всяких 3d красивостей должен быть еще и какой-никакой контент (изображения, видео и прочие ассеты).

Если грузить эту библиотеку целиком, то нужно добавить в проект около мегабайта только одного js-кода (минифицированного и сжатого в gzip!):

https://bundlephobia.com/package/@babylonjs/core@5.23.0

А с «tree shaking» там могут быть проблемы (по крайней мере, когда сам смотрел babylon.js, итоговый размер его бандла после оптимизаций становился ненамного меньше и проигрывал three.js для аналогичной сцены)

Сейчас уже можно вполне себе реалистичные модели отображать.

Можно, но нужно исходить из ЦА сайта. Если там будет много пользователей со старыми ноутбуками, то вся эта красота там либо не заработает (т.к. слабое интегрированное графическое ядро), либо будет чудовищно тормозить и жрать оперативную память

По видео можно перемещаться.

Покадрово, с возможными небольшими «подлагами» при переходе на конкретный фрейм. А что если вам требуется при наведении курсора мыши проиграть какую-то анимацию, а при уводе — запустить ее в обратном направлении?

Попробуйте средствами JavaScript проиграть видео в обратном направлении. Наверное, вы будете очень удивлены, но у вас это не получится сделать без предварительной отрисовки каждого кадра видео на canvas и сохранения получаемых изображений в некий массив.
А последняя операция достаточно ресурсоемкая, поэтому и ставит крест на реальном практическом применении такого подхода. Так что если без видео обойтись никак — нужно будет сделать два ролика: один для «прямой» анимации на ховер, а один для ее реверса.

Большинство форматов видео являются потоковыми и оптимизированы для проигрывания только «вперед». Вы же не хотите дожидаться загрузки всего видео, чтобы его посмотреть, верно?

К тому же есть ленивая загрузка и плейсхолдеры.

Если анимация находится на главном экране сайта и играет важную роль по задумке дизайнера (например, параллельно вместе с ней появляются какие-то элементы интерфейса и т.д.), никакая «ленивая загрузка» вас не спасет. Вам придется делать «прелоадер» на всю страницу, что, согласитесь, уже не так здорово.

youtube страницы же не весят много.

Откройте средства разработчика браузера и посмотрите, какой объем данных передается на странице с видео в youtube. Взял первое попавшееся — сразу же грузятся 5.5 MB, чуть-чуть поскроллил комментарии и запустил видео — уже 12 MB, и т.д.

2