09. timer & console

[xgqfrms]

timer & console

timer

https://developer.mozilla.org/en-US/docs/Archive/Add-ons/Code_snippets/Timers

1. setTimeout
2. setInterval
3. requestAnimationFrame

https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout

https://developer.mozilla.org/en-US/docs/Web/API/console/assert

https://developer.mozilla.org/en-US/docs/Web/API/Performance/now

https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame

IDLE

idle meaning in js

https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/idle

https://www.cnblogs.com/xgqfrms/p/11433168.html

// var handle = window.requestIdleCallback(callback[, options])
var handle = window.requestIdleCallback(
    (IdleDeadline) => console.log(`handle =`, window.handle, IdleDeadline),
    {
        timeout: 1000,// mm
    }
);

// handle = 13 IdleDeadline {didTimeout: false}

// didTimeout: false__proto__: IdleDeadlinedidTimeout: (...)timeRemaining: ƒ timeRemaining()constructor: ƒ IdleDeadline()Symbol(Symbol.toStringTag): "IdleDeadline"get didTimeout: ƒ didTimeout()__proto__: Objectconstructor: ƒ Object()hasOwnProperty: ƒ hasOwnProperty()isPrototypeOf: ƒ isPrototypeOf()propertyIsEnumerable: ƒ propertyIsEnumerable()toLocaleString: ƒ toLocaleString()toString: ƒ toString()valueOf: ƒ valueOf()__defineGetter__: ƒ __defineGetter__()__defineSetter__: ƒ __defineSetter__()__lookupGetter__: ƒ __lookupGetter__()__lookupSetter__: ƒ __lookupSetter__()get __proto__: ƒ __proto__()set __proto__: ƒ __proto__()

window.cancelIdleCallback(handle);

https://alligator.io/js/console-time-timeend/
https://flaviocopes.com/requestanimationframe/
https://css-tricks.com/using-requestanimationframe/
http://javascriptkit.com/javatutors/requestanimationframe.shtml

https://developers.google.com/web/updates/2012/08/When-milliseconds-are-not-enough-performance-now

---

console

https://developer.mozilla.org/en-US/docs/Web/API/Console

https://developer.mozilla.org/en-US/docs/Web/API/console#Timers

1. color css
2. job ads
3. table / format

[xgqfrms]

console.time & console.timeEnd

https://developer.mozilla.org/en-US/docs/Web/API/Console/time

https://developer.mozilla.org/en-US/docs/Web/API/Console/timeEnd

https://stackoverflow.com/questions/12492979/how-to-get-the-output-from-console-timeend-in-js-console

// no necessary label, the default label is `default`

let log = console.log;

console.time();
log("Click to continue");
console.timeLog();
log("Do a bunch of other stuff...");
console.timeEnd();

let log = console.log;

console.time("answer time");
log("Click to continue");
console.timeLog("answer time");
log("Do a bunch of other stuff...");
console.timeEnd("answer time");

[xgqfrms]

demo

https://github.com/Advanced-Frontend/Daily-Interview-Question

https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/253

function wait() {
  return new Promise(resolve =>
    setTimeout(resolve, 10 * 1000)
  )
}

async function main() {
  console.time();
  await wait();
  await wait();
  await wait();
  console.timeEnd();
}
main();
// Promise {<pending>}
// default: 30001.47412109375ms

[xgqfrms]

ascii text art

https://www.cnblogs.com/xgqfrms/p/11442730.html

http://patorjk.com/software/taag/#p=display&h=0&v=0&f=Alpha&t=xgqfrms