Profiler
The profiler plugin allows you to measure your JS functions performance and capture both arguments and result for each call.
Installation
npm i @openreplay/tracker-profiler
Usage
Initialize the tracker and load the plugin into it. Then decorate any function inside your code with the generated function.
If your website is a Single Page Application (SPA)
import OpenReplay from '@openreplay/tracker';import trackerProfiler from '@openreplay/tracker-profiler';const tracker = new OpenReplay({projectKey: PROJECT_KEY});const profiler = tracker.use(trackerProfiler());tracker.start();// ...const fn = profiler('MyFunction')(() => {// Inspecting function body}, thisArg); // thisArg is optional
If your web app is Server-Side-Rendered (SSR)
Follow the below example if your app is SSR. Ensure tracker.start()
is called once the app is started (in useEffect
or componentDidMount
).
import OpenReplay from '@openreplay/tracker/cjs';import trackerProfiler from '@openreplay/tracker-profiler/cjs';//...const tracker = new OpenReplay({projectKey: PROJECT_KEY});const profiler = tracker.use(trackerProfiler());//...function MyApp() {useEffect(() => { // use componentDidMount in case of React Class Componenttracker.start();}, [])}//...const fn = profiler('MyFunction')(() => {// Inspecting function body}, thisArg); // thisArg is optional
Troubleshooting
Having trouble setting up this plugin? please connect to our Slack and get help from our community.