jpvincent

// idée originale : https://developers.google.com/web/fundamentals/performance/user-centric-performance-metrics#load_abandonment
window.__trackAbandons = () => {
  // Remove the listener so it only runs once.
  document.removeEventListener('visibilitychange', window.__trackAbandons);
  const ANALYTICS_URL = 'https://www.google-analytics.com/collect';
  const GA_COOKIE = document.cookie.replace(
    /(?:(?:^|.*;)\s*_ga\s*\=\s*(?:\w+\.\d\.)([^;]*).*$)|^.*$/, '$1');
  const TRACKING_ID = 'UA-XXXXX-Y';
  const CLIENT_ID =  GA_COOKIE || (Math.random() * Math.pow(2, 52));

jpvincent

const timings = performance.getEntriesByType('navigation')[0]
const allEntries = performance.getEntries()
const customMetrics = allEntries
  .filter(entry => ['mark', 'measure'].includes(entry.entryType )) // array of PerformanceMark / PerformanceMeasure objects
  .reduce((final, current) => { // make an object
    final[current.entryType.toUpperCase() +  ' — ' + current.name] // key name : "MARK — loadInAsync que/query_grid_webpart start"
      = Math.round(
        current.entryType === 'measure' ? current.duration : current.startTime
      )

jpvincent

<script>
	let lazyModalComponent;
	let isPending = false;

	function openModal() {
		isPending = true;
		lazyModalComponent = import(`./Modal.svelte`);
		lazyModalComponent.catch((error) => {
			// gestion en cas d'erreur de connexion ici
		}).finally(() => {

jpvincent

import { lazy, useState, useTransition } from 'react';
import { ErrorBoundary } from 'react-error-boundary';

const Modal = lazy(() => import('./Modal.jsx'));

export default function App() {
	const [isPending, startTransition] = useTransition();
	const [opened, setOpened] = useState(false);

	function openModal() {