Core idea
performance.now()
The Performance API lets you measure loading and runtime behavior in the browser.
const start = performance.now(); runWork(); const duration = performance.now() - start;
Security & Performance
The Performance API lets you measure loading and runtime behavior in the browser.
Security and performance are not cleanup tasks at the end. They influence which APIs you choose, how you update the DOM and how much work runs on the main thread.
The goal is practical judgement: safe output, measured code, controlled permissions and browser work that does not punish the user.
performance.now()
Treat input, network data and third-party code as untrusted until proven otherwise.
Measure before optimizing, then remove unnecessary work.
Use defaults that are safe, explicit and easy to review.
Examples
const start = performance.now(); runWork(); const duration = performance.now() - start;
const start = Date.now(); // Lower precision and less suited to performance measurement.
Code patterns
Use these examples as a practical reference for safer DOM updates, browser policies and performance habits.
Use this direction in real code.
const start = performance.now(); runWork(); const duration = performance.now() - start;
This version introduces security, performance or maintenance risk.
const start = Date.now(); // Lower precision and less suited to performance measurement.
Performance work should start with numbers.
const start = performance.now(); runWork(); console.log(performance.now() - start);
Keep unsafe operations rare and visible.
function renderText(element, value) {
element.textContent = value;
}
Rules that matter
Every script runs inside a browser, on a real device, with real data. That makes security and performance part of the feature.
Render untrusted values as text unless sanitized by a proven process.
eval and similar patterns expand the attack surface.
CORS and CSP are server/browser policies, not client hacks.
Use browser tools and APIs before guessing.
Batch DOM reads and writes, debounce noisy events and avoid unnecessary loops.
Security and performance problems often enter through packages.
Production thinking
Security bugs and slow interfaces both destroy trust. Users may not see the code, but they feel the consequences immediately.
Fast, stable JavaScript helps keyboard users, screen readers and users on lower-powered devices. Security UI also needs clear messages.
Production JavaScript should use CSP, safe DOM updates, measured performance and code review around risky APIs.
A fast, stable page is easier for users and crawlers to process. Critical content should not depend on fragile client code.
Live code lab
The preview runs inside an isolated iframe. The JavaScript is placed inside the HTML editor for now, so every example stays together and remains easy to understand.
Mini assignment
Practice assignment
Try it yourself
Self-check
Answer these before moving to the next security and performance lesson.
Senior audit upgrade
Use these references when browser support, syntax details or proposal status matters.