Здравствуйте, меня зовут Дмитрий Карловский и я.. изобрёл $mol только для того, чтобы ваши глаза кровоточили, глядя в его код. Во всяком случае, такое ощущение может сложиться, если почитать разного рода околоJSНые чаты, но не обращаться к первоисточникам, где все технические решения вытекают из чисто прагматических рассуждений. Один из таких анализов позвольте представить вашему вниманию.
Способы записи
camelCase
Традиционно используются в именах переменных и полей во многих современных языках.
❌ Требуется много нажатий шифта вовремя.
❌ слипшиесяСловаТрудноЧитать.
❌ Проблемы с аббревиатурами: sdpFmtpLine, encodeURICoponent.
❌ Имеет проблемы с наложением стилей в CSS (в зависимости от типа элемента и типа селектора стиль может не примениться).
PascalCase
Традиционно используются для имён классов и глобальных неймспейсов.
❌ Требуется много нажатий шифта вовремя.
❌ СлипшиесяСловаТрудноЧитать.
❌ Проблемы с аббревиатурами: XMLHttpRequest, HTMLBRElement, IDBOpenDBRequest, RTCDTMFSender.
❌ Одноимённые имена файлов могут вызвать проблемы в не чувствительных к регистру файловых системах.
❌ Проблемы с наложением стилей в CSS (в зависимости от типа элемента и типа селектора стиль может не примениться).
lowercase
Традиционно используется для имён нативных событий в браузере.
❌ слипшиесясловатрудночитать.
❌ проблемы с аббревиатурами: onicegatheringstatechange.
UPPERCASE
Традиционно используется для cтандартных элементов в некоторых DOM-API (tagName, например)..
❌ СЛИПШИЕСЯСЛОВАТРУДНОЧИТАТЬ.
❌ Требует временного включения caps lock при вводе или зажатия шифта.
❌ проблемы с аббревиатурами: BGSOUND.
❌ Текст с малым числом выносных элементов сложно воспринимать: FIGCAPTION.
❌ Одноимённые имена файлов могут вызвать проблемы не чувствительных к регистру файловых системах.
❌ Имеет проблемы с наложением стилей в CSS (в зависимости от типа элемента и типа селектора стиль может не примениться).
kebab-case
Традиционно используются для имён в HTML, CSS, Lisp, а также в именах файлов.
❌ Редакторы не считают эти имена единым именем (выделение даблкликом, ctrl+стрелка и тп).
❌ Не допустимо в большинстве языков программирования.
❌ Имя получается на несколько символов длиннее.
❌ Лишние символы ломают Fuzzy Search в IDE/DevTools, так как они не встречаются в пути.
SHAWERMA-CASE
Традиционно используются для имён нестандартных элементов в некоторых DOM-API (tagName, например).
❌ Редакторы не считают эти имена единым именем (выделение даблкликом, ctrl+стрелка и тп).
❌ Не допустимо в большинстве языков программирования.
❌ Требует временного включения caps lock при вводе.
❌ Имя получается на несколько символов длиннее.
❌ Текст с малым числом выносных элементов сложно воспринимать: ACME-TOOLBAR-DROPDOWN.
❌ Лишние символы ломают Fuzzy Search в IDE/DevTools, так как они не встречаются в пути.
❌ Одноимённые имена файлов могут вызвать проблемы не чувствительных к регистру файловых системах.
❌ Имеет проблемы с наложением стилей в CSS (в зависимости от типа элемента и типа селектора стиль может не примениться).
snake_case
Традиционно используются в "олдскульных" языках (C, C++, Rust, Erlang, OCaml) и языках с упором на читаемость (Ruby, Python) для локальных имён и имён полей.
❌ требуется_много_нажатий_шифта.
❌ Имя получается на несколько символов длиннее.
❌ Лишние символы ломают Fuzzy Search в IDE/DevTools, так как они не встречаются в пути.
Cobra_case
❌ Требуется_много_нажатий_шифта.
❌ Имя получается на несколько символов длиннее.
❌ Лишние символы ломают Fuzzy Search в IDE/DevTools, так как они не встречаются в пути.
❌ Одноимённые имена файлов могут вызвать проблемы не чувствительных к регистру файловых системах.
❌ Имеет проблемы с наложением стилей в CSS (в зависимости от типа элемента и типа селектора стиль может не примениться).
SCREAM_CASE
Традиционно используется для констант.
❌ Требует зажатия шифта при вводе.
❌ Имя получается на несколько символов длиннее.
❌ Текст с малым числом выносных элементов сложно воспринимать: SVG_MORPHOLOGY_OPERATOR_UNKNOWN.
❌ Лишние символы ломают Fuzzy Search в IDE/DevTools, так как они не встречаются в пути.
❌ Одноимённые имена файлов могут вызвать проблемы не чувствительных к регистру файловых системах.
❌ Имеет проблемы с наложением стилей в CSS (в зависимости от типа элемента и типа селектора стиль может не примениться).
Смешение стилей
Традиционно проявляется при попытке использовать традиционное именование для каждого языка по отдельности. В разных местах одна и та же сущность имеет разное форматирование имени.
❌ Требуется дополнительное ментальное напряжение на ассоциацию и конвертацию разных форматов одного имени.
❌ Тут и там необходимы конвертации между стилями написания.
❌ Не везде возможна автоконвертация. Например в TypeScript на уровне типов такое затруднительно.
❌ Поиск всех вхождений одного имени в проекте приходится повторять для каждой формы написания.
❌ Суммирует недостатки всех употребляемых стилей.
Нативные API
Web API развивались стихийно, так что не стоит удивляться необоснованному разнообразию форматов имён в разных местах:
JS:
PascalCase — классы
camelCase — поля, функции
lowercase — события
SCREAM_CASE — константы
CSS: kebab‑case везде
HTML:
lowercase — стандартные элементы и атрибуты
kebab‑case — нестандартные элементы и атрибуты
Отдельно стоит отметить смешение стилей, ведь одна и та же сущность может именоваться по разному в разных языках:
Имена стандартных элементов:
JS: lowercase, UPPERCASE, PascalCase
HTML: lowercase
CSS: lowercase
Имена нестандартных элементов:
JS: kebab‑case, SHAWERMA‑CASE, PascalCase
HTML: kebab‑case
CSS: kebab‑case
Имена атрибутов:
JS: camelCase, lowercase
HTML: kebab‑case, lowercase
CSS: kebab‑case, lowercase
Имена CSS‑классов:
JS: camelCase
HTML: kebab‑case
CSS: kebab‑case
Особняком стоит химерное именование констант типа SVG_MARKERUNITS_USERSPACEONUSE.
Рекомендации
✅ Оптимальный выбор - snake_case, как наиболее удобочитаемый и наименее проблемный.
Соглашения в $mol
snake_case — любые имена в XHTML и CSS, локальные имена в JS
Cobra_case — имена локальных фабрик в JS
$nake_case — глобальные имена в JS, соответствующие FQN.
Послесловие
Надеюсь этот разбор будет для вас полезным, даже если выводы окажутся совсем иными.
Указать на неточности или просто обсудить вопрос можно в комфортной обстановке темы про языки программирования на форуме Гипер Дев.
Почитать другие тех анализы и помочь их улучшить можно в Энциклопедии по $mol.
Актуальный оригинал на $hyoo_page.
