#vue.js #animation #nuxt.js #server-side-rendering
#vue.js #Анимация #nuxt.js #рендеринг на стороне сервера
Вопрос:
Я добавляю фрагмент из этого codepenhttps://codepen.io/soulwire/pen/Ffvlo для отображения анимации частиц. Я добавляю его таким образом в свой nuxt.config.js файл:
plugins: [
{ src:'~/plugins/particles.js', mode:'client'}
],
Он отображается и работает, но, к сожалению, производительность настолько плоха, что анимация на самом деле воспринимается не так, как должна быть. Могу ли я что-нибудь сделать по-другому, чтобы производительность была такой же, как в codepen?
Также я знаю, что теперь это зарегистрировано как глобальный плагин и всегда загружается. Есть ли способ добавить его только на определенный сайт?
Заранее спасибо!
Комментарии:
1. что вы подразумеваете под производительностью, можете ли вы создать пример на codesandbox? Это элемент canvas, если вы не изменили что-то вроде
( ( ROWS = 500 ) * ( COLS = 500 ) ), это была бы та же производительность, возможно, не привязывайте данные к какой-либо из переменных, которые могут контролировать частицы.2. да, он глобальный, если вы не хотите глобального, импортируйте на страницу / компонент
3. Particles.js есть нерешенная ошибка с уничтожением / воссозданием, и она заброшена, вам следует попробовать Particles.vue (не vue-particles, он использует ту же библиотеку с ошибками) или tsParticles вместо этого, это исправленная версия этой библиотеки github.com/matteobruni/tsparticles