laksh
web-vitals integration
I am coming from a POV where
src/index.jsx is the root file which wont be triggered again even if the user navigates to other components/routes. So is it good to keep it outside onMount() (the 2nd approach.)
Also ,the react docs has an inbuilt fn called reportWebVitals which is recommended to be invoked outside onMount in the react docs.
Because of the above POV, I wanted to know what difference it makes in 1st vs 2nd approach?
29 replies
web-vitals integration
@Eagerestwolf No I am not trying to log I am just sending it to api from client side. My application is client side
Basically Logger is a class which has a logic of queuing up the objects and sending it to an api. Forget about the Logger class.
I want to know which is the right place for invoking initWebVitals fn. Should it be inside onMount of src/index.jsx or outside of onMount in src/index.jsx...only this is my ask.
29 replies
web-vitals integration
To integreate this library in solidjs
I have a function called initWebVitals() which looks like this. Now my question is where should this function be called inside src/index.jsx . Should this be called in onMount of index.jsx or outside of onMount in index.jsx?
performance.js
import { onCLS, onLCP, onTTFB, onFCP, onINP } from 'web-vitals';
import Logger, { LOG_LEVELS } from './logger';
function sendToAnalytics(metric) {
const immediate = metric.name === 'LCP' || metric.name === 'CLS';
Logger.info({ ...metric, pathname: window.location.pathname }, true, immediate);
}
export function initWebVitals() {
onCLS(sendToAnalytics);
onLCP(sendToAnalytics);
onTTFB(sendToAnalytics);
onFCP(sendToAnalytics);
onINP(sendToAnalytics);
}
29 replies