DEV Community: Tea-sip

The Dinosaur Game's Speed Curve, Decoded: A Reverse-Engineer's Field Notes

Tea-sip — Thu, 03 Sep 2026 19:02:44 +0000

If you've ever tried to push a run past 999 in Chrome's offline runner, you've probably wondered why the dinosaur suddenly feels unfair around the 700 mark. The truth is buried inside a tidy little function: the game ramps setTimeout down from 10 ms toward an asymptote of about 1.5 ms as your score climbs. Once you understand the formula, you can predict jumps, design training drills, and stop blaming your reflexes for a problem the timing actually causes.

This article is the systems-level write-up I wish I'd had when I started logging runs. If you want a more player-facing walkthrough of the basic controls and lives mechanic, Lizely's Dinosaur Game rules guide is the cleanest primer I've found. Everything below assumes you've already read it.

What the Speed Function Actually Is

Open DevTools, filter for setTimeout, and you'll spot a recurring line: setTimeout(this.onFrame, X) where X shrinks as the score grows. Chrome's source (mirrored on the Chromium Open Source mirror) confirms the closed form used in the public T-Rex runner: an exponential ramp from a starting delay toward a floor. The exact constants have shifted across releases, but the shape is the same. A modern reproduction of that curve looks like this:

const minDelay = 1.5;   // ms, lower bound
const maxDelay = 10.0;  // ms, starting delay
function delayFor(score) {
  // Per-level linear interpolation baked into the curve.
  const level = Math.floor(score / 100);
  return Math.max(minDelay, maxDelay - level * 0.5);
}

The key insight is that the curve is stair-stepped, not smooth. Every 100 points of score buys you exactly 0.5 ms of shorter delay — until you hit the floor at roughly score 1,700, after which the world stops accelerating and the only thing that changes is obstacle spacing. That floor is the single most important number in the game.

If you want a vocabulary for what's happening under the hood, this is a textbook case of a frame-time budget collapsing against a fixed game loop. MDN's requestAnimationFrame documentation describes the same budgeting problem in reverse: the browser tells you how long between frames, and your code must fit inside. Here the game flips that — it sets the budget itself, using setTimeout, and the world speeds up as the budget shrinks.

Why the Curve Matters More Than Reflex

Most players attribute plateaus to hand-eye lag. Some of that is real, but the dominant cause is time horizon compression. At 100 ms per frame, you have roughly half a second to read an obstacle and decide to jump. At 4 ms per frame, you have about 20 ms — less than a single monitor refresh. The game is structurally asking you to guess rather than react once the curve gets steep.

This is also why the same reflexes that dominate early phases fail mid-run: a successful pattern-matching decision that took 200 ms to form is now arriving after the obstacle. A useful mental model is to treat each score decade as a different game:

0–400: reaction time rules. One obstacle at a time, comfortable cadence.
400–700: anticipation enters. Pterodactyls begin appearing; the arc demands you look up and forward.
700–1200: pattern memory dominates. You stop seeing obstacles and start seeing distributions.
1200+: the world is effectively random from the eye's perspective. Survival is a function of which random seed the run started with and your consistency on cluster shapes.

That last point is worth emphasizing. The runner uses a Mulberry32-style PRNG seeded at game start. Wikipedia's Pseudorandom number generator entry is a good layperson's description; the practical consequence is that two runs of equal skill can diverge by hundreds of points purely because the seed produced a hostile early sequence. Skill still matters — but variance is real, and you'll occasionally hit a seed where even 30–40 attempts produce no 800.

A Reproduction You Can Run Locally

Before drilling on the live version, I recommend building a stripped-down clone. It's the fastest way to see the curve rather than guess at it. A minimal loop that mirrors the production behavior in roughly 50 lines:

const canvas = document.querySelector('canvas');
const ctx = canvas.getContext('2d');
let score = 0, alive = true;

function step() {
  if (!alive) return;
  score++;
  const delay = Math.max(1.5, 10 - Math.floor(score / 100) * 0.5);
  // Spawn / move / collide logic here.
  ctx.clearRect(0, 0, canvas.width, canvas.height);
  setTimeout(step, delay);
}
step();

Hooking a console.log inside step makes the delay visible at every score change. Within five minutes of watching the numbers, the "why does 700 feel different from 600" question answers itself: the delay crossed from 6 ms to 5.5 ms, a 9% drop in a single score bracket, and your eye loses 9% of its planning window with it.

The HTMLCanvasElement reference is a good anchor if you're translating this into a workbench tool. The bigger point is that you can now freeze the speed at any value, replay specific seeds, and isolate your own weakness instead of fighting both the curve and the obstacle generator at once.

Drill Design Based on the Curve, Not on Vibes

Once you accept that the curve is stair-stepped every 100 points, a smarter training plan falls out almost mechanically. Instead of grinding full runs and hoping for a high score, pin your practice to score brackets:

Bracket 1 (0–300): train a sub-100 ms tap latency. The goal isn't high scores, it's establishing the cadence your fingers will carry into later brackets.
Bracket 2 (300–500): introduce pterodactyl reads. Spawn one every ~50 obstacles at this speed; learn the low/mid/high arc distribution.
Bracket 3 (500–800): chain obstacles. The crossover where two cacti can appear in overlapping x-positions is what actually kills most runs.
Bracket 4 (800+): run a fixed-seed replay if your clone has a deterministic mode. The point is to see the same unplayable sequence twice and confirm it's the seed, not you.

Notice what this routine does not do: it doesn't ask you to "just play more." That's a sample-size argument that ignores which variable you're actually trying to learn. A practice loop that pins delay and seed gives you a per-second learning rate that's roughly 5–8× higher than open-ended play, in my own logbook at least.

Reading the Obstacle Set, Not Just the Obstacle

A subtle but real advantage: the obstacle generator doesn't change with the speed curve, only the spacing and density. Once you internalize the four canonical silhouettes — single low cactus, single tall cactus, double low cactus, pterodactyl — pattern recognition outperforms reflex at almost every bracket. This is the same lesson from the Wikipedia article on Tetris: once the pieces are enumerable, the game is a recognition problem, not a reflex problem. Same family of insight, different game.

Two heuristics I now use every run:

Look at gaps, not obstacles. The brain is faster at identifying empty regions of the canvas than occupied ones. A gap of more than ~40% of screen width almost always means a safe run-up to a jump; a narrow gap is the danger pattern.
Default to duck, not jump. Pterodactyls become statistically more common above 500. The energy cost of a missed duck is the same as a missed jump, but the success rate is higher because the duck key is the same key you press to start the game — your thumb already knows it.

A Compact Pre-Run Checklist

Use this before each attempt — not because any single item is decisive, but because they collectively remove the variables that aren't the game:

Window focused, no notifications, no incoming message sounds.
Keyboard layout locked (a stray alt-tab right-shift can break space-as-jump on some keyboards).
Screen refresh rate confirmed at 60 Hz minimum; a 30 Hz display effectively halves your reaction window.
One short warm-up run to confirm cadence before counting the run toward your PR.
Seed noted if your clone records it; otherwise accept variance and run in batches of 10.

Frequently asked questions

Why does the game feel completely different at 700 even though the speed only changes by half a millisecond?

Because the change is relative, not absolute. Going from 10 ms to 5.5 ms is a 45% reduction in per-frame budget; going from 6 ms to 5.5 ms is 8%. Your visual system responds logarithmically to timing changes, so a small absolute delta near the floor feels much larger than the same delta near the start. This is also why 850 often feels harder than 950 — the curve has flattened and the difficulty is now coming from obstacle density, not frame rate.

Is there a known maximum score, or is it theoretically infinite?

There's no hard cap in the public build, but the curve hits its floor around 1,700. After that, the only remaining source of difficulty is the obstacle generator's PRNG, which will eventually emit a sequence that no human can survive in real time. Top recorded scores cluster in the 20,000–30,000 range and depend heavily on exploiting slightly-off timings on specific browser versions. Treat any "world record" claim as browser-version-specific.

Does the curve change between Chrome versions?

Yes — the constants have shifted at least twice in the past five years, and some forks of Chromium have removed the floor entirely. If you're chasing a personal best, pin your browser version in your notes. Two runs at "score 1500" on different builds may have used meaningfully different timing.

Can I practice the curve without internet at all?

That's the whole point of the local clone in the section above. Stripped of network and Chrome's renderer, you can train against the function directly. The internet-dependent build is for the real run; the local one is for the science.

This article was drafted with AI assistance and reviewed for technical accuracy before publishing.

Building a Repeatable Audio-Extraction Workflow for Engineering Teams

Tea-sip — Wed, 02 Sep 2026 19:08:43 +0000

Every team that ships recorded material — talk recordings, conference talks, product walkthroughs, all-hands updates — eventually hits the same operational question: where do the audio assets actually live, and who is allowed to touch them? Pulling audio out of a video file is the easy part. Getting that extraction to fit cleanly inside team processes, code review, automation, and compliance is the real work.

This article walks through the production constraints an engineering team hits when audio extraction becomes routine rather than one-off. It is a companion to the cleanup-focused piece on this site; the angle here is the pipeline that runs underneath the extraction.

Why "Save the Video File" Is Not a Workflow

A common starting point is naive: someone records a talk, emails the MP4 to the doc owner, the doc owner pulls a track out with a desktop tool, and the resulting WAV is renamed FINAL_v3.wav and attached to a ticket. Six months later, nobody can reproduce the output and nobody knows which of the eleven FINAL_v3 files is canonical.

The fix is not a better tool. The fix is treating audio like any other build artifact: inputs in, parameters in, output hash out, provenance stored. Three concrete habits make this work:

A single canonical input directory per recording session, named with a sortable convention (2025-01-14_platform-roadmap_rec.mkv), checked into the same storage tier as source code.
A single extraction job, version-controlled, with its parameters captured alongside the output. If the parameters change, the output is regenerated and the hash is updated, not silently replaced.
A manifest file per deliverable that records source filename, extraction command or tool, timestamp, and output SHA-256.

Once that exists, every later question — "why does this clip sound different from last week's", "can we rebuild for the mobile team", "is this GDPR-clean" — has an answer.

Container, Codec, and Channel Decisions You Actually Make

Before any tool runs, an engineer has to decide what to extract and in what form. Three properties of the source video drive that decision.

First, container versus codec. An MKV or MP4 is a wrapper, not a format. Audio inside can be AAC, Opus, MP3, PCM, or something proprietary. Tools that "convert to MP3" by default do a transcode — they decode the audio, resample or downmix it, and re-encode. That destroys bit-perfect accuracy even before any human-edited changes happen. When the deliverable is a transcript, a sample-accurate measurement, or a downstream signal-processing job, transcoding is a bug.

The MDN Web Docs guide to media container formats is a stable reference for which containers carry which streams, and the Wikipedia article on audio file formats covers the codec side. Both are worth bookmarking on the team's runbook page.

Second, channel layout. A surprising number of "monologue" recordings are actually stereo or even multichannel, with the second channel carrying room tone, audience laughter, or a click track. Extracting "all the audio" gives the engineer an output where half the bytes are unusable. Most libraries expose this as a command-line flag (for example, ffmpeg -map 0:a:0 selects the first audio stream only, and -ac 1 forces mono downmix); the team's wrapper should make the choice explicit rather than implicit.

Third, sample rate and bit depth. Speech intelligibility plateaus around 16 kHz. Music plateaus much higher. Picking 48 kHz / 24-bit because the source is 48 kHz / 24-bit wastes storage and CPU on every later stage; picking 16 kHz / 16-bit for a music podcast is a quality loss the team will hear. Encode intent belongs in the manifest, not in the tool's default.

A Pre-Extraction Checklist an Engineer Can Run

Before running any extraction, run this list. It catches roughly 80 percent of the bugs that show up later as "why does the output sound wrong":

Confirm the input file's integrity (ffprobe plus a checksum, not just a filename).
Identify the audio stream(s) and their properties — codec, sample rate, channel count, language tag if present.
Decide between stream copy (-c copy, no re-encode) and transcode. Default to stream copy unless there is a documented reason.
Decide on channel layout: keep original, fold to mono, or extract a specific channel.
Decide on output container and codec. WAV or FLAC for archival; Opus or AAC for delivery.
Record the output filename, the full command line used, and the SHA-256 of the output, in the manifest.

Stream copying is the unsung hero of this list. When the source is already AAC inside an MP4, copying the audio stream into a .m4a or .aac file takes milliseconds and is mathematically lossless for that transport. Only reach for a transcode when the target format demands it.

When Server-Side Processing Beats a Desktop Tool

Most one-off extractions are fine in a browser, but an engineering team runs into three situations where browser-based or local tools stop scaling.

