Marcin Ignac vorg

Make it real

Ideas are cheap. Make a prototype, sketch a CLI session, draw a wireframe. Discuss around concrete examples, not hand-waving abstractions. Don't say you did something, provide a URL that proves it.

Ship it

Nothing is real until it's being used by a real user. This doesn't mean you make a prototype in the morning and blog about it in the evening. It means you find one person you believe your product will help and try to get them to use it.

Do it with style

The introduction to Reactive Programming you've been missing

(by @andrestaltz)

This tutorial as a series of videos

If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.

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 ⚙️

Name	Stars	Last Commit	Description
three.js	![GitH

WGSL Noise Algorithms

Good and fast integer hash

// https://www.pcg-random.org/
fn pcg(n: u32) -> u32 {
    var h = n * 747796405u + 2891336453u;
    h = ((h >> ((h >> 28u) + 4u)) ^ h) * 277803737u;
    return (h >> 22u) ^ h;
}

WGSL 3D SDF Primitives

Revision: 06.08.2023, https://compute.toys/view/407

Sphere - exact

fn sdSphere(p: vec3f, r: f32) -> f32 {
  return length(p) - r;
}

	// MIT licensed.

	function fabsf (arg) {
	return arg >= 0 ? arg : -arg
	}
	function planeBoxOverlap (normal, vert, maxbox) {
	var q
	var vmin = []
	var vmax = []
	var v

	#!/bin/sh

	# From http://blog.pkh.me/p/21-high-quality-gif-with-ffmpeg.html

	# Usage:
	# ./makegif.sh inputframes output.gif
	# where inputframes is a directory containing .png frames

	# Change size here
	filters="scale=640:-1:flags=lanczos"

	import SwiftUI
	import PlaygroundSupport

	struct Desktop: View {
	var body: some View {
	ZStack {
	// Image(uiImage: #imageLiteral(resourceName: "IMG_6281.JPG"))
	Color(UIColor.systemBlue)
	macOS()
	}

	1) Clone and build WebKit

	git clone https://github.com/WebKit/WebKit.git WebKit
	cd WebKit
	Tools/Scripts/build-webkit -cmakeargs="-DENABLE_WEBGPU_BY_DEFAULT=1" --debug


	2) Run your app

	__XPC_METAL_CAPTURE_ENABLED=1 Tools/Scripts/run-minibrowser --debug --url http://localhost:5000/index.html#/loaders/gsplat

	// Mesh gradient editor — interactive MESH_GRADIENT showcase.
	//
	// A sidebar lists up to 16 color points: click a row to select it, click the
	// "+" row to add a point, and DELETE/BACKSPACE removes the selected point
	// (the last one always stays). The picker at the bottom-left edits the
	// selected color: an HSV square + hue strip working in Display P3, plus
	// per-channel HDR gain sliders (100%..400% of SDR) for EDR displays. Points
	// are drawn as ring handles over the gradient; drag them to move the colors
	// around. Handles fade out when the mouse has been still for two seconds,
	// and the layout follows the window size.