Scott.Idem/OSIT-AE-App-Svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf(hydration): resolve white page delay by removing blocking awaits from layouts

Browse Source 
- Refactored Events root layout to fire load_ae_obj_id__event in the background.
- Refactored Journals list page to fire load_ae_obj_li__journal in the background.
- Combined with SWR module logic, this ensures near-instant UI rendering from Dexie cache while refreshes occur asynchronously.
This commit is contained in:
Scott Idem
2026-01-26 17:13:40 -05:00
parent c7a517a6e1
commit 476ab7ede6
2 changed files with 16 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
src/routes/events/[event_id]/+layout.ts
View File

@@ -1,10 +1,9 @@
/** @type {import('./$types').LayoutLoad} */
console.log(`Events - [event_id] launcher +layout.ts start`);
console.log(`Events - [event_id] +layout.ts start`);
import { error } from '@sveltejs/kit';
import { browser } from '$app/environment';
import { events_func } from '$lib/ae_events_functions';
import type { ae_Event } from '$lib/types/ae_types';
export async function load({ params, parent, url }) {
// route
@@ -30,7 +29,7 @@ export async function load({ params, parent, url }) {
const event_id = params.event_id;
if (!event_id) {
console.log(
`ae Events - [event_id] +page.ts: The event_id was not found in the params.event_id!!!`
`ae Events - [event_id] +layout.ts: The event_id was not found in the params.event_id!!!`
);
error(404, {
message: 'Events Pres Mgmt - Event ID not found'
@@ -40,42 +39,22 @@ export async function load({ params, parent, url }) {
ae_acct.slct.event_id = event_id;
if (browser) {
// console.log(`TEST URL Params`, params);
// console.log(`TEST URL`, url);
if (log_lvl) console.log(`ae_events [event_id] +layout.ts (Non-Blocking)`);
const load_event_obj: ae_Event | null = await events_func.load_ae_obj_id__event({
// OPTIMIZATION: Fire the event load in the background without 'await'.
// The event module uses SWR, so this will:
// 1. Check Dexie cache and update IDB instantly.
// 2. Fetch fresh data from API and update IDB.
// 3. Components using LiveQuery (like lq__event_obj) will react automatically.
events_func.load_ae_obj_id__event({
api_cfg: ae_acct.api,
event_id: event_id,
inc_file_li: true,
// inc_device_li: true,
inc_location_li: true,
inc_session_li: true,
// inc_badge_li: true,
inc_template_li: true,
log_lvl: log_lvl
// })
// .then((results) => {
// if (!results) {
// error(404, {
// message: 'Events - Event not found'
// });
// } else {
// // ae_acct.slct.event_obj = results;
// }
log_lvl: 0 // Keep background quiet unless debugging
});
if (!load_event_obj) {
console.warn(`Events - [event_id] +layout.ts: Event ${event_id} not found via API or Cache.`);
// error(404, {
// message: 'Events - Event not found'
// });
} else {
console.log(`load_event_obj = `, load_event_obj);
ae_acct.slct.event_obj = load_event_obj;
// ae_acct.slct.event_device_obj_li = load_event_obj.event_device_obj_li;
ae_acct.slct.event_location_obj_li = load_event_obj.event_location_obj_li;
ae_acct.slct.event_session_obj_li = load_event_obj.event_session_obj_li;
ae_acct.slct.badge_template_obj_li = load_event_obj.event_badge_template_obj_li;
}
}
// WARNING: Precaution against shared data between sites and sessions.