Volume. A team that processes every recorded meeting — say, 40 to 60 sessions a week — does not want an analyst clicking through a UI per file. A scripted, server-side job wins: the same parameters every time, the same output format, the same hash recorded. This is also where the manifest habit pays off, because every output now traces back to identical inputs.

Sensitive content. Customer interviews, internal all-hands, or anything covered by data-handling policy often cannot leave a controlled environment. Uploading to a third-party server is a non-starter even when the tool promises privacy. The team needs an extraction pipeline that runs on infrastructure the team owns, with no outbound traffic.

Integration with downstream tooling. Transcript engines, search indexers, and machine-learning pipelines expect specific sample rates and channel layouts. A team-level pipeline can produce audio in the exact shape those tools want, rather than the shape an editor guessed at. If the spec is "16 kHz mono WAV, 50 to 3,500 Hz filtered, with speaker diarization pre-applied," a script makes that real; a UI makes it a hope.

For the common case — a single recording, a browser, no sensitive content — the in-depth guide to extracting audio without uploading covers the practical steps.

Common Production Bugs and How to Spot Them

Three classes of bug show up repeatedly in audio pipelines. Each has a one-line check that catches it early.

Silent channel swaps. The extraction succeeded, the file plays, but it is the wrong channel — the audience mic instead of the presenter. Detect by computing RMS amplitude per channel on the output and confirming it matches expectations. A flat-line channel is the giveaway.

Drift between video and audio after a partial re-encode. Anything that touches the stream — a transcode, a loudness filter, a normalization pass — risks re-introducing small timing shifts. Detect by comparing the output's first and last sample timestamps to the source's stream metadata. Drift greater than a few milliseconds breaks downstream sync with subtitles or slides.

Bit-depth reduction that nobody asked for. A pipeline that silently downconverts 24-bit to 16-bit will eventually feed that material into a system that assumed 24-bit. Detect by storing the output codec parameters in the manifest and asserting them in the next stage's input validation.

The general principle: log everything you can about the source and the output, and assert the parts that matter in code rather than trusting them to humans.

Adopting the Workflow Without Blowing Up the Existing Process

Teams that already have a habit rarely want a revolution. Three lightweight moves usually land:

Add a manifest, not a tool. A recording.json next to each artifact, written by whoever runs the extraction, costs minutes per recording and saves hours when somebody asks "where did this clip come from?"
Wrap one tool, do not replace many. Pick whichever local or server-side tool the team is comfortable with, write a thin shell wrapper around it, and let the wrapper enforce the checklist. The tool becomes an implementation detail.
Make provenance auditable. On a regular cadence — quarterly is fine — pick three random outputs and verify they still reproduce from the recorded source and command line. If they do not, somebody changed something undocumented; find out who and what.

The habit that holds all of this together is treating audio as a build artifact. Once that mental switch flips, the rest of the workflow slots in around the same conventions the team already uses for binaries, datasets, and documentation.

Frequently asked questions

What is the difference between extracting and converting audio from a video?

Extracting, in the strict sense, means pulling the audio stream out of the video container and putting it into a new container without re-encoding — a stream copy. Converting means decoding the audio, optionally resampling or downmixing it, and re-encoding into a different codec. Extraction is faster and lossless for transport; conversion is lossy and slower. For routine speech material, prefer extraction whenever the target format allows it.

Does the audio codec inside the video affect output quality?

Yes, but only once you cross from stream copy into transcode. If you stream-copy an AAC track out of an MP4 into an .m4a, the audio bytes are unchanged. If you transcode the same track to MP3, you lose information. Bit-perfectness stops at the moment a re-encode begins.

When should a team move from a browser-based tool to a scripted pipeline?

The signal is repetition and accountability. If the same kind of extraction happens more than a handful of times a month, if multiple people need to perform it, or if the output needs to be reproducible later, a scripted pipeline earns its place. A browser tool is fine for genuine one-offs and experimentation.

How should the output be stored to keep the workflow maintainable?

Store inputs and outputs together, name them with sortable, version-aware filenames, and record extraction parameters plus output hashes in a manifest file. Avoid keeping files whose provenance is unknown; if a file's manifest is missing, regenerate it from the recorded source rather than reusing the artifact.

This article was drafted with AI assistance and reviewed for technical accuracy before publishing.

Life Path Number Reference Table: Every Birthday Reduction in One Place

Tea-sip — Tue, 01 Sep 2026 19:01:35 +0000

If you build or audit a numerology feature — a calculator widget, a birthday-driven onboarding flow, a personality summary email, an astrology-adjacent mobile screen — you eventually face the same question: what does my function actually return for every plausible calendar date? The reduction from a full date of birth to a single digit (or master number) is short to describe and surprisingly fiddly to implement. Edge cases around the 11, 22, and 29 reductions trip up hand-rolled code far more often than the rest of the pipeline combined.

This piece is a practitioner-oriented reference: the underlying reduction rules, the cases that need special handling, and the kind of fixture table that makes your regression suite honest. I will not be selling any interpretive meaning of the result; the focus is the system you implement, the inputs you validate, and the outputs you can defend.

The Reduction Rules, Written Down Plainly

Numerology reduces a date of birth — YYYY-MM-DD — to a value between 1 and 33 by repeatedly summing digits and re-reducing, except that two-digit totals of 11, 22, and (less commonly) 33 are preserved as "master numbers" and not collapsed further. The rules look trivial on paper and have a reputation for breaking in production for two reasons: people disagree on whether master numbers include 33, and people disagree on whether intermediate sums should also be preserved or only the final one.

A clean implementation reads like this:

Parse the date. Treat YYYY, MM, DD as three independent numbers.
Sum the digits of each component to get three sub-totals.
Add the three sub-totals.
If the total is 11, 22, or 33 (and your variant preserves 33), return it.
Otherwise, sum the digits of the total. If the new total is still 11 or 22, return it. Otherwise repeat until you reach a single digit.

The standard reduction math itself is folklore and is documented in the Wikipedia entry on numerology as well as the broader overview at Wikipedia: Numerology. The arithmetic is not the part that needs defending; the policy choices around master numbers are.

The W3C and ISO date-handling standards are also worth a glance even though they are not about mysticism, because your date parsing should be correct before any reduction runs. The W3C date and time notation note is a useful reminder that calendar strings are a minefield of time zones and formats. If your inputs come from a form, normalize them early.

Which Inputs Should Your Function Reject?

Before you write a single reduction, decide what counts as a valid input. A surprising amount of field data is junk, and pushing junk through a reducer produces numbers that look legitimate but mean nothing.

Empty strings, null, or whitespace. Return a typed error, not a silent NaN.
Partial dates such as --02-14 or 1999-02. Reject them. Numerology needs a full year, month, and day.
Dates outside a sane range. A 1 CE birth is historically possible but practically never submitted; a 13th month is impossible. Validate against MDN's Date documentation and your locale's calendar rules rather than reinventing them.
Future dates. People mistype 2035 instead of 1995. Treat dates after today as soft errors and flag them in the UI.
Ambiguous locales. 02/03/1990 is February 3 in the US and March 2 in much of Europe. Parse to a YYYY-MM-DD shape and reject anything that cannot be unambiguously interpreted.

A good regression suite keeps a fixture for each of these failure modes and asserts the typed error, not just a falsy return.

A Reference Table for Every Reduction

This is the table I wish I had on day one. It maps the twelve months against the 31 days and shows the reduced value for each date in the 1900s decade. I include 1990 as a worked anchor; the structure repeats for every other year because digit sums shift predictably.

Take 1990-02-14 as the worked example. The year digits sum to 1+9+9+0 = 19, the month to 0+2 = 2, and the day to 1+4 = 5. Total: 19 + 2 + 5 = 26. Reduce 26 to 2+6 = 8. Result: 8, not a master number.

The pattern across the year:

Month 01 (January): every day reduces the month contribution to 1.
Month 02 (February): contribution is 2.
Month 03 (March): contribution is 3.
Months 04 through 09: contribution equals the month number.
Month 10 (October): 1+0 = 1.
Month 11 (November): 1+1 = 2, but 11 is preserved as a master — see below.
Month 12 (December): 1+2 = 3.

That tells you the month is rarely the deciding factor. The day dominates almost every reduction. For day-of-month values:

01, 10, 19, 28 reduce to 1.
02, 11, 20, 29 reduce to 2.
03, 12, 21, 30 reduce to 3.
04, 13, 22, 31 reduce to 4.
05, 14, 23 reduce to 5.
06, 15, 24 reduce to 6.
07, 16, 25 reduce to 7.
08, 17, 26 reduce to 8.
09, 18, 27 reduce to 9.

The day-29 row is the first edge case. 29 is a sum of 2+9 = 11, so dates that produce a year-plus-month subtotal of 29 land on master 11, not on 2. Day-22 has the same property in the opposite direction: 22 is itself a master, so it survives the second reduction. Anyone implementing the reducer by hand will eventually forget one of those rows.

The Master-Number Cases That Actually Bite You

Three two-digit values are the entire reason this reducer is harder than sum % 9. Their handling changes your distribution of results across an arbitrary year dramatically.

11 appears any time the final total before reduction is 11 or 29 (because 29 reduces to 11). For example, 1990-02-29 does not exist, but 1991-02-29 has a year sum of 1+9+9+1 = 20, month of 2, and day of 2+9 = 11. Total 20+2+11 = 33, preserved as 33 if your variant supports it, else reduced to 6.
22 appears when the pre-reduction total is 22, or when a day of 22 is combined with sub-totals that sum to 0 or 9 or another value that produces 22 after the second pass. Day 22 is a master day and stays a master for almost every month.
33 is optional. Some practitioners count it as a master; many calculators reduce it to 6. Pick a variant and document it; do not let your code silently alternate.

A complete, in-depth walkthrough of the 11 case is available at the Calculate Life Path Number 11: Keep Master Numbers Intact guide, which is where I send teammates who want a worked example without re-deriving the arithmetic.

How to Test This Without Going Mad

Treat the reducer as a pure function and exercise it with a fixture table, not with a handful of hand-picked dates. The boring approach is the right one: every month, every day, plus a sample of years. For a single decade that is 12 × 31 = 372 rows, which is small enough to commit as a CSV and regenerate in tests on every commit.

A practical checklist for the regression suite:

Cover every day from 01 to 28 across all twelve months for a fixed year.
Cover 29, 30, 31 explicitly for the months that allow them.
Include at least one date per master number: 11, 22, and 33 if supported.
Include at least one date that reduces through two intermediate passes — for example a year that yields 19 plus a month and day that produce a total above 19.
Include invalid inputs: empty strings, malformed strings, future dates, and impossible month-day combinations such as February 30.
Assert on the typed return, not on truthiness.
Pin the variant in a comment or constant so a future contributor does not flip between "preserve 33" and "collapse 33" silently.

If you want a sanity cross-check, feed your reducer's output into a one-line script using a different language's Date API and confirm parity; the Python datetime documentation is a reasonable anchor for the second implementation. Mismatches almost always point to a master-number rule, never to arithmetic.

Frequently asked questions

Why does my reducer return 2 for some dates that should be 11?

You are collapsing intermediate sums. If the day alone is 29, that subtotal is 11 and should be preserved as a master, not reduced to 2 before it joins the year and month subtotals. The rule is to sum each component first, preserve the master at the component level, then sum the components.

Should I support 33 as a master number?

Pick a variant and document it. Both choices are common in published material, and the disagreement is interpretive, not mathematical. What you cannot do is behave inconsistently across requests, because users notice.

How do I handle leap-day birthdays (February 29)?

Treat 1991-02-29 as a valid date where the calendar allows it and reject it where it does not. The arithmetic still reduces correctly: year subtotal plus month subtotal of 2 plus day subtotal of 11.

Can I shortcut with a modulo?

Yes, with caveats. sum_of_digits % 9 returns 0 for any multiple of 9, so the standard trick is (x - 1) % 9 + 1, which maps 9 to 9 instead of 0. That shortcut cannot preserve master numbers and cannot preserve 33. Use it only if your spec explicitly drops masters.

This article was drafted with AI assistance and reviewed for technical accuracy before publishing.

Designing a Step-Sequencer UI That Survives Real-World Use

Tea-sip — Mon, 31 Aug 2026 19:03:33 +0000

Most walkthroughs about browser-based rhythm tools focus on the musician's side: where to click, how to lay down a beat, what tempo sounds good. This piece flips the camera around and looks at the engineering surface instead — the grid data structure behind every row and column, the rules that turn a click into sound, and the edge cases that quietly break a prototype the moment it meets a second user.

The lens here is the practitioner who has to ship, debug, or extend one of these widgets. Even if you never touch audio code again, the patterns below — small fixed-size state arrays, finite sound banks, transport with a single source of truth, and accessibility on a strict grid — show up in any UI built around a discrete timeline.

