krakenjs / zoid

Cross domain components
Apache License 2.0
2.02k stars 248 forks source link

Feature request - Add events for prerender phases #402

Open gregjopa opened 2 years ago

gregjopa commented 2 years ago

Zoid has the following event feature for tracking when rendering completes: https://github.com/krakenjs/zoid/blob/main/docs/api/create.md#listening-to-zoid-events. These RENDER and RENDERED events work great for measuring rendering performance. However, we are missing events for knowing when the prerender phase is complete with prerenderTemplate.

To solve this problem let's add the following new events for hooking into the prerender lifecycle:

  1. onPrerender (EVENT.PRERENDER) - prerender starts
  2. onPrerendered (EVENT.PRERENDERED) - prerender finishes
    prerenderTemplate: function containerTemplate({ doc, event }) {

        event.on(EVENT.PRERENDERED, () => {
            performance.mark('prerender-complete');
        });
        // rest of the prerenderTemplate code...
    }
bluepnume commented 2 years ago

Totally possible, but remember prerender is completely synchronous, so you can just do:

    prerenderTemplate: function containerTemplate({ doc, event }) {
        log('START_PRERENDER');

        // do the prerender

        log('END_PRERENDER');
    }

That said -- this won't be that useful since:

  1. Prerender start will be virtually the same time as the 'render' event time, since prerender and render are kicked off at the same time
  2. Prerender end will be virtually the same time as prerender start, since it's a synchronous function (always)
gregjopa commented 2 years ago
  1. Prerender end will be virtually the same time as prerender start, since it's a synchronous function (always)

What about the time it takes to insert the prerenderFrame into the DOM? Here's the code I'm referring to. https://github.com/krakenjs/zoid/blob/c10ac415ce6a2174c7ef08f2451da95bb9795888/src/parent/parent.js#L817. My thought is we need EVENT.PRERENDERED to include that cost.

bluepnume commented 2 years ago

Aaah that's fair. Yeah it's still synchronous; but definitely wouldn't hurt to measure. No objections!

gregjopa commented 2 years ago

Sweet thanks for the review @bluepnume!

jmichaelterenin commented 2 years ago

@gregjopa Are we able to pull this version (with PRERENDER/ED)? it's not available on the Cloudflare CDN and I can't get npm to install v10.1.0, as either a version or tag. Please help if you have a moment