Profiler
O plugin profiler permite medir o desempenho das suas funções JS e capturar tanto os argumentos quanto o resultado de cada chamada.
Instalação
Section titled Instalaçãonpm i @openreplay/tracker-profiler
Inicialize o tracker e carregue o plugin nele. Em seguida, decore qualquer função do seu código com a função gerada.
Se o seu site é uma Single Page Application (SPA)
Section titled Se o seu site é uma Single Page Application (SPA)import trackerProfiler from '@openreplay/tracker-profiler';
import { tracker } from '@openreplay/tracker';
tracker.configure({
projectKey: 'YOUR_PROJECT_KEY',
ingestPoint: "https://openreplay.mydomain.com/ingest", // when dealing with the self-hosted version of OpenReplay
});
const profiler = tracker.use(trackerProfiler());
tracker.start();
// ...
const fn = profiler('MyFunction')(() => {
// Inspecting function body
}, thisArg); // thisArg is optional
Se o seu web app usa Server-Side Rendering (SSR)
Section titled Se o seu web app usa Server-Side Rendering (SSR)Siga o exemplo abaixo se o seu app usa SSR. Garanta que tracker.start() seja chamado depois que o app for iniciado (em useEffect ou componentDidMount).
import trackerProfiler from '@openreplay/tracker-profiler/cjs';
import { tracker } from '@openreplay/tracker';
tracker.configure({
projectKey: 'YOUR_PROJECT_KEY',
ingestPoint: "https://openreplay.mydomain.com/ingest", // when dealing with the self-hosted version of OpenReplay
});
const profiler = tracker.use(trackerProfiler());
//...
function MyApp() {
useEffect(() => { // use componentDidMount in case of React Class Component
tracker.start();
}, [])
}
//...
const fn = profiler('MyFunction')(() => {
// Inspecting function body
}, thisArg); // thisArg is optional
Tem dúvidas?
Section titled Tem dúvidas?Está com dificuldade para configurar este plugin? Conecte-se ao nosso Slack e receba ajuda da nossa comunidade.