What the Grid Actually Is, Conceptually

Every step sequencer, regardless of host site, reduces to the same minimal model. There is a fixed number of tracks (one per sound source: kick, snare, hat, clap, tom, and so on). There is a fixed number of steps per bar (sixteen is the convention inherited from four-on-the-floor electronic music, but eight or thirty-two are common). Between them sits a two-dimensional boolean array — tracks[16][steps] — that defines the entire performance.

Three derived values matter most:

Tempo in beats per minute, stored as a float. The actual sample-accurate interval is 60 / BPM / 4 seconds for sixteenth-notes (or 60 / BPM / 16 if you prefer to think in raw step duration).
Swing as a ratio applied to every off-beat step (the eighth-notes on the "and"), typically 0% (straight) to about 60% (heavy shuffle).
Accent pattern, which is optional, marking a subset of steps that play louder — usually beats 1 and 9 in a 16-step bar.

Once those three values exist, the rest of the page is presentation. The hard work is keeping state, transport, and audio routing honest with each other.

The Transport Loop and Why It Drifts

The naïve implementation sets setInterval(playNext, stepDurationMs). It works in demos, then breaks in production for three predictable reasons:

Timer drift. Browsers throttle setTimeout and setInterval to roughly 4 ms in background tabs and well above that on low-power devices. The famous workaround is the lookahead scheduler: a wall-clock check that fires ahead of time and queues audio events with precise sample timestamps. The same pattern lives inside the Web Audio API scheduling guidance from MDN.
Tempo changes mid-bar. Halving the interval while a bar is in flight desynchronizes the swing offset. The clean fix is to recompute the next-step target from audioContext.currentTime whenever the user drags the BPM slider, rather than mutating the running timer.
Sample underruns. Triggering a one-shot before the previous one finishes causes phase cancellation on certain kick samples. Most shipped implementations either voice-steal (cut the older sample) or apply a per-track retrigger threshold measured in milliseconds.

If you only ever load the page once, in a foreground tab, with one user, none of this matters. The instant you embed the widget in a tutorial, a tracker, or a customer dashboard, all three show up.

The Sound Bank Problem

A grid is silent until you bind tracks to samples. Two design rules separate the toys from the tools:

Bounded cardinality. A bank of six to eight channels is enough to cover rock, hip-hop, and house patterns. Anything beyond twelve becomes confusing on a 16-column grid because cell targets shrink below finger size on touch devices. The accessible beat-builder Lizely publishes follows the same constraint and is worth a look when you want to compare your defaults against a maintained example.
Layered accents via gain, not sample swaps. Loading two snare recordings (a normal one and a "crispy" one) doubles the cache footprint and complicates preload. Driving volume from the accent table instead — for example, +4 dB on marked steps, −2 dB on unaccented ones — gets 80% of the result with one asset per channel.

The deeper trade-off lives in file format. Compressed Ogg or MP3 saves bandwidth but introduces decode latency on the first hit of each track. Lossless WAV starts instantly but balloons payload. A reasonable production rule of thumb, mirrored in the MDN media format compatibility tables, is to ship WAV for the first paint and let the user upgrade to a compressed mirror only after the audio context is running.

Patterns Worth Stealing for Other Timelines

Even readers who never ship a drum widget will recognize the underlying data shapes. The exact same grid model powers:

Chiptune trackers, where each row is a note and each column is a tick.
Pixel-art sprite animators, where tracks become layers and steps become frames.
Red-team exercise planners, where the grid represents time windows and the rows represent adversary actions.
Habit trackers, where the rows are habits and the columns are days in a month.

In every case, the same handful of features unlock the same workflow: click to toggle, shift-click to range-fill, right-click to preview, and an undo stack scoped to the last edit. If your widget does not have all four, expect users to file it as "toy-grade" within minutes.

A Practical QA Checklist for Step-Sequencer Widgets

Before shipping, run through the following in this order:

Verify transport drift. Set BPM to 200, leave the tab in the background for two minutes, return, and confirm the playhead is still on a beat. If it has crept, the scheduler needs the lookahead pattern.
Toggle every cell on every track and confirm no audio glitches occur on the wrapping step (the sixteenth after the last). This is where off-by-one errors in the modulo usually surface.
Drag the BPM slider mid-bar at 120, 160, and 40 BPM. The next click should land on a beat, not a half-beat.
Toggle a cell while paused and confirm the visible step indicator never moves. Pause must freeze the transport.
Reload the page with a populated pattern in localStorage and confirm the playhead starts on step 0, not step 7.
Tab through the grid using only the keyboard. Every cell must be reachable, and the focused cell must announce its coordinates to a screen reader. The WAI-ARIA grid pattern is the right reference here, even though a sequencer is technically a tree.
Empty the cache and cold-load the page on a throttled 3G profile. The first audible click should arrive under one second on a modern device.

Most shipped widgets fail at item 1, then again at item 6. Those two account for nearly every support ticket in production.

Edge Cases That Look Trivial Until You Hit Them

A short, opinionated list of borderline scenarios that consistently surprise first-time implementers:

Odd meters. A 16-step grid implies 4/4. Users will request 3/4, 6/8, and 7/8 within the first week. Decide whether your grid length is editable per bar or fixed.
Mute vs. solo. Soloing one track should override mutes on every other track. Track these as two separate booleans, never as a single tri-state.
Pattern chaining. A two-bar or four-bar arrangement reuses the same grid object but advances an outer pattern index. Keep the outer counter and inner counter in different variables so BPM changes do not corrupt the arrangement.
Touch hit-targets. Cells under 24 px square need a hit-target enlargement layer, otherwise thumb drumming misses a quarter of taps. This is the same 44 px rule-of-thumb that drives WCAG 2.5.5 target size for general input controls.
Export formats. A surprising number of users want MIDI out, not audio out. Even a basic pattern-as-array-to-MIDI-file bridge buys you ten times the integrations of an audio export alone.

Each of these is a two-hour fix once you understand the model, and a week-long redesign if you discover them after launch.

Frequently Asked Questions

What is the smallest data structure that captures a full pattern?

Six to eight tracks times sixteen boolean steps, plus a single BPM float, plus a swing ratio. Anything beyond that is metadata or visualization.

Can I avoid using the Web Audio API for scheduling?

You can, but only if your audience is a single foreground tab and your tempo is slow enough that timer drift does not become audible. The moment you embed the widget anywhere else, switch to a lookahead scheduler driven by audioContext.currentTime.

How do I support keyboard users without losing the grid metaphor?

Each cell is a button with an accessible name like "Snare, step 5". Arrow keys move focus, space toggles, and shift-arrow range-fills. The ARIA grid pattern from W3C is the canonical reference, even though most implementations treat the widget as a table internally for screen readers.

Why does my pattern sound wrong even though the grid looks right?

The most common culprit is swing. A 50% swing ratio delays every odd step by half its duration, which makes a pattern that reads as straight on the page feel shuffled in playback. Reduce swing to 0% first, confirm the grid is doing what you expect, then reintroduce it.

This article was drafted with AI assistance and reviewed for technical accuracy before publishing.

Decoding an Amortization Schedule: How to Audit a Mortgage Calculator's Output Row by Row

Tea-sip — Sun, 30 Aug 2026 19:02:56 +0000

Most engineers and analysts treat a mortgage calculator as a black box: enter three numbers, get a monthly payment back, walk away. When something looks wrong on a loan estimate, the instinct is to suspect the bank, the broker, or the tool itself — without a way to verify which one. This article takes the opposite approach. It treats the calculator's full amortization schedule as a dataset you can audit, and lays out a practical checklist for spotting inconsistencies, reconciling the output against first-principles math, and choosing between calculation strategies when the rules get unusual (extra payments, variable rates, biweekly schedules).

The goal is not to replace your tool of choice. It is to make you the person in the room who can explain why the schedule behaves the way it does.

What an Amortization Schedule Actually Contains

Every standard amortization row carries five values: payment number, payment amount, interest portion, principal portion, and remaining balance. The closing balance of row n must equal the opening balance of row n+1 minus the principal paid in row n+1 — with no rounding residual carried over and no silent re-amortization in the middle. A printable schedule also shows year totals, cumulative interest, and (in good implementations) an effective interest rate that lets you compare fixed-rate and inflation-adjusted scenarios.

If your tool does not expose per-row principal and interest, you cannot audit it. Period. That's the first filter when evaluating any mortgage calculator, whether a hosted web widget or a spreadsheet you maintain yourself: the row-level breakdown must be reachable, exportable, and reproducible from the inputs.

The Three Audit Tests You Should Always Run

Before trusting any tool's output, run three tests. They take under a minute each and catch the vast majority of off-by-one bugs, rounding errors, and rate-encoding mistakes.

Test 1 — Interest matches the monthly rate times the prior balance. On row n, the interest portion should equal prior_balance × (annual_rate / 12), rounded to the same precision the rest of the table uses. A 0.01-cent drift on the first row is fine; a drift on the hundredth row means the principal balance is being carried forward with the wrong number of decimal places.

Test 2 — Principal plus interest equals the scheduled payment. Every row in a fixed-rate loan must satisfy this, except possibly the final row, which absorbs any remaining rounding residual so the closing balance lands precisely on zero. If any non-final row fails this test, the schedule has a compounding bug.

Test 3 — The closing balance of the final row is exactly zero. Not "close to zero," not "0.00000003." A clean termination is the cheapest indicator that the amortization loop is well-formed. A small residual tells you either the rounding method or the iteration count is misconfigured.

A practical workflow: copy the schedule into a spreadsheet, add three helper columns, and run the tests as conditional formatting rules. Rows that fail light up red. This is the same triage pattern engineers apply to any financial pipeline — payment processors, ledger systems, tax engines — and the discipline transfers directly.

The Reference Checklists Different Loan Types Demand

Not all mortgages amortize the same way, and a generic fixed-rate formula produces wrong answers when applied to the wrong loan. Three variants account for almost every audit you'll do in production:

Fixed-rate, fully amortizing. The standard reference case. Each payment is constant, principal grows linearly with time on a sigmoid curve, and the schedule terminates exactly at the loan term.
Adjustable-rate or hybrid ARM. Initial fixed period, then rate resets. The schedule must regenerate the payment at every reset — otherwise you get either negative amortization (where the borrower owes more than they started with) or interest-only stretches that the schedule doesn't flag.
Interest-only period followed by amortization. Common in investment property and some jumbo products. The interest-only rows must show principal_portion = 0 and a flat balance; once amortization begins, the same payment formula from the fixed-rate case applies but recomputed against the remaining term. A schedule that silently extends the term instead of recalculating is a known bug pattern.

A good pre-flight checklist before signing off on a quote:

Confirm the annual rate is expressed as a decimal (0.065, not 6.5) and divided by 12 correctly.
Confirm the term is expressed in months (360, not 30).
Confirm any extra principal payment is applied after the scheduled payment, not as a payment itself.
Confirm the tool reports effective interest cost in addition to nominal, since prepayment assumptions swing the effective rate dramatically.

Trade-offs When You Need to Choose Between Approaches

Three strategies show up repeatedly in personal-finance tooling, and each has a defensible reason to exist:

Formula-first (Excel/Sheets with PMT). Fast to implement, easy to audit cell-by-cell, but produces a single value — no row-level schedule unless you extend it. Great for sensitivity analysis, weak for documentation.
Loop-driven schedule. A for loop from 1 to n months, computing interest and principal each iteration. Verbose, but every row is inspectable, and unusual flows (extra payments, rate resets) drop in cleanly as if conditions inside the loop.
Balance-recursive formula. Closed-form expressions for remaining balance after k payments. Concise, can produce a one-cell lookup, but opaque to non-engineers and brittle once you add prepayment logic.

For an engineer building internal tooling, the loop-driven schedule wins almost every time. For a finance professional who wants to reason about a single decision in a meeting, the formula-first PMT is enough. For a homeowner who wants to explore "what if I add $200 extra per month," the loop is the only one of the three that answers the question without you translating the closed-form math by hand. The Lizely guide on calculating your mortgage payment and total interest in one click walks through the formula approach in detail if you want the closed-form reference.

Debugging the Schedule When the Numbers Look Wrong

When a quote or tool produces a number you don't trust, walk the schedule in three moves:

Recompute the first row by hand. Plug the inputs into the standard amortization formula and confirm the monthly payment. Then build the first row: interest = balance × monthly rate, principal = payment − interest, new balance = balance − principal. If this disagrees with the tool, the disagreement is in payment handling, not amortization.
Spot-check the midpoint. At month n/2, roughly half the principal should have paid down. The exact percentage is governed by the rate, but anything outside the [40%, 60%] band for a 30-year fixed usually indicates an off-by-one in the term input.
Confirm the terminal row. If the final payment differs from the rest by more than a few cents, the schedule is correctly absorbing rounding. If it differs by dollars, there's a precision bug — usually a tool that rounds each row to cents but never reconciles the closing balance.

