ACROCase

Acronyms Consistently Retain Original Case

The web platform has hundreds of APIs that contain acronyms. With remarkable consistency, those acronyms are kept uppercase:innerHTML, XMLDocument, toJSON, encodeURIComponent. ACROCase is simply a name for the convention that already exists.

The Evidence

Across the DOM, CSS Object Model, and every major browser API, acronyms retain their original casing. This pattern holds whether the acronym appears at the start, middle, or end of an identifier.

AcronymWeb platform APIs
HTMLHTMLElement, HTMLCollection, innerHTML, outerHTML
CSSCSSStyleSheet, CSSRule, CSSStyleDeclaration
DOMDOMParser, DOMRect, DOMTokenList, DOMException
SVGSVGElement, SVGPathElement, SVGRectElement
URLURL, URLSearchParams, URLPattern, createObjectURL
URIencodeURI, decodeURI, encodeURIComponent
JSONJSON.parse(), JSON.stringify(), toJSON
XMLXMLDocument, XMLSerializer, XMLHttpRequest
GPUGPUDevice, GPUBuffer, GPUTexture, GPUAdapter
RTCRTCPeerConnection, RTCDataChannel, RTCSessionDescription
IDBIDBDatabase, IDBObjectStore, IDBTransaction
USBUSB, USBDevice, USBConfiguration
HIDHID, HIDDevice, HIDConnectionEvent
MIDIMIDIAccess, MIDIInput, MIDIOutput
GATTBluetoothRemoteGATTServer, BluetoothRemoteGATTService
BYOBReadableStreamBYOBReader, ReadableStreamBYOBRequest
VTTVTTCue, VTTRegion
XRXRSystem, XRSession, XRFrame
DTMFRTCDTMFSender, RTCDTMFToneChangeEvent

This is not a handful of cherry-picked examples. There are over a hundred HTML*Element interfaces, over eighty SVG* interfaces, over fifty CSS* interfaces, and over thirty each for GPU*, RTC*, and XR*. The pattern is the default, not the exception.

Abbreviations That Are Not Acronyms

Not everything short is an acronym. The web platform draws a clear line between acronyms (which stay uppercase) and abbreviations (which follow normal casing).

Id

Id is an abbreviation for "identifier," not an acronym. The DOM uses it consistently: getElementById, elementId, clientId, requestId. Writing userID is wrong by web platform convention.

Intl

The Internationalization API is Intl, not INTL. It follows normal PascalCase as an abbreviation, not an acronym.

Where the Web Platform Disagrees with Itself

The convention is not perfectly consistent. There is one major area where it breaks down: the Web Crypto API.

AES, RSA, HMAC, and SHA are universally recognized as acronyms. But the Web Crypto API titlecases all of them:

WebRTC does something similar with sub-protocol names:

The reason is chaining. When two acronyms appear next to each other, the boundary between them disappears. AESCBC is hard to read.RTCDTLS is worse. Both the Crypto and RTC teams chose to titlecase acronyms that would otherwise chain, sacrificing acronym casing for readability.

This is a pragmatic tradeoff, not a rejection of the convention. The Crypto API titlecases all its acronyms for internal consistency, even when chaining is not an issue (like AesKeyGenParams, which could have been AESKeyGenParams without any readability problem). Meanwhile, RTCPeerConnection keeps RTC uppercase because it does not chain with the next word.

The lesson: avoid putting acronyms next to each other. When that is unavoidable, titlecasing the second acronym is the established precedent.

The Convention

ACROCase is camelCase with one rule: known acronyms keep their uppercase form.

acroCaseUpperACROCase
Acronym at starturlStringURLString
Acronym at endimageURLImageURL
Multiple acronymshtmlToJSONHTMLToJSON

When an acronym starts a camelCase identifier, it is lowercased like any other first word: urlString, httpRequest, jsonData. In UpperACROCase (PascalCase with acronyms), it stays uppercase: URLString, HTTPRequest, JSONData.

ESLint Plugin

eslint-plugin-acrocase enforces the convention automatically:

npm install eslint-plugin-acrocase --save-dev
{
  "plugins": ["acrocase"],
  "rules": {
    "acrocase/acrocase": "error"
  }
}

The rule is auto-fixable. It ships with a dictionary of 139 acronyms sourced from web platform APIs and common programming usage. Add project-specific acronyms through configuration:

{
  "acrocase/acrocase": ["error", {
    "acronyms": ["GCP", "NATS"]
  }]
}

If you use ESLint's built-in camelcase rule, disable it. It enforces lowercase acronyms, which contradicts the web platform.