Understanding the User Timing API
The User Timing API is part of the broader Performance API that enables developers to measure custom application performance using high-precision timestamps recorded in the browser's performance timeline. Unlike browser-provided performance entries such as resource timing or navigation timing, the User Timing API allows you to define your own measurement points that align with your application's specific workflows and user interactions.
The API introduces two primary types of performance entries:
- PerformanceMark objects -- named timestamps placed at specific points in your code
- PerformanceMeasure objects -- represent the duration between two marks
This architecture gives you complete control over what you measure and how you structure your performance data. The advantage of using the User Timing API over simple Date.now() calls is that these entries integrate seamlessly with browser developer tools and external performance monitoring platforms. For a comprehensive overview of the User Timing API and its capabilities, see our User Timing API guide.
To create marks in the first place, you'll use performance.mark() which places named timestamps at critical points in your application code.
clearMarks() Fundamentals
Syntax and Parameters
The clearMarks() method is called on the performance object and accepts an optional parameter that determines which marks to remove:
performance.clearMarks()
performance.clearMarks(name)
When called without arguments, clearMarks() removes all PerformanceMark entries from the performance timeline. When called with a specific name string, it removes only the marks that match that name.
Return Value
The clearMarks() method returns undefined and operates purely as a side effect on the performance timeline. This means the method doesn't return the removed entries or provide any confirmation--it simply performs the cleanup operation.
Browser Support
The clearMarks() method is widely supported across all modern browsers, having been available since September 2017. It is also available in Web Workers, allowing you to manage performance marks in background script contexts. This broad support makes clearMarks() a reliable choice for production applications.
For measuring durations between marks, pair clearMarks() with performance.measure() which calculates the time between any two marks you've created.
1// Remove a specific mark2performance.clearMarks('login-started');3 4// Remove all performance marks5performance.clearMarks();6 7// Combining with performance.measure()8performance.mark('processing-start');9// ... perform work ...10performance.mark('processing-end');11 12// Measure the duration13performance.measure('processing-duration', 'processing-start', 'processing-end');14 15// Clean up the marks used for measurement16performance.clearMarks('processing-start');17performance.clearMarks('processing-end');Memory Management
Prevents unbounded growth of the performance timeline in long-running applications
Focused Analysis
Keeps performance data focused on recent, relevant measurements
Clean Measurement Cycles
Enables fresh starts for each measurement session or user interaction
Web Worker Support
Available in background script contexts for comprehensive performance monitoring
function trackFormSubmission(formId) {
performance.mark(`form:${formId}:submit-start`);
submitFormData(formId).then(() => {
performance.mark(`form:${formId}:submit-end`);
performance.measure(
`form:${formId}:duration`,
`form:${formId}:submit-start`,
`form:${formId}:submit-end`
);
// Clean up temporary marks
performance.clearMarks(`form:${formId}:submit-start`);
performance.clearMarks(`form:${formId}:submit-end`);
});
}
Frequently Asked Questions
What happens if I call clearMarks() with a mark name that doesn't exist?
Calling clearMarks() with a name that doesn't exist in the performance timeline has no effect--the method simply does nothing for that non-existent name.
Does clearMarks() also remove PerformanceMeasure entries?
No, clearMarks() only removes PerformanceMark entries. Use performance.clearMeasures() to remove PerformanceMeasure entries.
Can I recover marks after calling clearMarks()?
No, once marks are removed with clearMarks(), they are permanently deleted from the performance timeline and cannot be recovered.
Should I clear marks in production applications?
Yes, regularly clearing marks in production prevents memory bloat in long-running applications and keeps performance data focused on recent user interactions.