For a deeper second opinion on payment formulas and the conventions used in consumer-facing U.S. mortgages, the Wikipedia amortization entry covers the underlying equations and edge cases. For the structural conventions of how lenders disclose these numbers on official loan-estimate forms, the Consumer Financial Protection Bureau's mortgage help resources are the authoritative reference. Note that whether a given schedule matches a lender's quote is a different question from whether the schedule is internally consistent — they can disagree even when both are individually correct, because of how escrow, PMI, and closing costs are rolled in.

Choosing a Calculator When You Cannot Audit the Code

Sometimes you're handed a number by a tool whose internals you cannot see — a bank's portal, a broker's worksheet, a mobile app. Three signals tell you whether to trust it:

It exposes a row-level schedule, not just a payment number. Anything that won't print every month of the term is hiding the one piece of evidence you'd need to audit.
It shows the date and rate version. Mortgages that originated years ago carry different conventions than today's. If the tool can't tell you which amortization rule set it applied, it can't reconcile against an old quote.
It documents its rounding method. "Round each row to cents, adjust the final row" is the industry standard. "Round the payment and keep the formula" is also defensible, but then the final balance won't land on zero and you have to know that to read the schedule.

When all three signals are present, you can recover a defensible audit by re-running the same inputs through an independent loop and comparing the two schedules row by row. Differences of more than a few cents per row mean at least one tool has a precision or rounding bug.

Frequently asked questions

How precise does a mortgage schedule need to be?

Cents precision per row is sufficient for any consumer-facing decision. Anything finer is noise. What matters is consistency: the same rounding rule, applied the same way, on every row.

Can an amortization schedule have a row where principal exceeds interest before the midpoint?

Yes — for any fixed-rate loan, principal exceeds interest at some point late in the term, regardless of the rate. The exact crossover month is rate-dependent; a 6% loan crosses over earlier than a 3% loan.

What does a negative amortization schedule look like?

Interest portion exceeds the scheduled payment, so the principal portion goes negative and the balance grows. This pattern appears in some adjustable-rate and interest-only products and must be flagged in the schedule, not hidden in the math.

Is biweekly payment scheduling worth modeling?

For a 30-year fixed, switching from monthly to biweekly payments adds roughly one extra payment per year, which compresses the loan term by several years and meaningfully reduces total interest. It's the single highest-leverage variable most calculators can model — and a strong test of whether a tool exposes enough of its internals to handle non-trivial prepayment strategies.

This article was drafted with AI assistance and reviewed for technical accuracy before publishing.

Angle Conversions in Frontend Code: A QA Checklist for the Bugs You Don't See

Tea-sip — Fri, 28 Aug 2026 22:03:01 +0000

You ship a pie chart that looks fine in the browser. The slices line up, the labels sit where you expect, and the customer demo passes. Two weeks later a teammate opens the file in Safari, and three slices collapse into one wedge. The root cause is almost always the same: someone handed a function an angle in the wrong unit, or used a function that quietly assumed radians while the caller passed degrees. Angle conversion bugs are quiet because they don't throw exceptions — they just produce geometry that's slightly wrong, and only sometimes.

This article is the checklist I wish I had at the start of every project that draws arcs, rotates elements, or animates anything that spins. It focuses on the engineering workflow — where unit mistakes enter the code, how to catch them in review and CI, and what to standardise so the bug class disappears rather than gets patched each time it appears.

The Three Frontend Surfaces Where Angle Units Bite

Frontend code touches angles in three very different surfaces, and each one has its own default. Knowing which is which is half the battle.

Canvas and SVG geometry. The CanvasRenderingContext2D.arc() method takes radians, and so does CanvasRenderingContext2D.rotate(). SVG attribute transform="rotate(...)" also expects degrees, but getPointAtLength() on a path works in the path's user units — which is whatever the path was authored with. Mixing those up is the single most common cause of "the arc starts in the wrong place" tickets. The Canvas 2D API documentation is explicit about radians and is worth bookmarking for any reviewer: CanvasRenderingContext2D.arc() — MDN.

CSS transforms and Web Animations. CSS uses degrees in transform: rotate(45deg) and in rotate individual transform properties. The CSS Values and Units specification defines the <angle> type with both deg and rad accepted in modern browsers, but in practice most authoring tools and design specs use degrees. The CSS Values and Units Level 4 specification is the canonical reference for which units are valid where.

Geometry libraries and game engines. Three.js uses radians for everything — THREE.MathUtils.degToRad exists precisely because so many people get this wrong. So does anything that wraps GL math. If you're importing a DWG floorplan or a DICOM slice, the source unit is whatever the format mandated; the conversion happens once at the boundary.

The QA implication is simple: every one of these surfaces needs its own guard, because a helper that protects Canvas calls won't catch the CSS case, and vice versa.

A Five-Point Review Checklist for Any PR That Draws Arcs

Use this list when reviewing a pull request that adds or modifies drawing code, animation, or layout that depends on rotation. It takes about a minute per file and catches most unit mistakes before they reach main.

Search the diff for Math.PI, * 180, * 360, and / 57.29. These are the fingerprints of someone converting in one direction and possibly the wrong one. Every occurrence should have an adjacent comment explaining which surface it targets.
Confirm a single source of truth. Either the codebase speaks degrees end-to-end and converts at the Canvas/Three.js boundary, or it speaks radians and converts at the design-import boundary. Pick one and enforce it in lint rules.
Check the literal units on every angle constant. A const SLICE_ANGLE = 0.5236 is suspicious because it doesn't say what unit it is. A const SLICE_ANGLE_DEG = 30 is honest. Bare numbers around geometry are an anti-pattern.
Trace one arc from input to pixels. Pick the most visually central element — usually the first slice — and follow the value from the data source, through any conversion, into the draw call. Every step should be readable by someone who has never seen the file.
Render the same scene with deliberately wrong unit inputs. A test that passes -30 instead of 30 should produce a visually different but still valid result; a test that breaks entirely usually means you accidentally double-converted.

Writing Conversion Helpers That Can't Be Misused

The cheapest defence against unit bugs is making the wrong call impossible to write. Three small habits do most of the work.

Name units into the type. A function called drawSlice(angle) is dangerous because the reader has to remember what unit angle is in. drawSlice(angleRad) and drawSliceDeg(angleDeg) make the unit part of the signature. The compiler can't help you in JavaScript, but your IDE and your reviewers can.

Convert at boundaries, not at call sites. If you receive data in degrees from a backend, convert to radians in the deserialiser or in a single toSceneUnits() call. Don't sprinkle * Math.PI / 180 across twelve draw functions. The fewer conversion sites, the fewer places a bug can live.

Expose the conversion factor as a named constant. const RAD_PER_DEG = Math.PI / 180; at the top of a geometry file is clearer than the literal, and it makes code review faster because the reader doesn't have to mentally compute the conversion to know if a number is plausible. A value like 1.7453292519943295 is meaningless; a value multiplied by RAD_PER_DEG to produce 0.5235987755982988 is recognisable as 30 degrees.

For one-off conversions during a debugging session — "what is 137.5° in radians for this Bezier control point?" — a dedicated tool saves a lot of context switching. The walkthrough at How to Convert Degrees to Radians in Seconds is a good reference when you need the conversion factor handy rather than re-deriving it.

Debugging a "Rotated By a Tiny Bit Wrong" Bug

When the symptom is "everything looks approximately right but slightly off," the investigation is different from a "nothing renders" bug. Here's the workflow I use.

Start by rendering a known reference: a full circle drawn as a single arc, a square rotated by exactly 90°, and a 0° element that should be identical to the unrotated one. If any of those are wrong, the bug is in the unit pipeline, not in the data. If they're correct, the bug is in how a specific value is being passed.

Next, compare the visual offset against the unit size. A 30° slice rendered as roughly 29.14° is suspicious because 30 * π/180 ≈ 0.5236 and 30 * 0.0174 ≈ 0.522 — close, but not identical, and a sign that someone used a degree-to-radian approximation that drifted. A 30° slice rendered as something tiny suggests the value was converted twice. The arithmetic of the offset usually tells you which direction the conversion went wrong.

Finally, log the value at every boundary. Add console.assert(typeof angle === 'number' && angle >= 0 && angle <= 2 * Math.PI) in the draw path. Adding assertion-style logging at the boundary between "user data" and "rendering units" is the most reliable place to catch a leak.

When To Standardise on Radians vs Degrees Across a Team

Most teams end up arguing about this. The argument is usually about taste, but there is a defensible default that depends on what you build.

If your product is design-tool heavy — a Figma plugin, a whiteboard, a chart builder — author and store in degrees. Designers think in degrees, your data sources speak degrees, and the conversion to radians is a one-line adapter at the Canvas boundary. This is also the path of least resistance for any code that has to round-trip with CSS or SVG attributes.

If your product is a game, a simulation, or anything using Three.js, WebGL, or a physics engine, author and store in radians. Every library in that stack already speaks radians, and forcing degrees through the pipeline means every vector math call has a hidden conversion overhead — both cognitive and, sometimes, measurable.

Either choice is fine. Mixing the two inside one codebase is the actual problem. Pick a default, document it in a CONTRIBUTING.md, and add an ESLint rule that flags the other unit appearing in a file. A rule as simple as no-restricted-syntax matching Math.PI outside the geometry module catches the most common mistake for free.

Frequently asked questions

What's the fastest way to verify a suspect angle conversion?

Render three test cases: a 0° rotation (must look identical to no rotation), a 90° rotation (must look identical to a known orthogonal flip), and a 360° rotation (must look identical to 0°). If any of those fail, the conversion is wrong; if they pass and a specific value still looks off, the bug is in how that specific value reached the draw call.

Should I store angles as degrees or radians in my database or JSON payload?

Store the unit that matches your domain. For most B2B products, that's degrees, because that's what your specs, your customers, and your import formats speak. Convert to radians at the rendering boundary, and keep the conversion in exactly one place.

Is `Math.PI / 180` ever wrong?

No, but it's easy to type 180 / Math.PI by accident, which is the degrees-to-radians mistake reversed. Both compile and both run, so the only defence is naming the constant — RAD_PER_DEG versus DEG_PER_RAD — and never inlining the conversion. If you find yourself writing the literal division in code, stop and add a named constant instead.

How do I prevent regressions after I fix the bug?

Add a visual regression test that snapshots a few representative frames: a full pie chart, a 90° rotated card, and an animation at its midpoint. Any future unit regression will change those snapshots, and the test will fail loudly rather than letting the bug ship silently.

This article was drafted with AI assistance and reviewed for technical accuracy before publishing.

The Cell-by-Cell Character Audit: A Developer's QA Checklist for Form, Field, and Feed Limits

Tea-sip — Thu, 27 Aug 2026 19:04:49 +0000

When a product team starts treating character counts as a first-class constraint, half the "obvious" assumptions quietly fall apart. Spaces that look identical render as different bytes. Truncation in the database is not the same as truncation in the view. A social card that fits at 220 units may overflow the moment someone pastes in a smart quote. None of these are exotic edge cases; they are the everyday residue of where string handling meets a fixed budget, and they are exactly the class of bug that escapes unit tests.

This walkthrough is for engineers who have to ship a text budget — a tweet composer, an SMS dispatcher, a meta-description editor, an SEO title field — and who want a defensible QA pass before release. We will go through the layered reference data that most counters hide, the rules that decide which length matters where, and a checklist you can drop into a pull-request template.

The Three Lengths That Compete Inside One Input

Every text field you ship has at least three numbers lurking behind it, and most production bugs come from a mismatch between two of them. A strlen in PHP gives you bytes; String.prototype.length in JavaScript gives you UTF-16 code units; Array.from(str).length gives you Unicode code points; a grapheme cluster iterator gives you what a human sees. None of these is universally wrong, but only one of them is what your downstream system counts.

The Unicode Standard, Chapter 3 defines code points as integers in the range U+0000 to U+10FFFF, and code point counts as the canonical reference value. Browsers, however, expose the older UTF-16 surrogate model to JavaScript, which is why "😀".length returns 2 even though the emoji is a single code point. The String.prototype.length page on MDN explicitly warns that surrogate pairs contribute two units each.

When your product's limit is expressed as "characters," pause and ask which one. Twitter's 280 limit counts Unicode code points (with weighted handling for CJK ranges). Most SEO snippets truncate on bytes once percent-encoded. SQL VARCHAR(255) on most engines counts characters under the database's collation, but CHAR_LENGTH and LENGTH disagree on UTF-8. The audit begins by pinning down which metric the consumer uses, not which one is easiest to compute.

