Build1 distinct publisher3 min readPublished
Canvas arc() wants radians while CSS transform wants degrees, and the mismatch never raises an exception, so a dev.to checklist puts the catch in the diff and the lint config instead of in each bug fix.
The Engineer · Build desk

Compiled by The EngineerSomething wrong?How this is made
Radians wrap, which is why nothing throws. Hand a drawing function 30 when you meant 30 degrees and it reads 30 radians: that is 1718.87 degrees, four and three quarter turns, arriving at 278.87 degrees once you take the remainder [1]. The arc still gets drawn. Slices that should sit apart can land on top of each other and read as one wedge, which is the symptom the author describes two weeks after the demo passed, when a teammate opens the file in Safari [18]. Mixing units on geometry calls is, per the post, the most common cause of arc-starts-in-the-wrong-place tickets [19].
The grep list is the cheapest item in the checklist: `Math.PI`, `* 180`, `* 360` and `/ 57.29`, each occurrence required to carry an adjacent comment naming the surface it targets [7]. That last string is a rounded 180/pi. Using 57.29 instead of 57.2957795 moves a full turn by about 0.036 degrees [2], which nobody will ever see on a pie chart. The grep is therefore about direction rather than precision: multiplying where you needed to divide is the whole bug class, and the constant is only the fingerprint.
Bare constants hide the same mistake. The post contrasts `const SLICE_ANGLE = 0.5236` with `const SLICE_ANGLE_DEG = 30` [10]. Convert one and you get the other: 0.5236 rad is 30.0001 degrees [3]. Both draw the same slice. Only one of them survives being read by someone who does not already know which surface the file targets.
The boundary rule is where the checklist earns its keep. Three.js works in radians throughout and ships `THREE.MathUtils.degToRad` because of how often that trips people [6]. CSS Values and Units Level 4 accepts `rad` as well as `deg`, but the authoring tools and design specs feeding your code emit degrees [5]. So a radians-native codebase still receives degrees, and the answer is one conversion in the deserialiser or a single `toSceneUnits()` call rather than a conversion at every call site [16]. Imported formats behave the same way: a DWG floorplan or a DICOM slice arrives in whatever unit the format mandated and is converted once [17].
The last item is the expensive one. Rendering the scene with deliberately wrong inputs, where -30 in place of 30 should produce a different but still valid picture and total breakage indicates a double conversion [11], needs a harness that can compare renders. That is a CI project, not a review habit. The boundary rule also assumes you have a boundary; if `arc()` calls are spread across twenty components, "convert in the deserialiser" is a refactor, and a per-file review pass will not surface it. Note too that SVG's conventions are per call: `getPointAtLength()` works in the path's authored user units, whatever those were [14]. In my context the grep list and the unit-suffixed constants are worth adopting on the next diff, and the render test waits until something already renders in CI.
Ranked by verification strength, evidence, and original report placement.
A dev.to article presents a QA checklist for angle conversions in frontend code, focused on 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 being patched each time it appears.
Angle conversion bugs are quiet because they do not throw exceptions; they produce geometry that is slightly wrong, and only sometimes.
The CanvasRenderingContext2D.arc() method takes radians, and so does CanvasRenderingContext2D.rotate(); the Canvas 2D API documentation is explicit about radians.
CSS uses degrees in transform: rotate(45deg) and in the individual rotate transform property.
The CSS Values and Units Level 4 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.
Three.js uses radians for everything, and THREE.MathUtils.degToRad exists precisely because so many people get this wrong; the same applies to anything wrapping GL math.
Distinct publishers with included, body-backed reporting in this cluster.
dev.to
1 article · August 28, 2026
Follow any of these and your For You feed starts watching them — no settings page required.
build
Flaky CI is a review standards problem, and this checklist names the three gates1 distinct publisher
build
Allow-list the closed set, block-list the open one: 193 thin geo pages, one gate1 distinct publisher
build
Forty animated backgrounds, one battery budget: how Pairly rations frames on old Android1 distinct publisher
build
The stroke width that never rendered: SVG attributes lose every cascade fight1 distinct publisher
Evidence-backed comparisons of source perspectives and observed adoption signals. Read the methodology
Which Builder, Operator, and Investor concerns the observed source mix emphasized—not a truth score.
Evidence, demonstrated adoption, hype gap, incentives, and confidence are assessed independently, each on its own current evidence. How these are measured.
Checkable where it matters least
Every API fact in the piece can be verified outside it, and the dev.to author points at the references himself: MDN for arc(), CSS Values and Units Level 4 for <angle>, Three.js for degToRad. What cannot be verified is the part doing the persuading — 'catches most unit mistakes before they reach main' and 'the single most common cause' of misplaced-arc tickets are one developer's memory with no issue counts attached. And the surface map slips: the paragraph that files SVG under the radian APIs states two sentences later that SVG's rotate() attribute takes degrees, which is precisely the confusion the checklist claims to eliminate.
No one's usage on the record
Not a single team, repo, or shipped guardrail appears in this reporting. The checklist is offered as the author's own habit; the lint enforcement it recommends is described but never pointed at an existing rule, the wrong-unit render test is not shown running anywhere, and no defect counts before or after adoption exist to look at. There is nothing to measure yet.
Restrained, with two unearned superlatives
For the genre this is modest: nothing to buy, a minute per file, and arithmetic a reader can check for himself — 0.5236 radians really is 30.0001 degrees, so the honest-constant example holds. What pushes it slightly past its evidence is the ranking language. 'Most unit mistakes' and 'the single most common cause' are asserted with the same confidence as the MDN-backed facts, and one of the four grep targets is a rounding tell worth roughly 0.036 degrees per turn rather than a bug at all.
A tool link inside the advice
Midway through, the engineering guidance detours to recommend a 'How to Convert Degrees to Radians in Seconds' walkthrough for one-off conversions during debugging — a referral placed where a reader is most receptive, with no word on what relationship the author has to it. Everything around it is ordinary developer-platform reputation work: 'the checklist I wish I had' is a credibility frame, and it shapes which claims get superlatives rather than which facts are true.
One author, no second opinion
Single publisher, single practitioner, nobody who has tried it. The claims that survive outside scrutiny are the ones nobody disputes — which unit each API takes — while the claims that would tell a team whether the minute per file pays for itself have no corroboration at all. Add the self-contradicting SVG paragraph and the sensible move is to trust the technique and verify the reference table.