I want to use svg sprite in my Next.js (app folder) application. I created this component

const Icon = ({ type = 'main', name = '', color = '#000', size = '24', className }: IconProps) => {
    return (
        <svg width={size} height={size} fill={color} className={className}>
            <use href={`/assets/images/sprites/${type}.svg#${name}`} />
        </svg>
    )

but I ran into a problem that when routing, every time a request occurs for a whole sprint, which affects badly performance. Even if I return to an already loaded route, then again there is a request for a sprint

can you suggest articles on how best to work with sprint svg in an application. thanks