Fabian Iwand mootari

Directory structure for JavaScript/Node Projects

While the following structure is not an absolute requirement or enforced by the tools, it is a recommendation based on what the JavaScript and in particular Node community at large have been following by convention.

Beyond a suggested structure, no tooling recommendations, or sub-module structure is outlined here.

Directories

lib/ is intended for code that can run as-is
src/ is intended for code that needs to be manipulated before it can be used

Currently considering https://github.com/webdriverio/webdrivercss

Core Goals:

Can test in up-to-date versions of all major browsers
Can test on up-to-date versions of all major OSes
Can test in IE9 (because Bootstrap v4 will support IE9+)
Don't want to have to setup/maintain our own cluster of VMs running all the necessary OSes (and all the versions of Windows)
Workflow for management of reference/baseline/norm screenshots

HMAC over Basic Auth

This is a pattern I use fairly frequently for administrative APIs. It's a sort of OAuth lite for non-public APIs that produces good quality tokens. Once you build it a few times, it's not any harder than using arbitrary basic auth in your APIs.

The client and the app share a secret, which is never transmitted across the wire. The client uses this secret to create an HMAC digest of a payload consisting of the current time and a random nonce value. The nonce is provided as the Basic Authorization user, and the resulting HMAC digest is provided as the Basic Authorization password.

A similar process is followed on the server side. The server uses the supplied nonce, its own time, and its own copy of the shared secret. It may want to check against several tokens across a small window of times to account for clock drift.

Using HMAC means the secret is never transmitted across the wire. Theoretically these are safe across plaintext connections, but you're using TLS anyway, right?
The i

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.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

Strictly Frameworks

Mobiledoc - github.com/bustle/mobiledoc-kit - framework to build editors with a standardized JSON structure
ShareDB - github.com/share/sharedb - framework to sync any JSON document using operational transforms, add real-time collaborative editing to anything else
Bangle.dev - github.com/bangle-io/bangle.dev - toolkit built for building editors, based on prosemirror

Abstracted Editors

These use separate document structures instead of HTML, some are more modular libraries than full editors

Exposed headers

Service	SSL	status	Response Type	Allowed methods	Allowed headers

	#!/bin/bash

	# We need the TAB character for SED (Mac OS X sed does not understand \t)
	TAB="$(printf '\t')"

	function abort {
	echo "$(tput setaf 1)$1$(tput sgr0)"
	exit 1
	}

	#!/bin/bash
	current=$(git rev-parse HEAD)
	commits=$(git rev-list $1)
	for rev in $commits; do
	git checkout --quiet $rev
	git apply --check $2 2>/dev/null
	if [ $? == 0 ]; then
	git log -n 1
	exit 0
	fi

	{
	"ignition": {
	"version": "2.0.0",
	"config": {}
	},
	"storage": {
	},
	"systemd": {},
	"networkd": {},
	"passwd": {