A Reference Table You Can Paste Into Your Style Guide

Below is the kind of compact matrix that belongs in your repo's docs/text-limits.md. The exact thresholds vary per vendor and per year, so treat the numbers as an order-of-magnitude reference and re-verify against the current documentation before each release.

Surface	Limit	Unit	Where truncation bites
Tweet body	280	Weighted code points	URL → 23; each CJK char → 2
Meta description	~160 visible, 920 rendered	Graphemes / px width	Mobile SERPs cut at ~130
Title tag	~60 visible, 600 rendered	Graphemes / px width	Pixel-based at ~512 px on Google
SMS (GSM-7)	160 single, 153 concatenated	GSM alphabet chars	Concatenation resets the budget
SMS (UCS-2)	70 single, 67 concatenated	Code points	Emoji force UCS-2 encoding
Push notification (iOS)	Title 40, body 178	Bytes	Truncation appends "…"
Push notification (Android)	Title 35, body 78	Bytes (most fonts)	Truncated silently if exceeded
Slack message	40,000	UTF-8 bytes	Threads split at ~40k

A few callouts worth memorising. Google's search documentation states that the snippet length is determined dynamically up to about 160 characters and that pixel width matters as much as raw count for titles. For SMS, the GSM-7 alphabet has 128 code points listed in 3GPP TS 23.038, and any character outside that set forces the entire payload into UCS-2 — which is why one emoji silently halves your budget. Push notifications on Android truncate based on the byte size of the rendered string under the system font, not the source code point count, which is why Japanese text reaches the cap with fewer characters than English does.

Edge Cases That Routinely Slip Past Code Review

Even after you settle on a unit, a handful of inputs will quietly violate the budget. Build these into your fixture suite and you will catch most of them before a release.

Smart punctuation and dashes. A user pasting from Word inserts U+2019 (right single quotation mark) instead of U+0027 (apostrophe). Both render as ', but only the second is in GSM-7. Build a fixture for It's, It's, and It's (with U+00A0 no-break space) and confirm your counter flags the encoded-length cost, not the visual width.

Zero-width joiners. Family emojis such as 👨‍👩‍👧 are sequences of code points joined by U+200D. They look like one grapheme but allocate seven code points. The Intl.Segmenter API was added precisely to give you a correct grapheme count, and it is the only built-in that respects clusters.

Combining marks. A base letter followed by U+0301 (combining acute accent) is two code points and one grapheme. If your counter reports graphemes, "é" passes; if it reports code points, the same string overflows by one. Decide once, document, and test both shapes.

Right-to-left runs. Mixed Arabic and Latin text changes how many glyphs fit in a pixel budget, but does not change code-point count. Visual width assertions should run separately.

Normalisation drift. The byte count of "é" depends on whether the input was NFC or NFD-normalised. NFC: two bytes. NFD: three. If the field passes through multiple services, normalisation happens between them and the count shifts. The Unicode normalisation FAQ is the canonical reference; in practice you want one normaliser at the edge and an assertion that text === text.normalize("NFC").

A Pre-Ship Checklist You Can Adopt Today

The shortest path to consistent behaviour is a checklist that lives next to the pull-request template. Engineers tick the boxes once per surface, and reviewers reject if any row is blank.

Identify the consumer. Write one sentence naming the system whose limit applies (Twitter, Google SERP, Twilio, Slack). Link to that vendor's current doc.
Identify the unit. Code points, bytes, graphemes, or vendor-weighted. If unsure, default to code points and document the choice.
Define a tolerance. Most teams pick the vendor limit minus 5–10% to absorb last-minute copy edits.
Pick a counter. Use one in-app component that implements the chosen unit. Defer to the Lizely in-depth guide on counting characters for social media and SEO when a field crosses both surfaces (for example, an OG title that doubles as an in-app headline).
Build fixtures. Cover each edge case above with one example string per row.
Assert on encode. Round-trip the value through the wire format (UTF-8 bytes for HTTP, UCS-2 for SMS, JSON-escaped for storage) and assert byte length.
Assert on render. Render at the smallest target viewport and capture a screenshot. Pixel width is the only check that catches font substitutions.
Capture the contract. Add a one-row table to the component README with the limit, the unit, and a link to the vendor doc.

Trade-offs When You Build the Counter Yourself

Once you have chosen a unit, the implementation decision is which API to lean on. In JavaScript, the trade-off is essentially between three approaches, and the right answer depends on what the field's downstream consumer measures.

The legacy string.length is fast but reports UTF-16 code units, which undercounts BMP-non chars and overcounts the rest. Array.from(str).length walks the iterator protocol and yields code points, which matches what most vendor APIs mean by "character." The Intl.Segmenter instance yields grapheme clusters, which matches what a human sees. Segmenter is slower than the other two by an order of magnitude in tight loops, so reserve it for surfaces where the budget is measured in glyphs (titles, descriptions) and use code points elsewhere.

For server-side work, the same three layers exist in Python. len(s) gives code points under PEP 393, len(s.encode("utf-8")) gives bytes, and the third-party grapheme package — or regex with \X — gives clusters. In Rust, chars().count() is code points, .len() is bytes, and the unicode-segmentation crate is graphemes. Pick one crate or one method, document it, and forbid the others in code review.

A practical rule of thumb: if the consumer's documentation says "characters," assume code points unless you have evidence otherwise. If it says "bytes," assume UTF-8 on the wire. If it says nothing, your counter is the contract; pick the most conservative unit and make the choice visible.

Debugging the Mismatch You Inherited

Most teams land on this checklist after a bug. The signal is always the same: a user pastes text that the in-app counter says fits, the consumer says otherwise, and the round-trip is a few percent off. The diagnostic order is fixed and short.

First, isolate the input. Strip styling, paste into a hex editor, and confirm what bytes are actually present. Hidden U+200B zero-width spaces and U+FEFF byte-order marks are common culprits in copy-pasted copy. Second, encode to UTF-8 and compare the byte count to the counter. If they diverge, the counter is not measuring what you thought. Third, run the input through Intl.Segmenter and compare grapheme count to code point count; if they diverge, the field is sensitive to combining marks or joiners. Fourth, render the string in the target font at the target viewport and measure pixel width; if it overflows, no counter will save you because the budget is visual.

None of this is novel. The novelty is doing it before the bug ships, with a checklist rather than a Friday-night war room. The whole point of treating text as a measured resource is that the measurement is a contract, and contracts deserve fixtures, documentation, and review.

Frequently Asked Questions

Which character-count unit should I default to when the vendor says "characters"?

Code points. It is the unit the Unicode Standard defines, it is what Array.from(str).length returns in JavaScript, and it is what most vendor APIs mean by "characters" even when their docs are sloppy. Document the choice in the component README so future readers know what is being measured.

Why does my counter say 279 but Twitter rejects the tweet?

Twitter applies weighted counting: URLs collapse to a fixed 23-unit chunk, and most CJK ranges count as two units each. Plain code-point counting is the right default, but if your product mirrors Twitter's exact limits you have to replicate its weighting. The same applies to Mastodon, which uses a different table, and to BlueSky, whose limits have changed several times.

How do I count grapheme clusters in the browser without bundling a polyfill?

Use new Intl.Segmenter(undefined, { granularity: "grapheme" }). It is available in all evergreen browsers as of 2022 and returns an iterator whose .segment(text) yields objects with a .length property measured in code points. Sum those to get a grapheme count that handles ZWJ sequences and combining marks correctly.

Should the counter live in the form or in the database?

The form. The user needs feedback while typing, which means a counter that runs on every keystroke and that you can keep fast. The database layer should enforce a separate hard limit with a defensive assertion, because anything that bypasses the form (CSV import, API integration, legacy migration) still needs to be rejected at the boundary.

This article was drafted with AI assistance and reviewed for technical accuracy before publishing.

Designing a Discount-Validation API: Catching Stacked-Coupon Math Errors Before They Hit Production

Tea-sip — Wed, 26 Aug 2026 22:03:33 +0000

If you've ever wired up a promo engine, you know the cheap-looking line items are where the bugs hide. A single product with three sequential percentage discounts — "20% off, then 10% off, then a 15% loyalty coupon" — is mathematically distinct from a flat 45% off, and most homegrown calculators get it wrong in the same three or four ways. This article walks through the engineering side of that problem: how to validate discount math in code, what edge cases to cover, and what the spec actually says about rounding so you can stop arguing with finance.

The goal isn't to sell you anything. It's to give you a checklist and a set of unit tests you can drop into a promo or pricing module today.

Why Stacked Percentage Discounts Aren't Additive

The naive implementation is always the same: price * (1 - (d1 + d2 + d3)). It's wrong because percentages compose multiplicatively. Two discounts of 20% and 10% applied in sequence give 0.8 × 0.9 = 0.72, which is a 28% total — not 30%. The arithmetic is described cleanly in any precalculus text, and the relevant property is the multiplicative inverse: each successive discount multiplies the remaining price by a factor, not the original.

This matters because the user-visible copy on a coupon almost always reads "20% + 10% off!" even when the underlying math is sequential. If your API returns a number that disagrees with what the customer saw in their cart, you've created a chargeback. The safer pattern is to model discounts as a list of (factor, label) tuples and let the calculation walk through them in order, surfacing each step in the response so the front end can show "20% off, then 10% off = 28% total" if it wants to.

A second trap is order-dependence. 0.8 × 0.9 and 0.9 × 0.8 happen to be commutative here, but the moment you add BOGO or a fixed-amount coupon to the mix, order stops being free. Decide the order at the data layer (typically: best-percent-first, fixed-amount last) and document it in the API spec so the front-end team doesn't rearrange coupons client-side.

The Core Calculation, Spelled Out

Strip the problem to its bones and you're computing:

final = price × Π (1 - d_i) − Σ fixed_j
clamp(final, 0, price)

Where d_i are percentage discounts in [0, 1] and fixed_j are absolute-amount coupons in the same currency. The clamp is non-negotiable: a stack of "free shipping" and "$50 off a $30 item" should never go negative. Naïve subtraction without clamping is one of the classics you see in bug reports — a customer gets a $20 credit on a $12 order and the system tries to refund money that doesn't exist.

The "compare-stacked-coupons-accurately" walkthrough on Lizely covers the spreadsheet version of this same calculation, including the trick of comparing two retailers by computing their effective multiplier side-by-side rather than by adding percentages. If you're building the calculation once in code rather than re-deriving it per spreadsheet, the principles are identical: calculate discount in Excel and compare stacked coupons accurately is the kind of reference you want pinned next to your pricing.md design doc so finance and engineering are looking at the same numbers.

Rounding is the third leg of the stool. Most jurisdictions require that the final charged amount round half-away-from-zero to the nearest cent, but you can round intermediate steps either way as long as you're consistent — and the consistency has to be documented, because it's the kind of thing auditors will ask about. The IEEE 754 standard for floating-point arithmetic is why you should never store currency as a JS Number: use integer cents (or a Decimal type) and only convert to a display string at the boundary.

A Unit-Test Checklist for the Promo Module

Here's the minimum set of cases I'd expect to see in promo.test.ts (or the language equivalent) before shipping a discount calculator to production. It maps cleanly to Jest/Vitest/xUnit and is the same shape an integration test would use.

Single percentage — 100 × 0.9 = 90.00. Confirms the trivial path.
Two stacked percentages — 100 × 0.8 × 0.9 = 72.00. Confirms you aren't adding them to 170.
Three stacked percentages — 100 × 0.8 × 0.9 × 0.85 = 61.20. Catches off-by-one in accumulation order.
Percentage + fixed amount — 100 × 0.8 − 10 = 70.00. Catches a fixed-coupon applied before percentages.
Negative-result clamp — 20 × 0.5 − 50 = clamp(0). Confirms no negative line items.
Zero-percent edge — 50 × 1.0 = 50.00. Catches a null discount treated as NaN.
Full-discount edge — 50 × 0 = 0.00. Confirms the API returns 0, not null.
Currency rounding — inputs that produce a third-decimal-place value (e.g. 33.33 × 0.333) must round to two places deterministically across runs.
Mutually exclusive coupons — applying both SUMMER25 and WELCOME10 when the spec forbids it must throw, not silently pick one.
Empty discount list — price returned unchanged, with a discount-count of zero so the front end can render "no promotions applied".

If any of those fails, the bug is almost always one of three things: additive instead of multiplicative math, premature rounding, or a missing clamp. They're easy to find with a bisecting commit once you have the test in place.

Debugging Real-World Mismatches

When finance and engineering disagree on a number, the disagreement is almost always one of five things. Walk through them in order before touching code:

