peebeebee

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Element

Box metrics

• elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
• elem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeight
• elem.getClientRects(), elem.getBoundingClientRect()

peebeebee

Keybase proof

I hereby claim:

• I am peebeebee on github.
• I am pbriers (https://keybase.io/pbriers) on keybase.
• I have a public key ASDdTj8q8k5jVlvpVUzcZpR7u5Dmp-2AfrchRRy-PhBxRgo

To claim this, I am signing this object:

peebeebee

# A functional and reactive JavaScript framework for cleaner code
http://cycle.js.org/

# Elm
http://elm-lang.org/

# Closure
http://clojurescript.org/

peebeebee

:) Krijg een brief over de "MijnVoorkeuren" service van bPost.
:( Ga online om voorkeuren in te geven. Service down... 
:) Probeer de dag nadien opnieuw. Lukt om Cubee-punt als voorkeur in te stellen.
:( Volgende pakketjes komen nog steeds niet aan in Cubee-punt.
:| Krijg opnieuw melding om "MijnVoorkeuren" aan te vullen, want nu kan er meer informatie worden ingegeven ed... 
:( Volgend pakketje laat de postbode laat gewoon een papiertje achter zonder aan te bellen. Ik was thuis!
:) Papiertje bevat 2 adressen: Cubee-punt, of het postkantoor (als het niet in het postkantoor ligt)
:( Ga naar Cubee-punt. Pakje niet daar.
:( Ga naar Post-kantoor. Pakje niet daar.
:( Pakje ligt op een ander postpunt, niet vermeld op het papiertje.

peebeebee

const roman = 'XXVIV';
const mapping = {'X': 10, 'I': 1, 'V': 5}; // add stuff
const total = roman.split('').map(el => mapping[el]).reduce((acc, curr, i, src) => {
  let prev = src[i-1];
  return (prev && curr > prev)
    ? acc - prev + (curr-prev)
    : acc + curr;
}, 0);

peebeebee

peebeebee

const body = document.body;
const hero = document.querySelector('.hero').cloneNode(true);
const materials = document.querySelector('.project-materials').cloneNode(true);
const article = document.querySelector('.project-steps').cloneNode(true);

body.innerHTML = `<style>
.step-type {
    page-break-inside: avoid;
}