SimbirSoft_frontend 15 декабря 2021 в 16:52

React-three-fiber: повышаем производительность приложений

Блог компании SimbirSoft JavaScript *ReactJS *

2.7K

Комментарии 9

nin-jin 15.12.2021 в 21:49

Так и не понял зачем тут ~~jQuery~~ React.

halfcupgreentea 16.12.2021 в 16:48

https://docs.pmnd.rs/react-three-fiber/advanced/scaling-performance#enable-concurrency

Удобный дешевый шедулинг всего приложения включая и webgl и DOM

nin-jin 16.12.2021 в 17:36

А вы запускали эту демку? Она дико течёт по памяти и каждые пару секунд зависает на секунду.

john_samilin 16.12.2021 в 15:25

Это же справедливо для массы статичных объектов. Если у вас, скажем, 150 анимированных моделек, то instancedMesh не поможет

SimbirSoft_frontend 27.12.2021 в 14:56

Добрый день. Если у объектов одинаковые геометрия и материал, то InstancedMesh позводяет повысить производительность. Тестировали на примере 50000 квадратов. При таком количестве удалось добиться анимации 60 кадров в секунду.

john_samilin 27.12.2021 в 17:22

это да, но ключевой момент в том, что они должны быть статичными. каждому из экземпляров можно менять свойства, типа позиции, масштаба и вращения, а вот скелетная анимация на отдельных экземплярах уже не покатит. или покатит?

SimbirSoft_frontend 28.12.2021 в 10:35

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

fimashagal 16.12.2021 в 20:41

Немного непонятно получается. InstancedMesh это класс THREE.js, при чем тут fiber?

SimbirSoft_frontend 27.12.2021 в 14:55

Добрый день. Рассматривали библиотеку react-three-fiber, так как с ней удобнее работать в том случае, если у нас React приложение.

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

React-three-fiber: повышаем производительность приложений

Комментарии 9

Ваш аккаунт

Разделы

Информация

Услуги