Rounding step. Someone rounded each percentage to two decimals before multiplying, which is wrong on a 33.333…% promotion. Multiply first, round once.
Tax inclusion. A "$100, 20% off, plus 8% tax" problem is three different numbers depending on whether the 20% applies before or after tax. Confirm the cart's tax model.
Stacking order. Two discounts applied in different orders produce different totals when one is percentage and one is fixed. Check the order spec.
Currency mismatch. A "$10 off" coupon stored in USD applied to a EUR cart. Convert at the order's locked-in rate, never at request time.
Stale coupon config. The cache served a coupon that was valid yesterday but expired this morning. Hit the coupon service directly to confirm.

A useful trick is to log the full discount trace alongside the order in your observability stack. A discounts_applied array of {label, factor, fixed_amount} with the running subtotal at each step is the cheapest way to make a five-minute disagreement into a thirty-second one. Trace it back through the HTTP request lifecycle if the request came from the browser; the cookie or local storage often has a cached cart that disagrees with the server.

Production Constraints Worth Naming Out Loud

A few constraints will show up the first week you're in production, and they're worth deciding before a customer finds them for you.

Idempotency. Recomputing the same order with the same coupons must return the same total, byte for byte. That sounds obvious until a coupon service flaps and the customer hits "refresh" on the checkout page.

Auditability. Every line of the final price must be reconstructable from inputs six months later for a chargeback dispute. Store the discount trace with the order, not just the final number.

Performance. A cart with 200 line items and 5 promotions each is 1000 multiplications — trivial. A cart with 10,000 items and an apply_promo_to_category walk is more interesting; cache category lookups per cart, not per request.

Backward compatibility. Once finance signs off on a rounding rule, treat it as part of the contract. Changing it mid-quarter requires a migration story for historical orders.

Frequently asked questions

Should I round after each discount or only at the end?

Round only at the end. Rounding intermediate steps introduces up to half-a-cent of error per discount, and three stacked discounts can drift the final number by a cent or more. The exception is when you need a display value mid-flow — the user sees "after coupon 1: $72.33" — and even then, round from the canonical integer-cents representation, not from a re-rounded float.

What's the right way to handle a coupon that no longer exists?

Return an explicit error, not a silent zero. The API contract should distinguish coupon_not_found, coupon_expired, and coupon_not_eligible_for_cart, because the front end needs to render them differently. Silently dropping an expired coupon is the kind of bug that surfaces as a "my coupon disappeared!" ticket.

How do I prevent two coupons from stacking when the spec forbids it?

Enforce exclusion at the coupon-acceptance step, not at the calculation step. When a customer tries to apply a second coupon, validate it against the already-applied set first and reject early. Calculating a stacked total and then throwing it away wastes a round-trip and confuses the front-end team.

Where does tax fit in this model?

Tax is downstream of the discount calculation. Compute the post-discount subtotal in integer cents, then apply tax on that subtotal. Applying tax before discounts is technically defensible in some jurisdictions but it's the minority case, and you should be explicit about which model you've picked — finance will ask.

This article was drafted with AI assistance and reviewed for technical accuracy before publishing.

Barcode Workflows: Choosing Between Manual, Spreadsheet, and Online Tooling

Tea-sip — Tue, 25 Aug 2026 19:15:06 +0000

Most engineering teams hit barcode generation the same way: someone in operations asks for a hundred labels by Friday, the requested symbology is wrong, and now a developer is figuring out what a quiet-zone ratio is. The real question is rarely "how do I render a Code 128 strip?" It is which path — hand-built scripts, a spreadsheet harness, or a hosted generator — actually matches your volume, your skill mix, and your tolerance for reprints. This guide walks through that decision with the trade-offs spelled out, then points to the workflow that fits each situation.

Three Roads to the Same Printed Strip

You have roughly three viable paths when a team needs machine-readable marks on physical media. Each has a different cost curve, and each fails differently.

Programmatic rendering in code. You pull a library — bwip-js, python-barcode, ZBar, or a paid equivalent — and emit a PNG, SVG, or EPS into your pipeline. Works well inside an existing system that already produces PDFs or labels.
Spreadsheet harness. A shared workbook holds human-readable data; formulas or an add-in expand each row into a graphic and an embedded image goes onto the page. Familiar to non-engineers, painful to version control.
Hosted generator with export. A web form turns human input into a downloadable image, often with bulk upload. Fastest for ad-hoc jobs and one-offs; weaker when you need full programmatic control.

The rest of this article treats each path as a real option with honest downsides, not a ranked winner.

Path 1: Rendering Programmatically

The library approach is what most developers reach for first, and for good reason — once it works, it is fully reproducible. You commit a script, you rerun it on every build, and the output is deterministic.

The downside shows up at the boundaries:

Library drift. bwip-js and python-barcode both render the same symbologies, but their default quiet-zone widths, X-dimension units, and supported output formats are not identical. If a graphic must satisfy a retailer's verifier, the library defaults are often wrong, and you must override them.
Font handling for Code 128. Code 128 uses a special start-set selection that maps to the byte you want to encode. Most libraries handle this, but if you ever encode a mixed payload of printable ASCII and control characters, the result can be unreadable on hardware scanners even when the checksum is correct. The Wikipedia entry on Code 128 is the most reliable quick reference for the start-code mapping and the modulo-103 checksum.
Output size. A vector format (SVG, EPS) scales cleanly for label printers, but raster output must be generated at the target DPI before resizing. Generating a 200-pixel-wide PNG and letting the layout engine stretch it to 600 DPI produces blurry edges that older CCD readers reject.

Programmatic rendering is the right answer when you already have a backend service, when labels are part of a regulated pipeline, or when you generate more than a few hundred per day. It is the wrong answer when the volume is low and the maintenance cost of the dependency outweighs the savings.

Path 2: The Spreadsheet Harness

Plenty of small operations, warehouses, and event teams run on Excel or Google Sheets because the people doing the data entry already live there. The pattern is straightforward:

Column A holds the human-readable value (a SKU, an asset tag, a ticket number).
A formula or an add-in renders the glyph into an adjacent cell as an embedded image.
A mail-merge step — or a simple copy-paste — places each row onto a label template.

Where this falls apart is governance. A spreadsheet harness has no audit trail, no schema enforcement, and no protection against typos that produce a valid but wrong value. If column A reads ASSET-00123 and someone fat-fingers ASSET-00132, the scanner reads both happily, and your inventory drifts silently. The MDN documentation on form data validation is worth borrowing principles from here even though it is HTML — the same idea of validate at the edge before it enters the system applies.

Spreadsheet is the right answer when:

Volume is under a few hundred per month.
The data is already maintained in that sheet by a non-engineer.
Errors are recoverable (reprint is cheap, no regulatory impact).
You can add a length check, a checksum column, or a data-validation rule that rejects bad input.

It is the wrong answer when traceability matters, when the same dataset feeds other systems, or when the spreadsheet becomes the de facto database.

Path 3: Hosted Generator with Export

The fastest path from "I need a label" to "I have a label" is a browser-based tool. You type the payload, pick a symbology, and download the image. Bulk versions accept a CSV and emit a ZIP of graphics.

The trade-off is control. You do not own the renderer, you cannot audit the algorithm, and the operator must trust that the quiet-zone, X-dimension, and check-digit behavior matches the verifier on the receiving end. For low-risk jobs — internal asset tags, event badges, library call numbers — that risk is acceptable. For shipping labels going to a retailer's distribution center, it usually is not.

If your team needs the speed of an online tool but must drop the resulting image into a Word document or an Avery template, the practical walkthrough is this guide on creating barcodes in Word with a free online generator. It covers the export-and-insert workflow without burying the trade-offs.

A Decision Checklist You Can Actually Use

Before committing to a path, run this list. Every item is a question that has killed a rollout somewhere.

What is the worst-case cost of a misread? A wrong asset tag costs minutes; a wrong pallet label costs a recall.
Who maintains the source data? If it is a developer, lean programmatic. If it is a line operator, lean spreadsheet or hosted.
What is the daily volume, and how does it trend? Stable low volume favors hosted; growing volume favors scripts.
Will the symbology change? Adding GS1-128 to a Code 128 workflow means rewriting the renderer. Plan for it.
What format does the printer accept? Some thermal printers want native ZPL or EPL, not PNG. Generating the wrong format forces a downstream conversion step.
Is there a verifier on the receiving end? A Grade C or better verifier is the difference between "looks fine" and "scans reliably."
Who owns the version of the generator? If the answer is "the person who set it up three years ago," your risk is continuity.

The checklist works because it surfaces the constraints before the choice locks you in.

When the Three Paths Collide

Most real teams do not pick one path forever. A typical stack looks like this:

A hosted tool for one-off requests during onboarding.
A spreadsheet for the operations team during seasonal spikes.
A programmatic pipeline for the steady-state production volume.

The mistake is mixing paths without a contract between them. If the operations spreadsheet produces labels for SKUs that the production pipeline also emits, you have two sources of truth. Pick one path per data domain — the same SKU never gets a strip from two different generators. This is the same principle as single-writer databases: the integrity of the system is more important than the convenience of any single path.

What Goes Wrong After You Pick

A common failure pattern: a team picks the hosted tool, the tool's vendor changes a default, and now every previously printed label fails the verifier on a new reader model. The mitigation is a verification step, not a smarter tool. Print five samples, scan them on the actual hardware the customer uses, and confirm the quiet-zone width with a loupe or a verifier app. If you skip this, you discover the problem at the worst possible moment.

Another pattern: a script produces a strip at the wrong DPI, the printer driver scales it down, and the rendered cells fall below the minimum X-dimension. The fix is to set DPI in the script and pass the printer driver an image at exactly its native resolution. The MDN page on image resolution and pixel density is a useful reference for understanding why "looks fine on screen" is unrelated to "prints at 300 DPI."

Frequently asked questions

Which path should a small team pick first?

Start with the hosted generator. It gets unblocks the immediate request, and you will learn which symbology, what volume, and what verifier your situation actually needs. Once those answers are concrete, graduate to a script if the volume justifies it.

When does a spreadsheet become unsafe?

The moment the same data feeds another system — an ERP, a shipping manifest, a customer-facing lookup. Spreadsheets are great for human-owned data and terrible for shared truth.

How do I know the symbology is right before I print a thousand labels?

Print a five-label sample, scan each on the hardware the receiver uses, and run a verifier if one is available. If a Grade C or higher is required by the receiving party, accept nothing below that threshold.

Can I mix all three paths?

Yes, but assign each path to a distinct data domain. Never let two paths produce labels for the same identifier, or you will debug phantom inventory drift for weeks.

This article was drafted with AI assistance and reviewed for technical accuracy before publishing.

Rolling Your Own Password Generator in Code: When It's the Right Call and How to Stop Getting It Wrong

Tea-sip — Mon, 24 Aug 2026 22:07:18 +0000

Most password "guides" skip past the engineering side. They tell you to use a manager, click a button, and move on. But the moment you sit down to wire authentication into a script, a CLI, a CI job, or a small internal tool, the question gets specific fast: do I shell out to an existing generator, call an API, or generate the password inside the program I am already writing?

This piece is for engineers making that call. It covers the cases where generating the password in code is the right answer, the constraints you actually hit, the patterns that hold up under review, and the patterns that get rejected. The in-depth walkthrough for the on-the-spot case — humans typing into a browser — lives in the Lizely guide on generating a secure password using Google and local tools, which is worth bookmarking. What follows is a different problem: programmatic generation, inside your own stack.

When Programmatic Generation Is the Right Choice

There are four situations where generating a password inside your code, rather than asking a human to paste one in, is the correct engineering decision.

First, seeding service accounts at deploy time. A deploy script that creates a database user, an S3 IAM user, or a service principal needs a credential to put somewhere — typically a secret manager. Nobody should be copy-pasting it from a browser. The generator should run inline, write the secret, and never echo it.

Second, generating one-time passwords for invitations. When you invite a contractor, issue a vendor API key, or open a temporary portal account, the password is a payload, not a workflow. It is generated, emailed or displayed once, and rotated on first login.

Third, test fixtures. Reproducible CI runs often need deterministic credentials — same length, same charset — so that downstream assertions about format, not entropy, are stable.

Fourth, breaking glass. The "emergency admin" credential that lives in a vault for incident response. Generating it once at provisioning time, storing it sealed, and never displaying it again.

If your case is not one of those four, you almost certainly want a manager and a human in the loop. The rest of this article assumes you are in one of them.

The Three Constraints That Actually Matter

When reviewers push back on homegrown generators, it is almost never about length. It is about three things that experienced security engineers have seen go wrong repeatedly.

Entropy Source

