RV cricketnest

A non-exhaustive list of WebGL and WebGPU frameworks and libraries. It is mostly for learning purposes as some of the libraries listed are wip/outdated/not maintained anymore.

Engines and libraries

three.js: JavaScript 3D library
stack.gl: an open software ecosystem for WebGL, built on top of browserify and npm.
PixiJS: Super fast HTML 5 2D rendering engine that uses webGL with canvas fallback
Pex: Pex is a javascript 3d library / engine allowing for seamless development between Plask and WebGL in the browser.
Babylon.js: a complete JavaScript framework for building 3D games with HTML 5 and WebGL
Filament: Filament is a real-time physically based rendering engine for Android, iOS, Windows, Linux, macOS and WASM/WebGL
ClayGL: A WebGL graphic library

	letter	frequency
	A	.08167
	B	.01492
	C	.02780
	D	.04253
	E	.12702
	F	.02288
	G	.02022
	H	.06094
	I	.06973

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

async/await is just the do-notation of the Promise monad

CertSimple just wrote a blog post arguing ES2017's async/await was the best thing to happen with JavaScript. I wholeheartedly agree.

In short, one of the (few?) good things about JavaScript used to be how well it handled asynchronous requests. This was mostly thanks to its Scheme-inherited implementation of functions and closures. That, though, was also one of its worst faults, because it led to the "callback hell", an seemingly unavoidable pattern that made highly asynchronous JS code almost unreadable. Many solutions attempted to solve that, but most failed. Promises almost did it, but failed too. Finally, async/await is here and, combined with Promises, it solves the problem for good. On this post, I'll explain why that is the case and trace a link between promises, async/await, the do-notation and monads.

First, let's illustrate the 3 styles by implementing

	# The command finds the most recent tag that is reachable from a commit.
	# If the tag points to the commit, then only the tag is shown.
	# Otherwise, it suffixes the tag name with the number of additional commits on top of the tagged object
	# and the abbreviated object name of the most recent commit.
	git describe

	# With --abbrev set to 0, the command can be used to find the closest tagname without any suffix:
	git describe --abbrev=0

	# other examples

	import { Link } from 'react-router-dom'
	import { Badge, Col, Menu } from 'antd'

	const StyledBadge = styled(Badge)`
	.ant-badge-count {
	background-color: #7ECBBF;
	color: white;
	box-shadow: 0 0 0 1px #d9d9d9 inset;
	}
	`

	import Reconciler from 'react-reconciler'
	import omit from 'lodash/omit'
	import capitalize from 'lodash/capitalize'
	import { actions as elementActions } from './store/elements'
	import * as Elements from './elements'

	const roots = new Map()
	const emptyObject = {}

	const Renderer = Reconciler({

	//http://www.w3.org/TR/notifications/
	//https://developer.mozilla.org/en-US/docs/Web/API/notification

	//Notifier.isSupported
	//
	//Notifier.permission //"granted", "denied", or "default"
	//
	//Notifier.requestPermission([callback]) //first argument of callback is the current permission
	//
	//Notifier.notify(title[, options])

	function translateError(msg) {
	var newErr = new Error(msg); // placed here to get correct stack
	return e => {
	newErr.originalError = e;
	throw newErr;
	}
	}

	async function asyncTask() {
	const user = await UserModel.findById(1).catch(translateError('No user found'))

	// suppose you spawned 16 node processes on 16 core CPU

	ps axf \| grep node \| grep -v grep \| awk '{print $1}' \| xargs -n 1 taskset -cp 0-15