perf(events): refactor load functions to be non-blocking

- Eliminated blocking 'await' calls in '+page.ts' for main Events, Session, Location, and Presenter views.
- Implemented Stale-While-Revalidate (SWR) pattern: pages now render instantly using cached IndexedDB data while API refreshes run in the background.
- Removed expensive sequential loops in load functions, allowing the reactive UI (via LiveQuery) to handle data arrival as background tasks complete.
This commit is contained in:
Scott Idem
2026-01-27 12:25:35 -05:00
parent 30413e32d2
commit 9655604d86
4 changed files with 54 additions and 122 deletions

View File

@@ -22,50 +22,32 @@ export async function load({ parent }) {
}
if (browser) {
if (event_id) {
// let ae_params = {};
if (log_lvl) console.log(`ae_events +page.ts (Non-Blocking Refresh)`);
const load_event_obj_li = await events_func.load_ae_obj_id__event({
if (event_id) {
// Refresh the specific selected event
events_func.load_ae_obj_id__event({
api_cfg: ae_acct.api,
event_id: event_id,
log_lvl: log_lvl
});
ae_acct.slct.event_obj_li = load_event_obj_li;
}
const load_event_obj_li = await events_func.load_ae_obj_li__event({
// Refresh the list of events for the account
events_func.load_ae_obj_li__event({
api_cfg: ae_acct.api,
for_obj_type: 'account',
for_obj_id: account_id,
inc_session_li: true,
hidden: 'all', // 'not_hidden'
enabled: 'enabled',
// order_by_li: {'priority': 'DESC', 'sort': 'DESC', 'name': 'ASC', 'updated_on': 'DESC', 'created_on': 'DESC'},
limit: 25,
// params: ae_params,
try_cache: true,
log_lvl: log_lvl
});
ae_acct.slct.event_obj_li = load_event_obj_li;
}
parent_data[account_id] = ae_acct;
return parent_data;
// let ae_acct = parent_data[account_id];
// Should we limit these to event.conference = true?
// let load_event_obj_li = await events_func.load_ae_obj_li__event({
// api_cfg: ae_acct.api,
// account_id: account_id,
// params: {enabled: 'enabled', qry__limit: 25},
// try_cache: false,
// log_lvl: 1
// });
// ae_acct.slct.event_obj_li = load_event_obj_li;
// parent_data[account_id] = ae_acct;
// return parent_data;
}

View File

@@ -29,44 +29,32 @@ export async function load({ params, parent }) {
ae_acct.slct.event_location_id = event_location_id;
if (browser && event_location_id) {
// Load event location object
const load_event_location_obj = await events_func.load_ae_obj_id__event_location({
if (log_lvl) console.log(`ae_events [event_location_id] +page.ts (Non-Blocking Refresh)`);
// OPTIMIZATION: Fire these in the background without 'await'.
// The Location View components use LiveQuery/Dexie and will update
// automatically once these background tasks complete.
// 1. Refresh the location object
events_func.load_ae_obj_id__event_location({
api_cfg: ae_acct.api,
event_location_id: event_location_id,
try_cache: true
});
ae_acct.slct.event_location_obj = load_event_location_obj;
// Load event sessions for the location
const event_session_obj_li = await events_func.load_ae_obj_li__event_session({
// 2. Refresh sessions and their nested presentations
events_func.load_ae_obj_li__event_session({
api_cfg: ae_acct.api,
for_obj_type: 'event_location',
for_obj_id: event_location_id,
inc_presentation_li: true,
enabled: 'all',
limit: 50,
log_lvl: log_lvl
});
if (event_session_obj_li) {
for (let index = 0; index < event_session_obj_li.length; index++) {
const event_session_obj = event_session_obj_li[index];
const event_session_id = event_session_obj.event_session_id || event_session_obj.id;
const load_event_presentation_obj_li = await events_func.load_ae_obj_li__event_presentation({
api_cfg: ae_acct.api,
for_obj_type: 'event_session',
for_obj_id: event_session_id,
enabled: 'all',
limit: 25,
log_lvl: log_lvl
});
event_session_obj_li[index].event_presentation_li = load_event_presentation_obj_li;
}
}
ae_acct.slct.event_session_obj_li = event_session_obj_li;
const load_event_file_obj_li = await events_func.load_ae_obj_li__event_file({
// 3. Refresh files for the location
events_func.load_ae_obj_li__event_file({
api_cfg: ae_acct.api,
for_obj_type: 'event_location',
for_obj_id: event_location_id,
@@ -75,15 +63,14 @@ export async function load({ params, parent }) {
limit: 50,
log_lvl: log_lvl
});
ae_acct.slct.event_file_obj_li = load_event_file_obj_li;
const load_event_device_obj_li = await events_func.load_ae_obj_li__event_device({
// 4. Refresh devices for the location
events_func.load_ae_obj_li__event_device({
api_cfg: ae_acct.api,
for_obj_type: 'event_location',
for_obj_id: event_location_id,
log_lvl: log_lvl
});
ae_acct.slct.event_device_obj_li = load_event_device_obj_li;
}
// WARNING: Precaution against shared data between sites and sessions.

View File

@@ -17,45 +17,33 @@ export async function load({ params, parent }) {
// console.log(`ae_acct = `, ae_acct);
const event_presenter_id = params.presenter_id;
// if (!event_presenter_id) {
// console.log(`ae events_pres_mgmt presenter [presenter_id] +page.ts: The event_presenter_id was not found in the params.presenter_id!!!`);
// return false;
// }
ae_acct.slct.event_presenter_id = event_presenter_id;
if (browser) {
// Load event presenter object
const load_event_presenter_obj = events_func.load_ae_obj_id__event_presenter({
if (log_lvl) console.log(`ae_events [presenter_id] +page.ts (Non-Blocking Refresh)`);
// OPTIMIZATION: Fire these in the background without 'await'.
// The Presenter View components use LiveQuery/Dexie and will update
// automatically once these background tasks complete.
// 1. Refresh the presenter object
events_func.load_ae_obj_id__event_presenter({
api_cfg: ae_acct.api,
event_presenter_id: event_presenter_id,
try_cache: true,
log_lvl: log_lvl
});
ae_acct.slct.event_presenter_obj = await load_event_presenter_obj;
// Load event files for the presenter
const load_event_file_obj_li = await events_func
.load_ae_obj_li__event_file({
api_cfg: ae_acct.api,
for_obj_type: 'event_presenter',
for_obj_id: event_presenter_id,
enabled: 'all',
hidden: 'all',
limit: 50,
try_cache: true
})
.then((event_file_obj_li) => {
if (log_lvl) {
console.log(`event_file_obj_li = `, event_file_obj_li);
}
return event_file_obj_li;
});
if (log_lvl) {
console.log(`load_event_file_obj_li = `, load_event_file_obj_li);
}
ae_acct.slct.event_file_obj_li = load_event_file_obj_li;
// 2. Refresh files for the presenter
events_func.load_ae_obj_li__event_file({
api_cfg: ae_acct.api,
for_obj_type: 'event_presenter',
for_obj_id: event_presenter_id,
enabled: 'all',
hidden: 'all',
limit: 150,
try_cache: true
});
}
// WARNING: Precaution against shared data between sites and presentations.

View File

@@ -16,11 +16,6 @@ export async function load({ params, parent }) {
const ae_acct = data[account_id];
// console.log(`ae_acct = `, ae_acct);
// if (!account_id) {
// console.log(`ae events_pres_mgmt session [session_id] +page.ts: The account_id was not found in the data!!!`);
// return false;
// }
data.ae_events_pres_mgmt_event_session_id_page_ts = true;
const event_session_id = params.session_id;
@@ -35,62 +30,42 @@ export async function load({ params, parent }) {
ae_acct.slct.event_session_id = event_session_id;
if (browser) {
// Load event session object
const load_event_session_obj = await events_func.load_ae_obj_id__event_session({
if (log_lvl) console.log(`ae_events [session_id] +page.ts (Non-Blocking Refresh)`);
// OPTIMIZATION: Fire these in the background without 'await'.
// The Session View components use LiveQuery/Dexie and will update
// automatically once these background tasks complete.
// 1. Refresh the core session object
events_func.load_ae_obj_id__event_session({
api_cfg: ae_acct.api,
event_session_id: event_session_id,
// inc_presentation_li: true,
// inc_presenter_li: true,
try_cache: true
});
ae_acct.slct.event_session_obj = load_event_session_obj;
// Load event presentations for the session
const event_presentation_obj_li = await events_func.load_ae_obj_li__event_presentation({
// 2. Refresh presentations and their nested presenters
events_func.load_ae_obj_li__event_presentation({
api_cfg: ae_acct.api,
for_obj_type: 'event_session',
for_obj_id: event_session_id,
inc_presenter_li: true,
enabled: 'all',
hidden: 'all',
limit: 19,
// params: {},
limit: 150,
try_cache: true,
log_lvl: 2
log_lvl: 0
});
if (event_presentation_obj_li) {
for (let index = 0; index < event_presentation_obj_li.length; index++) {
const event_presentation_obj = event_presentation_obj_li[index];
const event_presentation_id = event_presentation_obj.event_presentation_id || event_presentation_obj.id;
const load_event_presenter_obj_li = await events_func.load_ae_obj_li__event_presenter({
api_cfg: ae_acct.api,
for_obj_type: 'event_presentation',
for_obj_id: event_presentation_id,
enabled: 'all',
hidden: 'all',
limit: 19,
try_cache: true,
log_lvl: 2
});
event_presentation_obj_li[index].event_presenter_li = load_event_presenter_obj_li;
}
}
ae_acct.slct.event_presentation_obj_li = event_presentation_obj_li;
// Load event files for the session
const load_event_file_obj_li = await events_func.load_ae_obj_li__event_file({
// 3. Refresh files for the session
events_func.load_ae_obj_li__event_file({
api_cfg: ae_acct.api,
for_obj_type: 'event_session',
for_obj_id: event_session_id,
enabled: 'all',
hidden: 'all',
limit: 50,
limit: 150,
try_cache: true
});
ae_acct.slct.event_file_obj_li = load_event_file_obj_li;
}
// WARNING: Precaution against shared data between sites and presentations.