Iurii Plugatariov makefunstuff

Minimal D3D11

Minimal D3D11 reference implementation: An uncluttered Direct3D 11 setup + basic rendering primer and API familiarizer. Complete, runnable Windows application contained in a single function and laid out in a linear, step-by-step fashion that should be easy to follow from the code alone. ~200 LOC. No modern C++, OOP or (other) obscuring cruft. View on YouTube

Other gists in this series:

Minimal D3D11 part 2

Meteor Alternatives Per Feature

This table was created in 2015 so may be quite outdated today.

Feature	Meteor Solution	Alternative Solutions	Description
Live DB Sync	[livequery][lq] ([mongo-oplog]), [ddp]	RethinkDB, Redis, ShareDB, [npm:mongo-oplog], [firebase], etc.	Push DB updates to client/server.
Latency Compensation, Optimistic UI	[minimongo][mm]	[RethinkDB][lcr], [mWater/minimongo] (fork, not ws but http, browserify)	Imitate successful db query on client before it is done.
Isomorphic Code	[isobuild] & isopacks	browserify	Write one code for server/client/mobile.
Isomorphic Packaging	[isobuild], atmosphere		No more separate packages for server & client. Get bower + npm + mobile.

Build Server

Go to Digital Ocean
Create new droplet
London
Ubuntu
No apps
Add SSH keys

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

	// vulkan-tutorial.com Triangle with Odin
	// also has personal tweaks/additions, explicit naming, entire enum names

	package main

	import fmt "core:fmt"
	import math "core:math"
	import os "core:os"
	import str "core:strings"
	import glfw "vendor:glfw"

	// reference: https://gist.github.com/msmshazan/dfd5362004be37ff5e016b6a42be5083
	package d3d11_triangle

	import "core:strings"
	import "core:runtime"
	import "core:fmt"
	import "core:sys/windows"
	import d3d11 "vendor:directx/d3d11"
	import dxgi "vendor:directx/dxgi"
	import d3dc "vendor:directx/d3d_compiler"

	// example how to set up D3D11 rendering on Windows in C

	#define COBJMACROS
	#define WIN32_LEAN_AND_MEAN
	#include <windows.h>
	#include <d3d11.h>
	#include <dxgi1_3.h>
	#include <d3dcompiler.h>
	#include <dxgidebug.h>

	// example how to set up D3D11 rendering

	// set to 0 to create resizable window
	#define WINDOW_WIDTH 1280
	#define WINDOW_HEIGHT 720

	// do you need depth buffer?
	#define WINDOW_DEPTH 1

	// do you need stencil buffer?

	/*
	* Steps
	* 1. Rename your gulpfile.js to gulpfile.babel.js
	* 2. Add babel to your package.json (npm install -D babel)
	* 3. Start writing ES6 in your gulpfile!
	*/

	import gulp from 'gulp'; // ES6 imports!
	import sass from 'gulp-sass';

	#!/usr/bin/env sh

	glslc shader.vert -o vert.spv
	glslc shader.frag -o frag.spv