LonelyGriffin

/*
Usage:
 * Paste this into your dev tools console (or even better as a snippet)
 * It will parse the page and find all the things that create a new stacking context
   and dump some info about them to the console. It will also outline them on the page.

 * This is pretty rough and probably misses heaps of bugs and edge cases.
 */

function run() {

LonelyGriffin

window.main = (function(deps) {
  debs.foo(); // use dependecy
})({
  foo: window.utils.foo,
  bar: window.utils.bar,
})

LonelyGriffin

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()

LonelyGriffin

Array.from(new Array(10).keys()) // [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

LonelyGriffin

ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
li {
  margin:0;
  padding: 0;
  text-indent: 0;
  list-style-type: 0;

LonelyGriffin

var translate = (function () {
    var symbols = {
        a: '([]+![])[+!+[]]',
        b: '([]+{})[+!+[]+!+[]]',
        c: '([]+{})[+!+[]+!+[]+!+[]+!+[]+!+[]]',
        d: '([]+[][+[]])[+!+[]+!+[]]',
        e: '([]+[][+[]])[+!+[]+!+[]+!+[]]',
        f: '([]+[][+[]])[+!+[]+!+[]+!+[]+!+[]]',
        g: '([]+([]+[])[([]+{})[+!+[]+!+[]+!+[]+!+[]+!+[]]+([]+{})[+!+[]]+([]+[][+!+[]])[+!+[]]+([]+![])[+!+[]+!+[]+!+[]]+([]+{})[+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]]+([]+!![])[+!+[]]+([]+!![])[+!+[]+!+[]]+([]+{})[+!+[]+!+[]+!+[]+!+[]+!+[]]+([]+{})[+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]]+([]+{})[+!+[]]+([]+!![])[+!+[]]])[+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]]', 
        h: '(+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[])[([]+{})[+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]]+([]+{})[+!+[]]+([]+([]+[])[([]+{})[+!+[]+!+[]+!+[]+!+[]+!+[]]+([]+{})[+!+[]]+([]+[][+!+[]])[+!+[]]+([]+![])[+!+[]+!+[]+!+[]]+([]+{})[+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]]+([]+!![])[+!+[]]+([]+!![])[+!+[]+!+[]]

LonelyGriffin

¯\_(ツ)_/¯

LonelyGriffin

[ 
  {name: 'Afghanistan', code: 'AF'}, 
  {name: 'Åland Islands', code: 'AX'}, 
  {name: 'Albania', code: 'AL'}, 
  {name: 'Algeria', code: 'DZ'}, 
  {name: 'American Samoa', code: 'AS'}, 
  {name: 'AndorrA', code: 'AD'}, 
  {name: 'Angola', code: 'AO'}, 
  {name: 'Anguilla', code: 'AI'}, 
  {name: 'Antarctica', code: 'AQ'}, 

LonelyGriffin

// BOX - is AABB

export const isSegmentBoxIntersection = (s: [Vector, Vector], b: Box) => {
	
}

LonelyGriffin

export const vectorInPolygon = (v: Vector, p: Polygon): boolean => {
	// ray-casting algorithm based on
	// http://www.ecse.rpi.edu/Homepages/wrf/Research/Short_Notes/pnpoly.html

	// using right-horizontal ray from a vector point

	const x = v[0];
	const y = v[1];

	let isInside = false;