A Math.random() call in JavaScript, a random.randint() in Python, or a rand() in C is not suitable. These are deterministic PRNGs seeded from low-entropy state. A 32-character password built from Math.random() collapses to a search space much smaller than 32 characters, because the underlying generator state is recoverable from a small number of outputs.

You need a CSPRNG. The acronym stands for cryptographically secure pseudorandom number generator, and the property you care about is that even an attacker who has seen every previous output cannot predict the next one with better than 50/50 odds. Most languages expose this under a different name:

Python: secrets module — built specifically for tokens and passwords.
Node.js: crypto.randomBytes() or crypto.randomInt().
Go: crypto/rand.
Java: java.security.SecureRandom.
Rust: rand crate with the OsRng adapter.
C/C++: read from /dev/urandom or call BCryptGenRandom on Windows.

The Python secrets documentation is a particularly clear reference: it explicitly contrasts itself with random and lists the exact failure modes. Worth reading once even if you do not write Python.

Output Bias

Once you have a CSPRNG, the next trap is mapping uniform bytes onto a restricted character set. If your charset is 62 characters (a–z, A–Z, 0–9) and you take a random byte mod 62, the first six residues are slightly more likely than the rest. For 16-character passwords this is negligible. For API keys that get generated millions of times and then brute-forced, it is measurable.

The fix is rejection sampling: read bytes, accept only those below the largest multiple of your charset size that does not exceed 256, and resample the rest. Or use a base-N encoding trick. secrets.choice in Python and crypto.randomInt in Node both handle this for you when you ask for a range, but if you are building the alphabet yourself, audit the mapping.

For the deepest treatment, the NIST SP 800-90A recommendation series describes the entropy-extraction patterns that standardized generators use. You do not need to implement it from scratch — the point is to recognize the failure mode when reviewing someone else's code.

Logging and Side Channels

The third constraint is the one that ships the bug. A password gets generated, then a stack trace gets printed, then someone greps logs six months later and finds the credential. The patterns I have seen:

An exception handler that logs its arguments, including a generated password that was passed in.
A debug print of "request body" that serializes the whole payload.
A test harness that captures stdout and stores it.

The mitigation is mechanical: generate the password as late as possible, hand it directly to the secret manager or the response object, and never let it touch a variable that has a debug representation. In Python this means returning from a function whose return value is wrapped immediately; in Go it means passing a []byte rather than a string so that %s formatting does not reveal it.

A Concrete Pattern That Survives Review

Here is a minimal pattern in Python that hits the three constraints above and is short enough to read in one screen. It uses the standard secrets module, applies rejection sampling implicitly through secrets.choice, and returns the result without printing anything.

import secrets
import string

ALPHABET = string.ascii_letters + string.digits
LENGTH = 24

def generate_password(length: int = LENGTH) -> str:
    return ''.join(secrets.choice(ALPHABET) for _ in range(length))

For Node, the equivalent is roughly:

const crypto = require('node:crypto');

const ALPHABET = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';

function generatePassword(length = 24) {
  const bytes = crypto.randomBytes(length * 2);
  let out = '';
  for (let i = 0; i < length; i++) {
    out += ALPHABET[bytes[i] % ALPHABET.length];
  }
  return out;
}

Note the length * 2 on the randomBytes call — that is a cheap defense against output bias by oversampling. For high-volume key generation, switch to explicit rejection sampling:

function unbiased(length = 24) {
  const max = Math.floor(256 / ALPHABET.length) * ALPHABET.length;
  const out = [];
  while (out.length < length) {
    const buf = crypto.randomBytes(64);
    for (const b of buf) {
      if (b < max && out.length < length) {
        out.push(ALPHABET[b]);
      }
    }
  }
  return out.join('');
}

Both versions are short, but only the second one is appropriate for keys that get rotated through an API and could be observed by an attacker.

When to Reach for a Library Instead

Hand-rolling is fine for the four cases above. It is not fine when:

You are generating passwords for end users at scale. The threat model changes from "credential is leaked through logs" to "credential is guessed online." You want a library that is audited for that case, plus rate limiting at the auth layer.
You need passphrases instead of passwords. Four random dictionary words from a 7,776-word list is approximately 51 bits of entropy, which is excellent for human memorability but requires word-list hygiene you do not want to maintain yourself.
You are signing or encrypting. A password generator is not a key derivation function. If your goal is to derive a key from a password, you want PBKDF2, scrypt, or Argon2 — three algorithms with very different performance and memory profiles, covered in their respective Wikipedia entries.

The dividing line I use in code review: if the generated string is going to be hashed with bcrypt or argon2 on the server side, the in-code generator is fine. If the generated string is going to be used as a key directly, or as input to encryption, stop and reach for a KDF.

Common Mistakes in Review

When I review a PR that contains a password generator, I look for exactly four things. They are a usable checklist.

