perf: optimize splash screen loading and remove unused telemetry code
This commit is contained in:
@ -206,8 +206,12 @@ onMounted(async () => {
|
|||||||
})
|
})
|
||||||
|
|
||||||
async function loadInitialData() {
|
async function loadInitialData() {
|
||||||
routes.value = await routesService.getAllRoutes()
|
const [routesData, stopsData] = await Promise.all([
|
||||||
allStops.value = await busStopsService.getAllBusStops()
|
routesService.getAllRoutes(),
|
||||||
|
busStopsService.getAllBusStops()
|
||||||
|
])
|
||||||
|
routes.value = routesData
|
||||||
|
allStops.value = stopsData
|
||||||
}
|
}
|
||||||
|
|
||||||
const availableStops = computed(() => {
|
const availableStops = computed(() => {
|
||||||
|
|||||||
@ -7,7 +7,6 @@ import { useMapStore } from "@/stores/map";
|
|||||||
import { useBusStopStore } from "@/stores/busStop";
|
import { useBusStopStore } from "@/stores/busStop";
|
||||||
import { useCouponStore } from "@/stores/coupon";
|
import { useCouponStore } from "@/stores/coupon";
|
||||||
import { useGoogleMaps } from "@/composables/useGoogleMaps";
|
import { useGoogleMaps } from "@/composables/useGoogleMaps";
|
||||||
import { telemetryService } from "@/services/telemetryService";
|
|
||||||
import { analyticsService } from "@/services/analyticsService";
|
import { analyticsService } from "@/services/analyticsService";
|
||||||
import { getImageUrl } from "@/utils/imageUrl";
|
import { getImageUrl } from "@/utils/imageUrl";
|
||||||
|
|
||||||
@ -212,9 +211,11 @@ onMounted(async () => {
|
|||||||
// Add click outside listener
|
// Add click outside listener
|
||||||
document.addEventListener('click', handleClickOutside);
|
document.addEventListener('click', handleClickOutside);
|
||||||
|
|
||||||
// Load routes, bus stops and promos
|
// Load routes, bus stops and promos in parallel
|
||||||
await routeStore.loadRoutes();
|
await Promise.all([
|
||||||
await couponStore.loadCoupons({ active_only: true });
|
routeStore.loadRoutes(),
|
||||||
|
couponStore.loadCoupons({ active_only: true })
|
||||||
|
]);
|
||||||
|
|
||||||
// Sync from query params if coming from Schedules or external link
|
// Sync from query params if coming from Schedules or external link
|
||||||
const queryRouteId = router.currentRoute.value.query.routeId as string;
|
const queryRouteId = router.currentRoute.value.query.routeId as string;
|
||||||
|
|||||||
@ -3,6 +3,7 @@ import { ref, onMounted } from 'vue'
|
|||||||
import { useRouter } from 'vue-router'
|
import { useRouter } from 'vue-router'
|
||||||
import { useCouponStore } from '@/stores/coupon'
|
import { useCouponStore } from '@/stores/coupon'
|
||||||
import { authService } from '@/services/authService'
|
import { authService } from '@/services/authService'
|
||||||
|
import { getImageUrl } from '@/utils/imageUrl'
|
||||||
|
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const couponStore = useCouponStore()
|
const couponStore = useCouponStore()
|
||||||
@ -105,12 +106,7 @@ function getStatusLabel(status: string) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const API_URL = import.meta.env.VITE_API_URL || 'http://localhost:8000'
|
const getFullUrl = (path: string) => getImageUrl(path)
|
||||||
function getFullUrl(path: string) {
|
|
||||||
if (!path) return ''
|
|
||||||
if (path.startsWith('http')) return path
|
|
||||||
return `${API_URL}${path}`
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|||||||
@ -44,16 +44,22 @@ onMounted(async () => {
|
|||||||
showLoading.value = true
|
showLoading.value = true
|
||||||
loadingVisible.value = true
|
loadingVisible.value = true
|
||||||
|
|
||||||
|
// Short timeout for safety - app should be ready way before this
|
||||||
const initTimeout = setTimeout(() => {
|
const initTimeout = setTimeout(() => {
|
||||||
console.warn('Initialization taking too long, forcing navigation...')
|
console.warn('Initialization taking too long, forcing navigation...')
|
||||||
statusMessage.value = 'Iniciando de todas formas...'
|
statusMessage.value = 'Iniciando de todas formas...'
|
||||||
navigate()
|
navigate()
|
||||||
}, 5000)
|
}, 3000)
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await performInitializationTasks()
|
// Start all tasks in parallel: Session check + Data loading
|
||||||
|
const [sessionData] = await Promise.all([
|
||||||
|
supabase.auth.getSession(),
|
||||||
|
performInitializationTasks()
|
||||||
|
])
|
||||||
|
|
||||||
clearTimeout(initTimeout)
|
clearTimeout(initTimeout)
|
||||||
navigate()
|
navigate(sessionData.data.session)
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Initialization failed', error)
|
console.error('Initialization failed', error)
|
||||||
clearTimeout(initTimeout)
|
clearTimeout(initTimeout)
|
||||||
@ -61,15 +67,16 @@ onMounted(async () => {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
async function navigate() {
|
async function navigate(passedSession?: any) {
|
||||||
const { data: { session } } = await supabase.auth.getSession()
|
// Use passed session or fetch if missing
|
||||||
|
const session = passedSession || (await supabase.auth.getSession()).data.session
|
||||||
|
|
||||||
if (!session) {
|
if (!session) {
|
||||||
router.replace('/map')
|
router.replace('/map')
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
// Get the role directly from the JWT to avoid slow database queries
|
// Get the role directly from user metadata for speed
|
||||||
const role = session.user?.user_metadata?.role?.toUpperCase() || 'PASSENGER'
|
const role = session.user?.user_metadata?.role?.toUpperCase() || 'PASSENGER'
|
||||||
|
|
||||||
if (role === 'ADMIN') router.replace('/admin')
|
if (role === 'ADMIN') router.replace('/admin')
|
||||||
@ -80,13 +87,16 @@ async function navigate() {
|
|||||||
|
|
||||||
async function performInitializationTasks() {
|
async function performInitializationTasks() {
|
||||||
statusMessage.value = 'Verificando datos...'
|
statusMessage.value = 'Verificando datos...'
|
||||||
|
console.log('Starting initialization tasks...')
|
||||||
|
|
||||||
// Load essential map data in parallel to save time
|
// Load essential map data in parallel to save time
|
||||||
try {
|
try {
|
||||||
|
const start = Date.now()
|
||||||
await Promise.all([
|
await Promise.all([
|
||||||
routeStore.loadRoutes(),
|
routeStore.loadRoutes().then(() => console.log('Routes loaded')),
|
||||||
busStopStore.loadBusStops()
|
busStopStore.loadBusStops().then(() => console.log('Bus stops loaded'))
|
||||||
])
|
])
|
||||||
|
console.log(`Initialization tasks finished in ${Date.now() - start}ms`)
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error('Error pre-loading map data', e)
|
console.error('Error pre-loading map data', e)
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user