我正在使用 ReactJS Particles,一段时间后它变得非常非常快并且令人讨厌

问题描述 投票:0回答:0

我正在使用 ReactJS Particles,一段时间后,它变得非常非常快并且很烦人。我需要帮助,时间并不总是相同,有时会在 15 分钟后发生,有时会更少,有时会更多。请帮我解决这个问题。

代码:

import { useCallback } from "react";
import Particles from "react-tsparticles";
import { loadFull } from "tsparticles";

const Parlex = () => {
const particlesInit = useCallback(async engine => {
    // you can initiate the tsParticles instance (engine) here, adding custom shapes or presets
    // this loads the tsparticles package bundle, it's the easiest method for getting everything ready
    // starting from v2 you can add only the features you need reducing the bundle size
    await loadFull(engine);
}, []);

const particlesLoaded = useCallback(async container => {
}, []);

return (
    <Particles
        id="tsparticles"
        init={particlesInit}
        loaded={particlesLoaded}
        options={{
            background: {
                color: {
                    value: "#fff",
                },
            },
            fpsLimit: 30,
            interactivity: {
                events: {
                  
                    onHover: {
                        enable: true,
                        mode: "repulse",
                    },
                    resize: true,
                },
                modes: {
                    push: {
                        quantity: 4,
                    },
                    repulse: {
                        distance: 200,
                        duration: 0.4,
                    },
                },
            },
            particles: {
                color: {
                    value: "#4a58de",
                },
                links: {
                    color: "#8150ed",
                    distance: 150,
                    enable: true,
                    opacity: 0.3,
                    width: 1,
                },
                collisions: {
                    enable: true,
                },
                move: {
                    directions: "none",
                    enable: true,
                    outModes: {
                        default: "bounce",
                    },
                    random: false,
                    speed:2,
                    straight: false,
                },
                number: {
                    density: {
                        enable: true,
                        area: 800,
                    },
                    value: 80,
                },
                opacity: {
                    value: 0.3,
                },
                shape: {
                    type: "circle",
                },
                size: {
                    value: { min: 1, max: 5 },
                },
            },
        }}
    />
);

}; 导出默认 Parlex

我试图改变 FPS 限制和速度,但它是一样的。

reactjs particles
© www.soinside.com 2019 - 2024. All rights reserved.