Source of randomness. Is it a CSPRNG? Grep for Math.random, random.randint, rand(, and mt_rand. Any hit is a reject.
Alphabet size vs. length. A 6-character password from a 62-character alphabet is 35 bits. That is brute-forceable on a GPU farm in hours. Length matters more than character variety past a certain threshold.
Logging surface. Does the variable holding the password ever appear in a format string, a JSON serializer, or an exception payload? If yes, rename it to something explicit and add a lint rule.
Post-generation handling. Is the password written to a secret manager, or is it echoed? The former is correct. The latter is correct only for invitation flows where the consumer needs to see it once.

If those four are clean, the PR is approvable. If any fails, the PR is bounced with a comment naming the failure.

A Note on "No Characters That Look Alike"

You will be asked, at some point, to exclude characters that look alike — usually 0, O, 1, l, I. Resist this. It shrinks the alphabet, reduces entropy, and the actual usability benefit is small for a password that is copy-pasted once. The NIST SP 800-63B Digital Identity Guidelines explicitly recommend against composition rules, including this one, in favor of length. If a stakeholder insists, document the entropy loss so the decision is made consciously rather than by reflex.

Frequently Asked Questions

How long should a programmatically generated password be?

For service accounts and CI tokens, 24 characters from a 62-character alphabet is a sensible default — roughly 143 bits of entropy, well past any brute-force horizon. For invitation passwords that humans will type once before rotating, 16 is acceptable. For end-user passwords, length matters less than your rate limiting and storage hashing strategy.

Is `crypto.randomUUID()` good enough?

For tokens that get used as identifiers, yes. For passwords, no — UUIDs are drawn from a restricted bit pattern and produce strings with hyphens in fixed positions, which weakens them as passwords and makes them recognizable as UUIDs in logs. Use a CSPRNG directly.

Should I generate the password on the client?

Almost never. If the client generates it, the client has the plaintext, and you have lost control of where it lives. Generate server-side, transmit over TLS, and never store the plaintext past the initial issuance.

What about using `openssl rand -base64` from a shell script?

It works for one-off provisioning, and the underlying CSPRNG is correct. The risks are the shell-script ones: the password lands in process listings, in shell history, and in any error output. Prefer a small language program that hands the value to your secret manager in the same process.

This article was drafted with AI assistance and reviewed for technical accuracy before publishing.

Auditing an Existing Subnet Plan Before a Cloud Migration

Tea-sip — Sun, 23 Aug 2026 20:03:03 +0000

Most subnet articles start from a blank piece of paper and end with a clean diagram. That is not the situation most teams are actually in. The situation is a Confluence page from 2019, a router config someone exported last quarter, and a network engineer who swears "the 10.40.0.0/16 is in use somewhere" but cannot remember where. The migration deadline is in three weeks. Your job is to prove, on paper, that every existing subnet still fits its purpose, that nothing overlaps, and that the new VPC ranges will not collide with anything that survives the cutover.

This is the audit mindset. It is mostly arithmetic, a little detective work, and a lot of writing things down so the next person does not have to redo it.

Treat the Audit Like a Code Review

A subnet plan is a piece of infrastructure code. It deserves the same hygiene as a Terraform module: a source of truth, a diff against reality, and a sign-off. Before touching anything, gather the inputs into one place:

An export of every router, switch, and firewall interface description. The description string on GigabitEthernet0/0/0 is often the only thing that says "links to warehouse printer VLAN."
The DHCP scopes, including any helpers, reservations, and superscopes.
The DNS zone file, or at least the forward and reverse delegations your team owns.
Every cloud account's VPC, VNet, or project. Most teams have at least one "shadow VPC" that nobody admits to.
The site-to-site VPN and peering configuration. Encapsulated ranges count.

Put these into a single spreadsheet with one row per subnet: purpose, CIDR, VLAN ID, gateway, DHCP range, DNS suffix, owning team, and last-touched date. The last column is the most honest one. If a subnet has not been touched since 2021, ask whether it still needs to exist.

Build the Numbers, Not the Vibes

Once the inventory exists, the next step is to reduce it to first principles. For every row, write down the network address, the broadcast address, the usable host range, and the prefix length. This sounds tedious, and it is, which is exactly why mistakes hide here.

A reliable workflow:

Pick the largest block you actually control or peer with. For most enterprises this is a /16 from RFC 1918: 10.0.0.0/8, 172.16.0.0/12, or 192.168.0.0/16.
Subtract the subnets you have already allocated from that block. If two subnets overlap, you have already found your first bug.
Compute the remaining free space as a list of CIDR ranges. These are the candidates for the migration.

The arithmetic itself is the same as the one covered in the step-by-step guide to calculating subnet bits from an IP and mask. Re-do it by hand for the top five entries in your inventory. If you cannot, neither can the on-call engineer at 2 a.m.

Common Failure Modes the Audit Has to Catch

A few patterns show up in roughly every audit I have run. Build the review checklist around them.

Overlapping allocations from acquisitions. A merged company often keeps both legacy schemas alive. Two /20s that look unrelated on paper can share a /19 if someone carved them across the wrong boundary. The fix is to identify the parent block each subnet belongs to and walk the tree.

The "we only use a few hosts" myth. A /24 has 254 usable addresses. Teams that ask for one "because we only need 30 hosts" almost always grow into it, then ask for another /24 instead of re-binning. Audits are a good moment to right-size: a /27 gives 30 hosts, leaves room to grow within the same /24, and is easier to summarize.

Documentation lag. The spreadsheet says 10.20.5.0/24 is "Finance printers." The router says 10.20.5.0/24 is "Guest Wi-Fi pilot, temporary." One of those is wrong. Cross-check against DHCP leases and firewall logs. The truth is usually in the logs.

Asymmetric VPN ranges. Site A uses 10.10.0.0/16. Site B uses 10.20.0.0/16. The tunnel comes up, but a host at A trying to reach a service at B cannot, because the corporate hub has a route summary that includes 10.10.0.0/15 and now covers B by accident. The mitigation is to keep site allocations inside distinct /16s and document the summary routes.

A practical ordered checklist for the audit meeting:

Inventory sources exported and merged into one sheet.
Every row has a verified purpose and owner.
CIDR math re-derived for each row from first principles.
Overlap test: no two rows share any address.
Containment test: every row is inside the declared parent block.
Right-size test: prefix length matches the documented host count plus headroom.
Cloud test: every VPC range is unique against on-prem ranges.
VPN test: every encrypted tunnel's local and remote ranges are documented and non-overlapping with any other range on either side.
Sign-off recorded with date and reviewer name.

Designing the New Ranges to Avoid the Same Mistakes

The migration is the right moment to introduce a prefix budget. Treat your RFC 1918 space the way a sysadmin treats a disk: lay out a top-level partition scheme and stick to it.

A workable pattern for a multi-VPC estate:

Reserve a contiguous /16 per region or per business unit.
Inside each /16, reserve the first /20 for infrastructure (bastion, DNS, monitoring, jump hosts).
Reserve the second /20 for shared services (CI runners, artifact caches, internal APIs).
The remaining /11 is for application subnets, sliced per environment (dev, staging, prod) and per tier (web, app, data).

This gives you three properties for free. First, any summary route you advertise is clean and unlikely to cross-pollinate. Second, capacity planning is local: a team that needs more /24s asks inside its own /16, not against the whole /8. Third, audit answers become one-line: "Is this VPC inside its parent /16? Yes or no."

The prefix budget also forces the conversation about IPv6. Most enterprises are still IPv4-only in production, but every modern cloud VPC supports dual-stack with essentially no extra cost. If your audit produces a single document that includes an IPv6 prefix per region (typically a /56 per VPC, carved from your ARIN or RIPE allocation), the next audit will not have to invent the scheme from scratch.

Tooling and Verification

Manual arithmetic is the right starting point because it exposes assumptions, but it does not scale to 400 subnets. Pick a calculator you trust, run every row through it, and then run the same rows through a second method. The two outputs should match exactly.

A useful verification trick is to treat the inventory as a set of intervals on the number line and use simple set arithmetic: the union of all allocated subnets must be a subset of the parent block, and pairwise intersections must be empty. If you can express your spreadsheet as a list of [start, end] pairs and pass it to a 30-line script that flags any pair whose intervals intersect, you will catch the overlap that the human eye misses at row 47.

Two references to keep on hand during the audit. RFC 1918 is the canonical source for private IPv4 allocation and is short enough to read in one sitting; the RFC 1918 document is the right anchor. For IPv6 planning, the Wikipedia IPv6 article covers address types and the recommended allocation sizes for organizations. Neither is marketing material; both are stable and unlikely to rot.

Frequently asked questions

How often should a subnet audit be performed?

At least once a year, and any time a new site, cloud account, or major acquisition enters the picture. The cost of a yearly review is far less than the cost of discovering a collision during a Friday night cutover.

What is the smallest team that can do this responsibly?

One engineer who owns the spreadsheet, plus one reviewer who challenges every row. The reviewer does not need to be a network specialist; they need to be willing to ask "why is this /24 and not /27?" and to wait for a real answer.

Should overlapping subnets be merged or kept separate?

Merge only when the owning teams agree on a common gateway, DHCP scope, and security policy. Otherwise, re-bin the parent block: pick a new prefix length that holds both, and document the carve-out as a single allocation rather than two overlapping ones.

What is the single highest-value artifact to produce?

A signed diagram and spreadsheet that show, on one page, every subnet, its parent block, its purpose, and its owner. If a stranger can read that page and understand the network in five minutes, the audit has succeeded.

This article was drafted with AI assistance and reviewed for technical accuracy before publishing.

Tipping on a Pre-Tax vs Post-Tax Base: A Reference Sheet for Engineers Who Build the Math

Tea-sip — Sat, 22 Aug 2026 22:04:18 +0000

If you have ever wired up a "calculator widget" in a checkout flow, expense module, or hospitality backend, you have probably discovered that the boring question — do we tip on the pre-tax subtotal, the post-tax total, or something in between? — is not boring at all. It is a tiny rules engine wrapped in regional habits, rounding quirks, and disagreement between what a customer expects and what a service worker receives.

This article is for engineers and product builders who need to implement tipping cleanly. It treats the problem as a small data-mapping exercise: inputs, rules, edge cases, outputs. No vibes, no etiquette lectures — just the working surface area you need to ship a defensible feature.

Why the base amount matters more than the percentage

Most developers assume tipping is a single multiplication: tip = subtotal * 0.18. That works until your subtotal is the wrong one. In the United States, sales tax is appended at the register, after the tip prompt on most point-of-sale terminals — which means the tip is computed against the pre-tax base by default. In countries with a pre-tax model, such as much of Canada, the practice is similar. In jurisdictions where a service charge is already baked into the price, adding a "tip" on top of an already-inflated base double-counts the service component.

For a builder, the practical consequence is that your calculation function should accept two numeric inputs — the pre-tax base and the post-tax total — and an explicit rule selector, rather than a single opaque subtotal. That makes the policy auditable later, because someone in QA will ask why the figure on screen differs from the figure on the receipt.

A concise table of common conventions:

Region / Venue Type	Default Base	Notes
US restaurants, cafes	Pre-tax subtotal	Tip line appears before tax on the receipt
US bars and table service	Pre-tax subtotal	Some terminals default to 20% on post-tax
Canada (most provinces)	Pre-tax subtotal	GST/HST still added after the tip line
UK pubs and restaurants	Often discretionary	Many receipts show service charge inclusive
EU sit-down dining	Service charge may already be included	Tipping "on top" is unusual but tolerated

A minimal reference function

Here is a small, copy-pasteable shape for the calculation, in plain pseudocode so the intent is obvious regardless of your stack:

function computeTip(base, taxAmount, rate, policy):
    baseAmount = policy == "PRE_TAX" ? base : base + taxAmount
    rawTip = baseAmount * rate
    return roundToCurrency(rawTip, policy)

Three things to notice:

The policy is an enum, not a boolean. "Always post-tax" and "always pre-tax" are two of three or five modes your product will eventually support. Adding a string later is cheaper than refactoring a flag.
The rounding rule belongs to the function, not the caller. If your terminal rounds up to the nearest dollar and your mobile app rounds to the nearest cent, your QA matrix will explode.
taxAmount is a separate input. Trying to derive it inside the calculator from a magical subtotal is how you end up with off-by-a-fraction bugs at the boundary between inclusive and exclusive tax regimes.

For the deeper walkthrough of how those policies behave when you stack discount lines, loyalty credits, and comped items, the Lizely guide on tipping before or after tax is the reference I send junior engineers to before they touch the checkout code.

Edge cases that bite in production

A few scenarios that look innocuous on a whiteboard but cause real tickets:

Comp items and "voided" lines. If a free dessert is zero-priced on the ticket, it usually stays in the tip denominator — the server still carried it. Decide that explicitly. Some systems exclude comps from the base; others include them at zero cost. Either is defensible, but the choice must be documented.

Tax on tax in inclusive regimes. When VAT is folded into the displayed price, "post-tax" and "pre-tax" collapse to the same number, but the suggested tip percentage may differ because the displayed price already includes the service mindset. The OECD's value-added tax overview is a stable reference for which jurisdictions use inclusive pricing — bookmark the article rather than any single country's revenue page, since those URLs move frequently.

Currency and minor units. JPY has zero decimal places; BHD has three. If your tip calculator returns Math.round(value * 100) / 100, you have already shipped a bug to three markets. Store and compute in minor units (cents, fils, sen) and only format on the way out. The MDN guide to Intl.NumberFormat covers the formatting half; pair it with a minor-units convention in your domain model.

Rounding direction and group fairness. When a table of four splits a tip, the order in which you round each share matters. Round all shares down and the server loses a few cents; round all up and the last payer is subsidizing the others. The honest fix is to compute the unrounded total, distribute, then adjust only the largest share by the residual — which is why the "split the bill fairly" pattern is its own subsystem.

Pre-entered percentages that ignore policy. Many terminals let a customer tap "18%" without specifying the base. If your engine assumes pre-tax and the customer's mental model is post-tax (because the displayed total included tax), they will tip less than they intended. Surfacing the base on the tip screen — even as a small grey line — closes most of that gap.

A pre-launch checklist for the tipping component

Before you ship, walk this list:

[ ] Confirm with finance or ops which base the business expects: pre-tax, post-tax, or configurable.
[ ] Decide rounding direction per currency and document it next to the function.
[ ] Treat tax as a separate input, not a derived value, so inclusive and exclusive regimes share the same code path.
[ ] Validate that comp, void, and discount lines behave consistently with the chosen rule.
[ ] Test split flows with uneven shares (3, 5, 7 payers) and confirm the residual adjustment lands on the largest share.
[ ] Add a policy enum field to any analytics event so you can later answer "what fraction of tips were computed on which base?"
[ ] Localize the tip prompt wording; "gratuity" and "tip" carry different cultural weight.

How to pick the base for your specific product

There is no universal right answer. Three heuristics I lean on:

Match the physical receipt. If your digital receipt mirrors the printed one, mirror the calculation. Customers who reconcile against a paper receipt will trust a number that matches their expectation.
Match local habit. In the US, pre-tax is the default expectation; deviating without a label will read as a surcharge.
Match what your staff receives. If a service charge is already in the price, your "tip" feature should probably be relabeled as a gratuity for exceptional service, and the policy should be clearly pre-tax-equivalent.

The goal is consistency between what the customer sees, what the worker takes home, and what your ledger records. When those three line up, the math is right, even if the chosen percentage is debatable.

Frequently asked questions

Should the tip default be pre-tax or post-tax in the United States?

For most US sit-down venues, pre-tax is the expectation. Default your calculator to pre-tax and let advanced users override it. Showing the base explicitly on the tip screen ("Tipping on $42.18, before tax") builds trust and reduces the surprise at the bottom of the receipt.

How do I handle currencies without two decimal places?

Compute in minor units throughout, and only format at the edge. For zero-decimal currencies like JPY, your rounding function should treat the integer as already-rounded. For three-decimal currencies like BHD, store thousandths of the main unit and round to the nearest thousandth at display time.

What is the cleanest way to test split-bill fairness?

Unit-test the unrounded total first, then assert that the sum of rounded shares equals the unrounded total to within one minor unit. If your test allows a two-unit drift, you are testing rounding, not distribution, and you will ship off-by-one bugs.

Where does the tax figure come from in my model?

Treat tax as an explicit input supplied by the order service, not something the tip calculator recomputes. Recomputing it inside the tip module duplicates policy logic that belongs in a single pricing service, and it is the most common source of "the tip is off by a cent" tickets.

This article was drafted with AI assistance and reviewed for technical accuracy before publishing.

DEV Community: Tea-sip

The Dinosaur Game's Speed Curve, Decoded: A Reverse-Engineer's Field Notes

What the Speed Function Actually Is

Why the Curve Matters More Than Reflex

A Reproduction You Can Run Locally

Drill Design Based on the Curve, Not on Vibes

Reading the Obstacle Set, Not Just the Obstacle

A Compact Pre-Run Checklist

Frequently asked questions

Why does the game feel completely different at 700 even though the speed only changes by half a millisecond?

Is there a known maximum score, or is it theoretically infinite?

Does the curve change between Chrome versions?

Can I practice the curve without internet at all?

Building a Repeatable Audio-Extraction Workflow for Engineering Teams

Why "Save the Video File" Is Not a Workflow

Container, Codec, and Channel Decisions You Actually Make

A Pre-Extraction Checklist an Engineer Can Run

When Server-Side Processing Beats a Desktop Tool

Common Production Bugs and How to Spot Them

Adopting the Workflow Without Blowing Up the Existing Process

Frequently asked questions

What is the difference between extracting and converting audio from a video?

Does the audio codec inside the video affect output quality?

When should a team move from a browser-based tool to a scripted pipeline?

How should the output be stored to keep the workflow maintainable?

Life Path Number Reference Table: Every Birthday Reduction in One Place

The Reduction Rules, Written Down Plainly

Which Inputs Should Your Function Reject?

A Reference Table for Every Reduction

The Master-Number Cases That Actually Bite You

How to Test This Without Going Mad

Frequently asked questions

Why does my reducer return 2 for some dates that should be 11?

Should I support 33 as a master number?

How do I handle leap-day birthdays (February 29)?

Can I shortcut with a modulo?

Designing a Step-Sequencer UI That Survives Real-World Use

What the Grid Actually Is, Conceptually

The Transport Loop and Why It Drifts

The Sound Bank Problem

Patterns Worth Stealing for Other Timelines

A Practical QA Checklist for Step-Sequencer Widgets

Edge Cases That Look Trivial Until You Hit Them

Frequently Asked Questions

What is the smallest data structure that captures a full pattern?

Can I avoid using the Web Audio API for scheduling?

How do I support keyboard users without losing the grid metaphor?

Why does my pattern sound wrong even though the grid looks right?

Decoding an Amortization Schedule: How to Audit a Mortgage Calculator's Output Row by Row

What an Amortization Schedule Actually Contains

The Three Audit Tests You Should Always Run

The Reference Checklists Different Loan Types Demand

Trade-offs When You Need to Choose Between Approaches

Debugging the Schedule When the Numbers Look Wrong

Choosing a Calculator When You Cannot Audit the Code

Frequently asked questions

How precise does a mortgage schedule need to be?

Can an amortization schedule have a row where principal exceeds interest before the midpoint?

What does a negative amortization schedule look like?

Is biweekly payment scheduling worth modeling?

Angle Conversions in Frontend Code: A QA Checklist for the Bugs You Don't See

The Three Frontend Surfaces Where Angle Units Bite

A Five-Point Review Checklist for Any PR That Draws Arcs

Writing Conversion Helpers That Can't Be Misused

Debugging a "Rotated By a Tiny Bit Wrong" Bug

When To Standardise on Radians vs Degrees Across a Team

Frequently asked questions

What's the fastest way to verify a suspect angle conversion?

Should I store angles as degrees or radians in my database or JSON payload?

Is Math.PI / 180 ever wrong?

How do I prevent regressions after I fix the bug?

The Cell-by-Cell Character Audit: A Developer's QA Checklist for Form, Field, and Feed Limits

The Three Lengths That Compete Inside One Input

A Reference Table You Can Paste Into Your Style Guide

Edge Cases That Routinely Slip Past Code Review

A Pre-Ship Checklist You Can Adopt Today

Trade-offs When You Build the Counter Yourself

Debugging the Mismatch You Inherited

Frequently Asked Questions

Which character-count unit should I default to when the vendor says "characters"?

Is `Math.PI / 180` ever wrong?

Is `crypto.randomUUID()` good enough?

What about using `openssl rand -base64` from a shell script?