JavaScript Academy · Les

Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten

Profileer in kleine stappen: meet met console.time/timeEnd en eenvoudige timers, vind trage code, verander één ding en meet opnieuw

Les 3 van 38 stappen

Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten is een gratis JavaScript Academy-les op CoddyKit. Dit is les 3 van 3. Je kunt 3 lessen uit dit leerpad gratis volledig lezen — daarna ontgrendelt CoddyKit PRO alle lessen, plus praktische oefeningen met een ingebouwde code-editor en een AI-tutor die 24/7 beschikbaar is. Deze les maakt deel uit van het leertraject JavaScript Academy. Je voortgang wordt gesynchroniseerd op het web en in de CoddyKit-app. De cursus JavaScript Academy bevat in totaal 3 lessen.

Waarom profileren?

Doel: meten → wijzigen → opnieuw meten.

  • Gebruik console.time/timeEnd voor een snelle tijdmeting
  • Gebruik een kleine now()-hulpfunctie voor handmatige tijdmetingen
  • Richt je alleen op drukke code
  • Wijzig één ding tegelijk
Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten — illustratie 1

Demo van console.time

console.time toont hoe lang het gemarkeerde blok duurde. Een uitstekend eerste hulpmiddel.

// Measure a small loop with console.time/timeEnd
console.time("sum");
let s = 0;
for (let i = 0; i < 100000; i = i + 1) {
  s = s + i;
}
console.timeEnd("sum");
console.log("sum value:", s);
Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten — illustratie 2

Hulpfunctie voor handmatige tijdmeting

Met handmatige tijdmeting kun je elke functie omwikkelen en uitvoeringen met dezelfde invoer vergelijken.

// A tiny now() helper that works in many runtimes
const now = (typeof performance !== "undefined" && performance.now)
  ? function () { return performance.now(); }
  : function () { return Date.now(); };

// Time a function manually
function timeFn(label, fn) {
  const t1 = now();
  const out = fn();
  const t2 = now();
  console.log(label + " ms:", (t2 - t1));
  return out;
}

timeFn("small work", function () {
  let x = 0;
  for (let i = 0; i < 50000; i = i + 1) { x = x + i; }
  return x;
});
Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten — illustratie 3

Drukke code vinden

Houd aanroepen en tijd bij om te ontdekken waar je app werk uitvoert; optimaliseer eerst de drukste functie.

// Count calls and total time to find hot spots
const metrics = { calls: 0, totalMs: 0 };

function hotWork(n) {
  const t1 = now();
  let sum = 0;
  for (let i = 0; i < n; i = i + 1) {
    sum = sum + (i % 3);
  }
  const t2 = now();
  metrics.calls = metrics.calls + 1;
  metrics.totalMs = metrics.totalMs + (t2 - t1);
  return sum;
}

// Simulate usage
for (let k = 0; k < 5; k = k + 1) {
  hotWork(80000);
}
console.log("calls:", metrics.calls, "avg ms:", metrics.totalMs / metrics.calls);
Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten — illustratie 4

Tijdmeting voor en na

Meet vóór en na een wijziging. Gebruik dezelfde invoer en vergelijk alleen de getallen.

// Compare two approaches with the same input
const hay = [];
for (let i = 0; i < 2000; i = i + 1) { hay.push(String(i)); }

const needles = [];
for (let i = 0; i < 1000; i = i + 1) { needles.push(String(i * 2)); }

function slowIncludes() {
  let count = 0;
  for (const n of needles) {
    if (hay.includes(n)) { count = count + 1; }
  }
  return count;
}

function fastSet() {
  const set = new Set(hay);
  let count = 0;
  for (const n of needles) {
    if (set.has(n)) { count = count + 1; }
  }
  return count;
}

const c1 = timeFn("includes run", slowIncludes);
const c2 = timeFn("set.has run", fastSet);
console.log("counts:", c1, c2);
Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten — illustratie 5

Goede gewoonten voor tijdmetingen

Tips:

  • Gebruik bij elke uitvoering dezelfde invoer.
  • Voer één keer een opwarmronde uit en meet daarna.
  • Verminder logboekregels tijdens het meten.
  • Wijzig één ding en meet opnieuw.
  • DevTools/Node hebben opnametools; begin met eenvoudige console.time.
Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten — illustratie 6

Quiz over de basis van console.time

Snelle controle: snel hulpmiddel voor tijdmetingen.

Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten — illustratie 7

Samenvatting

Samenvatting: Begin met console.time en een kleine now()-hulpfunctie. Vind drukke code, voer een eenvoudige wijziging door en meet opnieuw met dezelfde invoer.

Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten — illustratie 8
Gratis beginnen

Leer JavaScript met een AI-tutor — gratis

Schrijf echte code en voer die uit in je browser, krijg direct hulp van een AI-tutor die 24/7 beschikbaar is en ga verder waar je gebleven bent op het web of in de app.

Cursussen
59
Lessen
200

Veelgestelde vragen

Is de les “Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten” gratis?

Ja — je kunt hier op het web alle 3 lessen van het leerpad JavaScript Academy, waaronder “Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten”, gratis volledig lezen. Daarna ontgrendelt CoddyKit PRO alle lessen, plus interactieve oefeningen met een ingebouwde code-editor en een AI-tutor die 24/7 beschikbaar is. De cursus JavaScript Academy bevat in totaal 3 lessen.

Wat leer ik in “Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten”?

Profileer in kleine stappen: meet met console.time/timeEnd en eenvoudige timers, vind trage code, verander één ding en meet opnieuw Je oefent met JavaScript Academy door code rechtstreeks in de browser uit te voeren. Een AI-begeleider die 24/7 beschikbaar is beantwoordt je vragen terwijl je de les doorwerkt.

Heb ik ervaring nodig om met JavaScript Academy te beginnen?

Ervaring vooraf is niet nodig. JavaScript Academy op CoddyKit is opgebouwd voor beginners tot gevorderden, zodat je hier of bij het begin kunt starten en in je eigen tempo kunt leren. Dit is les 3 van 3.

Hoe lang duurt de les “Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten”?

De meeste lessen van CoddyKit duren ongeveer 5–10 minuten. Elke les is kort en interactief, zodat je gestaag vooruitgaat en op het web en in de app precies verdergaat waar je was gebleven.

Kan ik code schrijven en uitvoeren in deze les over JavaScript Academy?

Ja. Elke les over JavaScript Academy bevat een ingebouwde code-editor, zodat je rechtstreeks in je browser echte code kunt schrijven en uitvoeren en direct feedback van AI krijgt — lokale installatie is niet nodig.

Alle lessen in deze cursus

  1. De basis van Big-O, hot versus cold paths (winst voor beginners)
  2. Leaks voorkomen — closures, timers en referenties
  3. Kennismaking met profileren (Node/DevTools) — kleine timinggewoonten
← Terug naar JavaScript Academy