Tag: #programming
Interactive Turing patterns in WebGPU
2024-05-29
WebGPU hello world in 2024
2024-05-25
What is Monte Carlo integration?
2024-04-24
How to escape JavaScript for a script tag
2024-04-24
What is the Metropolis algorithm?
2024-04-18
Shape typing in Python
2024-04-12
Tell the LLM the business context
Tell LLM why its task is needed and how the output will be used. You’ll get better results, but programmers often don’t do this because it’s anti-modular. 2024-03-30
It might not need a label
Often, content is self-labelling. Removing its label can make the content more scannable. Programmers often over-label. 2024-03-20
How can I capture all crashes in a web page?
Including uncaught errors, unhandled promise rejections, image load failures, Content Security Policy violations, and
console.error
calls. 2024-03-14How do errors in a web page reach the dev console?
Errors in JavaScript cause an
ErrorEvent
on window
. Preventing the default action blocks console output. Resource errors follow the capture-bubble event model. 2024-03-13A formula for responsive font-size
Try setting the root font-size to
calc(1rem + 0.25vw)
instead of using media queries with fixed breakpoints. 2024-03-12Setting font-size based on viewing distance
Estimating viewing distance from screen size to set optimal font-size, but other factors like user mobility, long-sightedness, and short-sightedness complicate the ideal font-size calculation. 2024-03-11
How does HotJar record your screen?
“Session replay” tools record user interactions by capturing DOM changes, external resources, and viewport state, using efficient techniques like the MutationObserver API. 2024-03-09
The golden rule of PR reviews
The “golden rule” of code reviews is to approve improvements. Approve pull requests that fix bugs, even if the implementation isn’t ideal. 2023-10-07
Proving 1+1=2 and other advanced theorems
Lean is used to define and prove the commutativity of addition on natural numbers. 2023-06-14
How to export a model for TensorFlow.js
Exporting a TensorFlow model, converting it to the TensorFlow.js format, and running it in the browser with interactive input. 2021-03-09
TensorFlow 2 ‘hello world’
A TensorFlow 2 program that learns the cost per gram of chocolate by training a linear model on example chocolate bar weights and prices. 2021-02-17
What is a Single-Shot Multibox Detector?
A neural network architecture that can output bounding boxes. It uses a fixed set of “anchor points” and predicts offsets and sizes for each anchor. 2021-02-16
How to run a pre-trained model in TensorFlow.js
Load the model, convert the input to a tensor, preprocess the tensor to match the model’s expected format, run inference with
.predict()
, and decode the prediction tensor. 2021-02-15How to replace GIF with HTML video in 2021
To replace a GIF with an HTML
<video>
element in 2021, use a long list of attributes disable unwanted browser behaviors. 2021-01-19Measuring audio volume in JavaScript
A demo of real-time microphone volume measurement using the Web Audio API’s
AnalyserNode
. 2021-01-18NPM addon package hello world
How to create an NPM addon package from C++ code using the
node-gyp
tool and a binding.gyp
file, with a JavaScript wrapper module for a more idiomatic API. 2020-12-07Homogeneous coordinates in 3D
I implement homogeneous coordinates in 3D, including rotation, scaling, translation, and projection matrices, and use them to create an animated 3D house scene. 2020-11-29
Homogeneous coordinates in 2D, from scratch
Homogeneous coordinates enable a matrix to translate points. I show a six-line JS library. 2020-11-28
A matrix library in 5 lines of code
A 5-line matrix library, and how to derive it without rote memorization. 2020-11-27
How do classes work in JavaScript?
JavaScript
class
syntax is just syntactic sugar over the traditional prototype-based inheritance. Deconstructing a simple class
reveals the underlying constructor functions, prototype assignment, and use of super
to call the superclass’s constructor. 2020-11-03How do JavaScript prototypes work?
JavaScript has two different “prototype” concepts: an own property with the string key “prototype”, and a parent slot. Don’t confuse the two! 2020-11-02
What does the dot do in JavaScript?
foo.bar
, foo.bar()
, or foo.bar = baz
- what do they mean? A deep dive into prototypical inheritance and getters/setters. 2020-11-01The many sizes of a video element
A playground to explore the various widths and heights of a
<video>
element, as reported by different browser APIs, when displaying a webcam stream with dynamically adjustable constraints. 2020-10-23Why is my WebGL texture upside-down?
WebGL’s
texImage2D
function expects pixels in bottom-to-top order, while browsers provide them top-to-bottom. UNPACK_FLIP_Y_WEBGL
fixes this behavior. 2020-10-22Use varyings for texture2D coordinates!
Using a
varying
to pass the texture coordinates to the fragment shader avoids the need to perform divisions in the fragment shader, improving performance. 2020-10-21How do JavaScript async iterators work?
Async iterators use the
Symbol.asyncIterator
method to define the iteration protocol. 2020-10-19MediaRecorder hello world
The MediaStream Recording API converts a MediaStream to a Blob of compressed video and audio. A demo where you can record a 5-second clip. 2020-10-17
Babel JS from the ground up
Babel is a JavaScript compiler that transforms JavaScript code. Here I use its API programmatically. 2020-10-16
How does
require
work in Electron? require
in Electron works like Node.js, allowing you to load modules, but each Renderer process has its own isolated module state. Relative module resolution depends on whether you use loadFile
or loadURL
. 2020-10-15The Electron process architecture is the Chromium process architecture
An Electron instance is basically a Chromium instance. It just has some Node.js integration. 2020-10-14
WebRTC group chat hello world
A WebRTC-based group chat application that uses Ably’s publish-subscribe system for signaling. Clients connect directly via peer-to-peer data channels, with Ably facilitating the initial connection. 2020-10-13
A head in a box with BlazeFace
A method for calculating a bounding circle around a head, using facial landmarks from BlazeFace. Plus a live demo that you can run on your own face. 2020-10-12
Head tracking with BlazeFace
A method for calculating a bounding circle around a head, using facial landmarks from BlazeFace. Plus a live demo that you can run on your own face. 2020-10-11
How to self-host a TensorFlow.js model
Involves downloading the model manifest file and associated binary weight files, to avoid downloading large models every application launch. 2020-10-07
How to make a floating head
Creating a “floating head” effect using WebGL and the BodyPix machine learning model to segment the face from a webcam feed. 2020-10-06
How does the Node.js REPL display previews?
Node.js REPL uses the
inspector
module to safely evaluate expressions as you type, using V8’s evaluation with throwOnSideEffect: true
to avoid executing harmful code. 2020-10-05What are UMD modules? One final module system to rule them all (except ES modules which are a different thing)
UMD modules are a way to write JavaScript code that can be used in any module system (e.g. CommonJS, AMD, or as a global variable). 2020-10-04
What are AMD modules? Fetch your sick bag
“Simplified CommonJS wrapping” feature is a hacky attempt to support synchronous
require
calls by using regexes. It’s gross. 2020-10-03Executables in npm?
NPM packages can contain executables, not just Node.js modules. NPM provides features to help distribute and run these executables, such as the
bin
field in package.json
and the npm run-script
command. 2020-10-02How to publish an npm package
Publishing an npm package
@jameshfisher/numsyslib
with a stringifyRoman
function that converts a number to a Roman numeral. 2020-10-01What is npm?
NPM is Node.js’s package system, allowing installation of arbitrary stuff, not just Node.js modules. Packages are folders, tarballs, URLs, or version identifiers published to the NPM registry. 2020-09-30
How do ECMAScript modules work in Node.js?
ECMAScript modules and CommonJS modules in Node.js are interoperable. Node.js looks at file extensions and
package.json
fields to determine the module type. ECMAScript modules can only use import
, while CommonJS modules can only use require
. 2020-09-29JavaScript live bindings are just concatenation
ES modules are just concatenated source files, with some error checking and variable renaming. Live bindings are an illusion - they’re just ordinary variables at the top-level scope. 2020-09-28
What does the
require
function do in Node.js? The
require
function in Node.js loads modules, either local files or external packages. I show the algorithm that searches node_modules
directories and package.json files. 2020-09-27What are JavaScript source maps?
Source maps map generated JavaScript to original source files, allowing debugging of the original code in the browser’s dev tools. 2020-09-26
JavaScript modules for grumpy developers from 2005
JavaScript modules enable better dependency management and scoping. A guide for developers like me who still use
<script>
tags everywhere. 2020-09-25Using BodyPix segmentation in a WebGL shader
A WebGL shader that uses BodyPix segmentation to set the alpha channel. 2020-09-24
Running BodyPix on a video stream
Applying the BodyPix machine learning model to a video stream for real-time person segmentation, with separate render and segmentation loops to optimize performance. 2020-09-23
Resizable boxes in pure CSS!
The CSS
resize
property allows any element to be resized, not just <textarea>
! But there are some gotchas. 2020-09-22BlazeFace hello world
A demo that uses the BlazeFace model from TensorFlow.js to detect faces in a webcam stream, and draws the detected landmarks on the video. 2020-09-21
Step-away background removal
A step-away background removal technique using WebGL, which compares both chrominance and luminance differences between the webcam feed and a captured background image to create a transparent mask. 2020-09-20
Edge detection with Sobel filters
A WebGL fragment shader that implements the Sobel filter, a method for detecting edges in an image. A demo processes your webcam video stream. 2020-08-31
BodyPix hello world
BodyPix is a TensorFlow model for person segmentation. A demo of BodyPix in the browser. 2020-08-16
Why does my WebGL alpha-transparency look wrong?
WebGL alpha-transparency may appear wrong because of premultiplied alpha. Fix it by setting
premultipliedAlpha: false
when creating the WebGL context. 2020-08-12Production-ready green screen in the browser
A green screen implementation in the browser using WebGL and chroma key. Includes a live demo. 2020-08-11
How to implement green screen in WebGL
An green screen implementation in the browser using WebGL and a chroma key shader. Includes a demo that replaces sufficiently green pixels with magenta. 2020-08-10
How to implement green screen in the browser
A green screen implementation in the browser using WebGL and chroma key. Includes a live demo. 2020-08-09
What is the order of
NSWindow
levels? The order of
NSWindow
levels is defined by the CGWindowLevelKey
constants, with lower numerical values being behind higher ones. The NSWindow.Level
enum provides a more limited set of semantic level names, with some levels overlapping. 2020-08-03devices(for:) was deprecated in macOS 10.15: Use AVCaptureDeviceDiscoverySession instead
Use
AVCaptureDeviceDiscoverySession
instead of the deprecated AVCaptureDevice.devices(for:)
to discover video capture devices. 2020-07-31Why is the
contentRect
of my NSWindow
ignored? Calling
setFrameAutosaveName
on an NSWindow
causes its size and position to be saved to user defaults, overriding the contentRect
passed to the constructor. To avoid this, do not call setFrameAutosaveName
. 2020-07-10How to resolve “the app shows no response upon launch” in App Review
To resolve “the app shows no response upon launch” in App Review, identify and handle potential sources of fatal errors, such as uncaught exceptions, force-unwrapping nil values, unsafe downcasts, and out-of-bounds array access. Display a helpful error message instead of crashing. 2020-04-24
Time is running out to catch COVID-19
Simulation shows it’s rational to deliberately infect yourself with COVID-19 early on to get treatment, but after healthcare capacity is exceeded, it’s better to avoid infection. Includes interactive parameters and visualizations. 2020-03-14
How to record a canvas to video
Using the
MediaRecorder
API to record a canvas element as a WebM video file, allowing the user to download the recorded video. 2020-03-13Simulating epidemics in WebGPU
Simulating an epidemic in WebGPU using a direct index into an array of cells, avoiding the issues encountered with the previous WebGL implementation that used a texture. 2020-03-12
Game of Life in WebGPU
Implementing Conway’s Game of Life in WebGPU, a 2D cellular automaton simulation. Uses compute shaders to update the game state and render the cells. 2020-03-03
Rule 110 in WebGPU
A WebGPU-powered simulation of the Rule 110 cellular automaton, rendering a dynamic image on a canvas. 2020-03-02
How to write an ArrayBuffer to a canvas
I write an ArrayBuffer to a canvas by interpreting the buffer as pixel data and using ImageData to provide the dimensions. 2020-03-01
When in doubt, don’t blur it out
Blurring sensitive information in images may not effectively protect privacy, as the original content can often be recovered using deblurring techniques. 2020-02-29
Simulating epidemics with WebGL
A spatial SIR model for simulating epidemics, implemented using WebGL fragment shaders. Tracks susceptible, infected, and recovered populations in a 2D grid. 2020-02-23
Why does this RNA virus look like DNA?
RNA genomes of viruses like COVID-19 are often sequenced as complementary DNA (cDNA) for practical reasons, though the actual genome is made of RNA with uracil instead of thymine. 2020-02-16
Simulating epidemics
An interactive simulation showing how disease characteristics and human behavior can significantly impact the spread of an epidemic. 2020-02-15
Diffing coronaviruses
Comparing the genome sequences of the Wuhan coronavirus and a bat coronavirus using
diff
and NCBI BLAST reveals an 89% similarity. 2020-02-09Is there a route between these two nodes in this directed graph?
An algorithm in Haskell using a breadth-first search to find the reachable set of nodes. 2020-01-24
How to check if a binary tree is balanced
An O(n) algorithm to check if a binary tree is balanced, by passing up the height from recursive calls. 2020-01-23
How to sort a stack using one additional stack
We can model “infinite tape” using two stacks. Then we can navigate the list in both directions. This lets us bubble-sort the list in O(n^2) time. 2020-01-22
Implementing a queue using two stacks
Implement a queue using two stacks, with one stack for the back of the queue and one for the front. Reverse the back stack onto the front stack when dequeuing to maintain the queue order. 2020-01-21
Towers of Hanoi in Haskell
A Haskell solution to the classic Towers of Hanoi problem. 2020-01-20
A stack with minimum element
A stack with a
min
operation that runs in O(1) time. Store the current minimum alongside each element, or use run-length encoding to compress the stack of minimums. 2020-01-19Implementing a queue using a linked list
The head is the front of the queue, allowing efficient dequeue. The tail is the back of the list. To enqueue efficiently, we keep a reference to the tail. 2020-01-18
Implementing a stack using a linked list
The head of the list is the top of the stack. 2020-01-17
How to check whether a linked list is a palindrome
Find the middle node of the linked list using the “runner” trick. Reverse the first half, then compare the nodes pairwise from the middle outwards. Restore the list to its original state before returning. 2020-01-16
How to find the middle of a linked list
A trick to find the middle of a linked list by using two pointers,
slow
and fast
, where fast
moves twice as fast as slow
. 2020-01-15How to reverse a linked list
Reverse a linked list by treating it as a stack, popping elements and pushing them onto a new list. An implementation in C without a separate stack. 2020-01-14
How to partition a linked list
A C function to partition a linked list around a value
x
, running in optimal time and space. 2020-01-13How to delete a node from the middle of a linked list
To delete a node from the middle of a linked list, copy the value and next pointer of the next node to the current node, then free the next node. 2020-01-12
How to find kth last node of a linked list
Use the “runner” technique with two pointers - one leading by k nodes - to find the kth last element of a singly linked list without knowing the list length in advance. 2020-01-11
How to remove duplicates from an unsorted linked list
To remove duplicates from an unsorted linked list with no extra memory, use a nested loop to check each node against all others, removing duplicates as you go. Time complexity is O(n^2). 2020-01-10
How to rotate a square matrix in-place
An in-place algorithm to rotate a square matrix by 90 degrees. The key is to rotate 4 corresponding points using a formula, applying this to all points in the top-left corner. 2020-01-09
Run-length encoding in C
Compresses a string by replacing consecutive repeated characters with the character and its count. The solution requires two passes to first calculate the length of the compressed string, then generate it. 2020-01-08
How to percent-encode strings in-place
A C function to replacing spaces with
"%20"
in-place, by iterating from the end, preserving true string length. 2020-01-07Determine whether one string is a permutation of the other
A C function to determine if one string is a permutation of another, using a character distribution representation for optimal time and space complexity. 2020-01-06
How to reverse a string in C
An in-place string reversal function in C, starting by swapping the first and last characters, then iterating towards the middle. 2020-01-05
Determine if a string has all unique characters
A recursive algorithm to determine if a string has all unique characters, with an analysis of its time complexity. 2020-01-04
How does Glitch refresh my app?
Glitch’s “Show in a new window” feature uses the
window.open
API to open a new window, and then manipulates the contents of that window by updating its location
property when the source code is edited. 2020-01-01Browsing my genome
Exploring my 23andMe genome data - a text file of single nucleotide polymorphisms, not a full DNA sequence, requiring a reference genome to interpret. 2019-12-30
What are CSS percentages?
CSS percentages have varying meanings depending on the property. They can refer to the containing block’s width/height, the element’s own font size, or other specific measurements. 2019-12-29
Les Aventures De Toupac - a pixel art game
A pixel art game developed over Christmas, with code on GitHub and development on Glitch. 2019-12-28
What are CSS variables?
CSS variables, also called custom properties, allow defining and using dynamic values in CSS. They cascade and inherit like other CSS properties, with the
var()
function used to reference them. 2019-12-21What is simulated annealing?
Simulated annealing is a variation of trial-and-error optimization that generates mutations of the current best guess, and gradually reduces the magnitude of the mutations over time, similar to how metals cool. 2019-05-28
What is a McCulloch-Pitts neuron?
A mathematical model where the neuron is a function that takes binary inputs and produces a binary output based on a threshold. The model can implement basic logic gates like AND and OR, but not more complex functions like XOR. 2019-05-27
I can see your local web servers
Script detects and exposes your local web servers on
localhost
and your local network. 2019-05-26JavaScript generators are also consumers!
Generators in JavaScript can act as both producers and consumers of data. An example
Metric
generator batches and sends data using the yield
keyword. 2019-05-18What is
function*
in JavaScript? JavaScript’s
function*
defines a generator function, which can be used to generate and consume data. 2019-05-17What are symbols in JavaScript?
Symbols are a new fundamental data type in JavaScript, introduced in 2015. They are used to create unique object property keys that won’t clash with other properties. 2019-05-16
How do JavaScript iterators work?
JavaScript iterators are objects that implement a specific protocol, providing a way to iterate over a sequence of values. The
for...of
loop is syntactic sugar for manually creating and using an iterator. 2019-05-10Browser webcam hello world
Demo of the user’s webcam in a
<video>
element, using the navigator.mediaDevices.getUserMedia()
API. 2019-05-06How can I add tags to a Jekyll blog?
A plugin to create tag pages on a Jekyll blog, and a minimal layout for those tag pages. 2019-05-05
Does Redis Pub/Sub work with master-slave replication?
Redis Pub/Sub works with master-slave replication, allowing messages published on the master to be replicated to the slave and received by subscribed clients on the slave. 2019-05-04
The inception bar: a new phishing method
A new phishing technique that displays a fake URL bar in Chrome for mobile. A key innovation is the “scroll jail” that traps the user in a fake browser. 2019-04-27
Node.js addon hello world
I create a native Node.js addon called
addon
in C++ using node-gyp
. The addon exports a hello()
function. 2019-04-20Electron hello world
Installing Electron, creating an HTML web page, and writing the main entry point script to load the page. 2019-04-19
The hacker hype cycle
I got started with simple web development, but because enamored with increasingly esoteric programming concepts, leading to a “trough of hipster technologies” before returning to more productive work. 2019-03-23
Why can’t I set the font size of a visited link?
CSS visited link styles are limited for security reasons, as they could reveal a user’s browsing history. Color can be changed, but
getComputedStyle
will lie about it. 2019-03-08Project C-43: the lost origins of asymmetric crypto
Bob invents asymmetric cryptography by playing loud white noise to obscure Alice’s message, which he can cancel out but an eavesdropper cannot. This idea, published in 1944 by Walter Koenig Jr., is the forgotten origin of asymmetric crypto. 2019-02-16
How to fix ‘Activating bundler (< 2) failed’ error in your jekyll build
Jekyll build breaks due to Bundler 2 incompatibility. Fixed by removing Bundler 1 version from Gemfile.lock. 2019-01-09
How to run Redis Sentinel
Redis Sentinel provides high availability for Redis. We start a Redis master, then three Redis Sentinel instances. They discover each other, then we trigger a failover. 2019-01-08
How to make a webserver with netcat (nc)
Use
nc
(netcat) to create a web server that returns custom HTTP responses. 2018-12-31How I start Jekyll blog posts
I use a custom
blogpost
command to quickly create new blog post files with the current date and post title. 2018-12-30How to draw sprites on an HTML canvas
I demonstrate animating a cat walk cycle on an HTML canvas using a sprite sheet image and the
drawImage
method. 2018-12-29What is document.cookie?
Cookies are client-side storage that get sent with every HTTP request. A cookie is scoped to a domain suffix, a path prefix, and a time range. The API is old and weird. 2018-12-22
A history of time in 40,000 pixels
A visualization of how frequently different years are referenced in writing over time, showing patterns in how the past and future are viewed. 2018-12-18
How does a Morris approximate counter work?
The Morris approximate counter is incremented probabilistically. 2018-12-17
What is the API for Google Ngram Viewer?
The Google Ngram Viewer API is undocumented, but can be accessed by replacing the
graph
in the URL with json
. This returns a JSON response with the frequency of the searched phrase over time. 2018-11-25Strava route builder API
How to use the undocumented Strava Route Builder API to get routes between two points, including a JavaScript example. 2018-10-13
How is the Redis sorted set implemented?
Redis sorted sets are implemented using a hash table for efficient key-value lookups and a skip list for efficient score-based ordering. I show a Haskell implementation that uses a forward map for keys and a reverse map for scores. 2018-04-22
Rounding up to the next power of two in C
An efficient algorithm to round up to the next power of two in C, using bitwise operations and compiler intrinsics for constant-time performance. 2018-03-30
What is HTTP keep-alive? What is HTTP request pipelining?
HTTP keep-alive allows reusing the same TCP connection for multiple requests, avoiding the overhead of opening a new connection. HTTP request pipelining sends multiple requests without waiting for their responses. 2018-03-27
A lambda calculus interpreter in Haskell
A lambda calculus interpreter in Haskell, using de Bruijn indexing and lazy evaluation, with simple integer literals added. 2018-03-15
Hello world in Linux x86-64 assembly
An x86-64 program that writes to stdout and exits. 2018-03-10
Writing a parser in Haskell
I write a parser for JimScript, an imperative programming language, in Haskell. The parser goes through three stages: tokenization, nesting, and parsing. 2018-03-09
An interpreter in Haskell
An interpreter for an imperative language in Haskell, featuring integers, operators, global variables, control flow, and I/O primitives. 2018-03-06
Creating a UDP connection with netcat
nc
can create UDP connections. UDP connections are established when the first data packet is sent, and terminated when the server becomes unreachable. ICMP messages notify the client of an unreachable server. 2018-03-04How does network address translation work?
NAT allows multiple devices in a local network to share a single public IP address. Routers modify IP and port information in network packets, and manage a translation table. 2018-03-02
What does Linux do with a lost TCP connection?
Linux uses exponential backoff to retry dropped TCP connections, with a configurable retry limit. 2018-02-27
What are TCP sequence numbers?
TCP uses sequence numbers to map unordered IP packets to an ordered byte stream. The sequence number field is 32 bits, but wraps around to 0 after reaching the max value. The sender chooses a random “initial sequence number” during the connection handshake. 2018-02-24
Running
tcpdump
on a TCP connection tcpdump
captures network traffic. Capture and analysis of a TCP connection, including the 3-way handshake and message exchange. 2018-02-23How does swapping stdin and stderr work?
The magic shell string
3>&2 2>&1 1>&3-
swaps stdout and stderr. It does with the dup2
system call to swap file descriptors. 2018-02-22Hello world in C inline assembly
A C program that writes “hello, world!” to the console using inline assembly instead of standard library functions, demonstrating direct system call invocation. 2018-02-20
How to make a system call in C
Replacing
printf
with write
, and finally directly using the syscall
function with inline assembly. 2018-02-19How does an IP address get translated to a MAC address?
IP addresses are mapped to MAC addresses using the Address Resolution Protocol (ARP). The OS maintains an ARP cache to store these mappings. 2018-02-11
What is a subnet?
Subnets divide the IP address space hierarchically using bitstring prefixes. We check if an IP address is in a subnet using C. 2018-02-10
How does reverse DNS lookup work?
Reverse DNS lookup maps an IP address to a domain name by querying
PTR
records. The mapping is not always consistent with the forward DNS lookup. 2018-02-09How does
ping
work? ping
uses ICMP, or “Internet Control Message Protocol”, to send “echo request” packets and receive “echo reply” packets. 2018-02-07What is DHCP?
DHCP dynamically assigns IP addresses to hosts, using a client-server protocol over UDP. It involves a sequence of DORA (Discover, Offer, Request, Acknowledge) messages to obtain and configure a network lease. 2018-02-06
Don’t use
nscd
nscd
, a local DNS resolver within glibc
, is non-standard. Instead, use a local DNS server like named
or dnscache
. 2018-02-05What does
getaddrinfo
do? getaddrinfo
ostensibly does DNS lookups. Sounds simple, but it uses more than 100 system calls! Let’s trace the crazy path of address lookup on Linux. 2018-02-03What is
tcpdump
? tcpdump
captures and displays network traffic. An example inspecting DNS requests and responses. 2018-02-01How to hash multiple values
Methods for hashing multiple values, including hash-then-XOR, concat-then-hash, and serialize-then-hash. The only method that’s collision-resistant is serialize-then-hash! 2018-01-09
Making a stream cipher
A stream cipher in Go that generates an infinite keystream from a shared key using SHA-256. 2018-01-01
osquery: UNIX as a SQL database
osquery
allows querying a UNIX system using SQL. 2017-12-11How less works: the terminal’s alternative buffer
less
uses the terminal’s “alternate screen” feature to clear the screen and display the contents of a file, and then restores the previous screen when exiting. 2017-12-04An encrypted diary using OpenSSL
Generate a master keypair. Encrypting each diary entry with a one-time shared secret. Encrypt the shared secret with the public key. Decrypt entries using the private key and the shared secret. 2017-12-03
The sorry state of OpenSSL usability
OpenSSL’s inadequate documentation, confusing key formats, and deprecated interfaces make it difficult to use, despite its importance. 2017-12-02
What is ASN.1?
ASN.1 is a data format used to encode structured data like RSA private keys and certificate signing requests. Using
openssl asn1parse
to reveal its structure. 2017-11-30UNIX
free
: used
does not mean what you think it means The
used
metric in free -m
includes memory used for caching, not just application memory. The true memory usage is lower, calculated as used minus buffers/cache. 2017-11-29Diff views in GitHub-Flavored Markdown
GitHub-Flavored Markdown supports “diff views” with
+
and -
prefixes. While it loses syntax highlighting, it’s a quick and easy way to show changes. 2017-11-27DNS resolution procedure
DNS resolution is a recursive procedure involving different record types like A, CNAME, and NS. Resolving a domain name can require multiple DNS queries to different nameservers. 2017-11-25
How PHP and Composer find your code
Composer’s autoloader uses PSR-4 to map namespaces to directories, allowing you to load classes without explicit
require
statements. 2017-11-09A JavaScript Promises implementation
Implementing a Promise API in JavaScript, including handling asynchronous callbacks, promise chaining, and automatically wrapping non-promise values. 2017-11-07
How do I release a PHP Composer package?
To release a PHP Composer package, create a GitHub repo, add a
composer.json
file, submit the package to Packagist.org, and tag a stable version. Then Composer users can require your package. 2017-11-06What are promises in JavaScript?
Promises in JavaScript represent future values. They provide a way to handle asynchronous operations, allowing chaining of callbacks. Promises can be fulfilled or rejected, with callbacks handling each case. 2017-11-05
Asymmetric encryption with the Web Cryptography API
Generating ECDH keys and deriving a shared AES key. 2017-11-03
Symmetric encryption with the Web Cryptography API
Generating a key, encrypting and decrypting text, and explaining the implementation. 2017-11-02
Signing a string with HMAC using the Web Crypto API
A web page that allows you to sign a string using the HMAC algorithm with SHA-256, implemented using the Web Crypto API. 2017-10-31
Hashing a string with the Web Cryptography API
The Web Cryptography API provides low-level crypto primitives in JavaScript, including hashing strings using SHA-256. 2017-10-30
WebGL shading: both diffuse and specular
A WebGL shader that combines diffuse and specular lighting, allowing the user to adjust the relative contribution of each using keyboard controls. Guest post by Luís Fonseca. 2017-10-28
Forward secrecy with hash ratchets
A “hash ratchet” ensures that a compromise of the current key does not allow decryption of past messages. Each message’s encryption key is derived from the previous key using a hash function. 2017-10-27
The Three Ts of Time, Thought and Typing: measuring cost on the web
Businesses often tout “free” services, but the real costs come in terms of time, thought, and typing required from users. Reducing these “Three Ts” is key to improving sign-up flows and increasing conversions. 2017-10-26
Group chat with end-to-end encryption
Group chat with end-to-end encryption can use “client-side fan-out” where the sender encrypts the message separately for each recipient, or “server-side fan-out” where the sender encrypts the message once using a shared secret, then the server distributes the ciphertext to the group. 2017-10-25
Web Push API in Firefox
Differences between the Web Push API in Google Chrome and Firefox. Firefox uses the Mozilla Push Service, enabling push notifications without Google’s GCM/FCM. 2017-10-24
Giant Game of Life
Implements a 1024x1024 grid of Conway’s Game of Life using WebGL fragment shaders. 2017-10-23
Game of Life implemented with a fragment shader
A Conway’s Game of Life simulation implemented using WebGL fragment shaders, with rendering to texture and a Gosper Glider Gun initial state. 2017-10-22
Drawing a cube in WebGL
Rendering an animated 3D cube in WebGL using a vertex shader, face color uniforms, and matrix transformations for rotating the cube. 2017-10-21
Generated normal-mapped ripples
Generating dynamic normal-mapped ripple effects using WebGL, with the mouse position controlling the light source. 2017-10-20
GLSL varying variables
GLSL
varying
allows vertex shader outputs to be passed to fragment shaders. A WebGL demo with colors interpolated between vertices. 2017-10-19What is
extern
in C? extern
declares a variable without defining it, allowing the linker to find the definition elsewhere. This is useful when a variable is declared in one file but defined in another. 2017-08-27Sentence wrap
Sentence-wrap is a text-wrapping approach that inserts newlines between sentences. Diffs are easier to read, and sentences more apparent. Reminiscent of poetry. 2017-08-23
What is C
include
? #include
in C does not import functionality, but rather inserts the preprocessed text of the included file. The actual implementation of the included functions, like fprintf
, is provided through linking. 2017-08-21Does C have generics?
C’s
_Generic
is not true generics. It requires manual implementation of concrete type cases, unlike generics that automatically generate code for any type. 2017-08-19How can I do DNS lookup in Go?
Using the Go
"net"
package to look up IP addresses for a given domain name, using either the C stdlib or a pure Go DNS resolver. 2017-08-03How do I create a message digest using
openssl
? Create message digests using the
openssl dgst
command, specifying the hash algorithm (e.g. -sha512
) and optionally signing with a shared password using -hmac
. 2017-03-13How do I hash a password with
openssl
? The
openssl passwd
command hashes passwords using the outdated crypt algorithm, with truncation to 8 characters - a poor choice for secure password hashing. 2017-03-12How do I fetch a server’s SSL certificate using
openssl
? Use the
openssl s_client
command to fetch a server’s SSL certificate chain, including the root certificate. 2017-03-11How do I generate random bytes with
openssl
? Generate random bytes with
openssl rand
, which uses a PRNG seeded with entropy from ~/.rnd
. 2017-03-10Redis Pub/Sub under the hood
Examines Redis’s source code to understand how it tracks subscriptions, handles disconnections, and implements pattern subscriptions, highlighting potential pitfalls and attack vectors. 2017-03-01
Installing and running
ebe
Install
ebe
assembler with a one-liner, but be wary of the SourceForge installation script. 2017-03-01How to write a TCP server with the
pthread
API A TCP server that uses
pthread
to serve multiple clients concurrently, with an “echo” server for each connection. 2017-02-28What is UTF-8?
UTF-8 is a character encoding that can represent the entire Unicode character set. It’s variable-length, self-synchronizing, and an extension of ASCII. 2017-02-26
How to write a TCP server using the
fork
syscall A TCP server that uses the
fork
system call to create a new child process for each accepted connection, allowing it to handle multiple clients concurrently. 2017-02-25What is
mode_t
in C? mode_t
is a bitfield type in C that represents file permissions, including read, write, and execute permissions for the owner, group, and other classes. It provides symbolic constants to set and check these permissions. 2017-02-24How do I print bits in C?
A program in C that prints the individual bits of various data types, showing how they are represented in memory. 2017-02-23
What is
ssize_t
in C? ssize_t
is a signed version of size_t
, used to represent return values from system calls that may need to indicate error with -1
. 2017-02-22What is a a FIFO, or “named pipe”? What is
mkfifo
in C? A FIFO is a special file that allows inter-process communication. The
mkfifo
system call creates a FIFO, enabling processes to read from and write to it. 2017-02-21How to write an assembly ‘hello world’ on macOS
A “Hello, world!” program in x86-64 assembly for macOS, using the NASM assembler and system calls for writing to stdout and exiting. 2017-02-20
What is
lsof
? lsof
lists open system resources, including pipes, sockets, and yes, files. It shows their type, owner, and location. 2017-02-20How to generate Intel and AT&T assembly with
clang
Generate Intel and AT&T assembly with
clang
, demonstrating the difference in syntax between the two styles. 2017-02-19What are
setjmp
and longjmp
in C? setjmp
and longjmp
in C bypass normal function call and return flow, allowing a function to return to a previously saved state. setjmp
saves the current execution context, and longjmp
restores it. 2017-02-18How do I call a program in C, setting up standard pipes?
A C function to create a new process, set up its standard input/output/error pipes, and return a struct containing the process ID and pipe file descriptors. 2017-02-17
Golang’s realtime garbage collector, at The Realtime Guild
A talk given with Will Sewell. Overview of Go’s concurrent garbage collector. 2017-02-15
How do I duplicate a file descriptor in C?
Use the
dup
system call to duplicate a file descriptor in C, allowing two references to the same underlying pipe. 2017-02-15UNIX as a SQL database
UNIX represents various system components, like processes, file descriptors, and memory, using in-memory data structures that can be modeled as relational database tables. 2017-02-14
What are Lamport timestamps?
Lamport timestamps measure time and causality in distributed systems. Timestamps are assigned to events, with the property that if event A happened-before event B, then A’s timestamp is less than B’s. 2017-02-12
What is the happened-before relation?
The happened-before relation models time in distributed systems, where events at different locations may not have a total order. It defines time using causality. 2017-02-10
How do I call a program from C?
To call a program from C, use `fork` then `execve`. There is no more direct way! 2017-02-07
How do I use
fork
in C? fork
duplicates the current process. It returns 0
in the child process. In the parent process, it returns the child’s new process id. 2017-02-06How do I use
execve
in C? execve
replaces the current process with a new one. It takes a path, an argument array, and an environment array. The process never returns unless execve
fails. 2017-02-05FOSDEM: The Challenges and Secrets of the Realtime World
Realtime apps use protocols like HTTP streaming, long polling, WebSocket to enable live updates. Scaling pub/sub requires distributed servers and routing clients to the closest server. 2017-02-04
How do I generate assembly from a C file?
Compiling with the
-S
flag generates assembly. 2017-02-03How do I access environment variables in C?
Access environment variables in C by using the global
environ
variable, which points to an array of string pointers representing the environment. 2017-02-02How do I read
man
pages? The
man
command is used to access the UNIX manual pages, which are organized into numbered sections. man
searches a predefined path to find the relevant manual page. 2017-01-30In what ways can processes communicate?
Processes can communicate via files, pipes, signals, sockets, message queues, semaphores, and shared memory. 2017-01-29
How can I write a file with
mmap
in C? To write to a file, open the file,
mmap
the file descriptor, then write to memory. 2017-01-28What is
mmap
in C? mmap
is a system call in C that allows programs to manipulate underlying hardware resources, such as physical memory or files, using ordinary memory manipulation. 2017-01-26Quickly checking for a zero byte in C using bitwise operations
How to check if a 64-bit word contains a zero byte. A step-by-step example and a proof of correctness. 2017-01-24
How to subtract in binary
To subtract in binary, we use carry bits and two’s complement representation. 2017-01-24
What is the type of a constant in C?
Integers in C are
int
by default, while suffixes like L
and U
denote long
and unsigned
types. Floats are double
without a suffix. 2017-01-23What is the difference between C constants and C literals?
Literals are lvalues with addresses, while constants are rvalues without addresses. In C, only string literals are literals; other “literals” like numbers and characters are constants. 2017-01-22
What are lvalue and rvalue in C?
“lvalue” either means “expression which can be placed on the left-hand side of the assignment operator”, or means “expression which has a memory address”. “rvalue” is defined as “all other expressions”. 2017-01-21
What is the
UINT64_C
macro in C? The
UINT64_C
macro appends the ULL
suffix to a 64-bit unsigned integer literal, converting it to the appropriate type. 2017-01-20How does reliability work in
RTCDataChannel
? The
RTCDataChannel
API lets us configure the delivery guarantees, including the ordered
, maxPacketLifeTime
, and maxRetransmits
properties. 2017-01-17How to write a ‘hello world’ serverless WebRTC app
Including setting up the
RTCPeerConnection
, creating a data channel, handling ICE candidates, and generating an offer to be shared with the remote peer. The signaling channel is copy-paste! 2017-01-16How do C signals interact with the stack?
C signal handlers reuse the same call stack as normal functions, but can optionally use a special signal stack instead. 2017-01-14
What is
sigaction
in C? sigaction
says what to do when a signal is received. signal
is a simplified interface to sigaction
. 2017-01-13Doing something
n
times in C with while
and decrement Executing
do_something()
N times in C using a while
loop and post-decrement operator. 2017-01-12How do I unregister a
signal
handler in C? To unregister a
signal
handler in C, use signal(signum, SIG_DFL)
to reset the disposition to the default, or signal(signum, SIG_IGN)
to set the disposition to ignore the signal. 2017-01-11What does the C
signal
function return? signal
returns the old signal handler pointer for given signal number. 2017-01-10What are ‘signals’ in C?
Signals in C are software interrupts that allow programs to respond to events. The
signal.h
header provides functions to register signal handlers and send signals. 2017-01-09Error URLs (addressable errors)
Using unique error codes with linkable documentation improves error reporting. Provide a central error page URL with each error message. 2017-01-05
What are ‘bitfields’ in C?
Bitfields in C allow compact bit packing in structs, avoiding manual bitwise operations for greater safety and clarity, at the cost of some language complexity. 2017-01-04
What is a
union
in C? A
union
in C allows one variable to hold different data types, where the storage is shared. The size of a union
is at least the size of its largest member. Fields in a union
have the same byte offset. 2017-01-03How do I pack bits in C? (An answer using masks)
Efficient packing of game player data into 16 bits using bitwise operations on a
uint16_t
type. 2017-01-02What are ‘statement expressions’ in GCC?
GCC’s ‘statement expressions’ allow inserting statements into expression positions. Behavior is unspecified. 2016-12-30
Pointer to middle of allocation, part 1
Redis uses length-prefixed strings with pointers into the middle of the allocation, allowing C-string operations on the string data. 2016-12-28
How do I put an array in a struct in C?
C allows a single array field of incomplete type (
char []
) at the end of a struct definition. The size of the struct is determined by the size of the fixed fields, and the dynamic-sized array is allocated separately. 2016-12-27How do I measure program execution time in C? How do I use the
times
function? Use the
times()
system call in C to measure the CPU time used by a process, distinguishing between time charged to the process itself and time charged to the kernel on its behalf. 2016-12-26How to write an array literal in C (with explicit indexes)
C array literals can use explicit indexes. The array length is determined by the largest explicit index. 2016-12-25
What is
perror
in C? perror
in C prints a human-readable description of the last error that occurred, as stored in the global errno
variable. 2016-12-24How do I print bytes in C?
Useful to show how C represents various data types. 2016-12-22
How to write a ‘hello world’ HTTP server in C
A C program that creates an HTTP server that responds with “Hello, world!” to every request. 2016-12-20
What syscalls does a UDP server need?
The syscalls needed for a simple UDP echo server are
socket
, bind
, recvfrom
, sendto
, and close
. 2016-12-19How to write a TCP server with the
kqueue
API Kqueue is a more efficient alternative to
select
for managing multiple TCP connections, providing a publish-subscribe model for tracking events in the kernel. 2016-12-18What is
fdset
in C? fdset
in C is a data structure that represents a set of file descriptors. The FD_SET
, FD_CLR
, FD_ISSET
, and FD_ZERO
macros are used to manipulate and inspect these sets. 2016-12-17How to write a TCP server with the
select
syscall The
select
syscall allows a process to sleep and wake up when a file descriptor is ready for reading, writing, or has an exceptional condition. This enables a TCP server to handle multiple clients concurrently. 2016-12-16What is a “file descriptor”, really?
File descriptors should be called “resource descriptors”. They represent various system resources, not just regular files. The operations you can perform depend on the specific resource. 2016-12-15
What syscalls does a TCP server need?
A minimal TCP server in C uses the
socket
, bind
, listen
, accept
, recv
, send
, and close
syscalls to manage connections. 2016-12-14What is
errno
in C? errno
lets you access error codes from system calls. It’s a global int
. 2016-12-13What are
static
functions in C? static
functions in C are only callable within the translation unit they are defined in, not across the whole program. 2016-12-12How can I do modulo with a bitmask in C?
Use
i & (n-1)
to compute i % n
, when n
is a power of two. This avoids the modulo operation. 2016-12-10What are ‘macro functions’ in C?
Macros in C can define token replacements or function-like replacements. 2016-12-09
What is ‘array decaying’ in C?
Arrays in C can “decay” to pointers, but are not inherently pointers. The size of an array is lost during decay. 2016-12-08
What are automatic variables (dollar variables) in a
Makefile
? Automatic variables in a Makefile, like
$@
for the target and $^
for the dependencies, reduce repetition in rules. 2016-12-07What is a ‘binary-safe’ string?
C strings use null-terminated byte arrays, which cannot represent arbitrary binary data. Binary-safe strings explicitly store the length, allowing them to represent any sequence of bytes. 2016-12-06
How do I set the C compiler in a
Makefile
? Set the C compiler in
Makefile
using predefined variable $(CC)
, which defaults to cc
and can be redefined. 2016-12-05What is
FILE
in C? A
FILE
is a C data type that represents an open file. It contains metadata about the file, such as its file descriptor and buffers. 2016-12-04What does the
restrict
keyword mean in C? The
restrict
keyword in C is a type qualifier that indicates a pointer parameter points to an object not accessed through any other pointer in the function’s scope. This allows the compiler to make optimizations. 2016-12-03What does
const
mean in C? const
is a type qualifier in C that makes a variable unassignable, except during initialization. 2016-12-02Does C have booleans?
C99 introduced the
stdbool.h
header, providing bool
, true
, and false
for boolean values, building on the _Bool
type. 2016-12-01What is
realloc
in C? realloc
resizes an allocated memory block, copying contents if necessary. 2016-12-01Where is the C programming language defined?
C is defined in several places, including “The C Programming Language” by Kernighan and Ritchie, and a series of ISO C standards (C89, C99, C11). 2016-11-30
Does C allow pointer arithmetic?
Computing a pointer to unowned memory invokes undefined behavior, even without dereferencing! 2016-11-30
How do I write a multi-line string literal in C?
Use concatenated string literals with newline characters to define multi-line string literals in C. 2016-11-30
Can I put comments in string literals in C?
C string literals can contain comment-like characters, which are treated as literal text, not as comments. 2016-11-30
What do array subscripts mean in C?
C array subscripts are defined as pointer arithmetic, where
a[b]
means *(a+b)
. This means a[b]
is the same as b[a]
! 2016-11-30What is
size_t
for? How do I iterate over an object in C? size_t
is used to represent the size of objects in memory. It is commonly used for array indexing. 2016-11-29What type should I use to count objects in C?
Use
uintptr_t
to count objects in C, as it can represent the largest possible pointer value. 2016-11-29What is
static
in C? static
in C can modify variable declarations inside and outside a function body, and function parameters. 2016-11-28What does
void
mean as a function parameter in C? void
in a C function parameter list means the function takes no arguments, whereas an empty list allows for an unspecified number of arguments. 2016-11-27What is
void
in C? void
in C has multiple meanings: as a return type to indicate no return value, as a parameter type to indicate no parameters, and as a pointer type to indicate a pointer to an unknown type. 2016-11-27What is K&R style function definition in C?
The “K&R-style” function definition in C uses an initializer list to declare parameters, unlike the more common parameter type list. This old-style definition has significant semantic differences and should be avoided due to its potential for undefined behavior. 2016-11-27
A C typedef convention for complex types
A convention for expressing complex C types using
typedef
and a “reverse Polish notation” syntax to improve readability. 2016-11-24How is the stack laid out in C?
The stack layout in C includes function arguments, return address, and local variables. Addresses decrease as you go through the arguments, and the stack grows downward with each function call. 2016-11-24
How do varargs work in C?
Variadic functions in C use the
...
syntax to accept an arbitrary number of arguments. The stdarg.h
library provides va_start
, va_arg
, and va_end
to access the arguments. 2016-11-23What is an
.xcworkspace
file? An
.xcworkspace
file is a directory that contains a workspace configuration for Xcode projects. 2016-11-17What is an
.xcodeproj
file? The
.xcodeproj
“file” is actually a directory that contains a project.pbxproj
file, which is a text file that stores the settings of an Xcode project, including information about the files, build configurations, targets, and dependencies. 2016-11-17Learning vim (a short adventure)
I try Vim. I give up after discovering that the cursor cannot sit at the end of a line. 2016-11-16
How do I serialize JSON in Swift?
Serialize JSON in Swift with
JSONSerialization.data(withJSONObject:options:)
. 2016-11-16How does tricolor garbage collection work?
Golang’s garbage collector uses a “tricolor” algorithm, dividing heap objects into black, white, and grey sets. The algorithm can run concurrently with the program, and the “tricolor” invariant ensures no pointers go directly from the black set to the white set, allowing the white set to be cleared. 2016-11-11
Low latency, large working set, and GHC’s garbage collector: pick two of three
Large working sets and low latency are incompatible with GHC’s stop-the-world garbage collector, which optimizes for throughput instead of latency. The collector’s pause times scale linearly with working set size. 2016-05-12
Understanding the ELF
2015-01-26
Wikipedia needs an IDE, not a WYSIWYG editor
2014-10-25
Your first-class functions don’t make you functional
2014-10-11
Nix by example, Part 1: The Nix expression language
Nix is a functional programming language used for package management. We see the Nix expression language, including strings, primitives, operators, functions, let expressions, and conditionals. 2014-09-28
Orphaned file detection
2014-09-19
Documentation for free, or, in-wiki issue tracking
2014-09-13
A semantic wiki in Prolog
Prolog as a better alternative to “semantic triples” and SPARQL. 2014-08-24
Use a repository as your CI database
2014-08-19
Make = Puppet
2014-08-15
Documentation black holes: things we write that don’t get read
Documentation often ends up in black holes - internal documents, issue trackers, test cases, conversations, commit messages, and wikis - where it goes unread. Focus on writing documentation that people will actually read, like product names, homepages, and inline help. 2014-08-13
Does a branch identify a commit, or does a commit identify a branch?
2014-08-10
Configuration files suck
2014-07-27
Your syntax highlighter is wrong
Syntax highlighters make value judgments about code. Most highlighters judge that comments are cruft, and try to hide them. Most diff viewers judge that code deletions are bad. 2014-05-11
A proof that the Halting problem is undecidable, using JavaScript and examples
A JS function to decide the Halting Problem will always have a logical contradiction. 2013-12-24
A proposal for visual pure functional programming
A visual programming language inspired by Haskell. 2012-02-27
Normally, I hand craft my images using vim
2010-01-19
All content copyright James Fisher.