michaelschiemer/resources/js/modules/spa-router/transition-config.js

/**
 * SPA Router Transition Configuration
 * 
 * Verschiedene Transition-Presets für unterschiedliche Use-Cases
 */

// Ultra-schnelle Transitions (fast keine sichtbare Animation)
export const instantTransition = {
    enableTransitions: true,
    transitionDuration: 50  // 50ms - kaum wahrnehmbar
};

// Schnelle Transitions (snappy, aber noch sichtbar)
export const fastTransition = {
    enableTransitions: true,
    transitionDuration: 100  // 100ms - schnell und responsiv
};

// Standard Transitions (balanced)
export const standardTransition = {
    enableTransitions: true,
    transitionDuration: 200  // 200ms - ausgewogen
};

// Langsame Transitions (smooth, aber träge)
export const slowTransition = {
    enableTransitions: true,
    transitionDuration: 300  // 300ms - original Wert
};

// Keine Transitions (instant switch)
export const noTransition = {
    enableTransitions: false,
    transitionDuration: 0
};

// Performance-basierte Konfiguration
export function getAdaptiveTransition() {
    // Check for reduced motion preference
    if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) {
        return noTransition;
    }
    
    // Check device performance
    const connection = navigator.connection || navigator.mozConnection || navigator.webkitConnection;
    
    if (connection) {
        // Schnelle Verbindung = schnellere Transitions
        if (connection.effectiveType === '4g') {
            return instantTransition;
        } else if (connection.effectiveType === '3g') {
            return fastTransition;
        }
    }
    
    // Check if device is likely mobile (rough detection)
    const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
    
    if (isMobile) {
        return fastTransition; // Mobile devices: schnellere Transitions
    }
    
    return fastTransition; // Default zu schnell
}

// Export default configuration
export default fastTransition;