Сокращение CSS vs longhand?

Какой лучше? Использование сокращения:

padding:5px 10px 15px 20px;

Или используя longhand как:

padding-top:5px;
padding-right:10px;
padding-bottom:15px;
padding-left:20px;

Связано с:

  • производительность (производительность браузера, размер файла)
  • документация (простота обслуживания разработчиком)
  • и другие

ОТВЕТЫ

Ответ 1

  • Вам не стоит беспокоиться о производительности CSS, если вы не профилировали загрузку страницы, и она стала узким местом (я сомневаюсь, что это почти всегда несколько HTTP-запросов и изображений).
  • Любой компетентный разработчик может помнить по часовой стрелке сверху для порядка значений.
  • Сокращение означает меньшее количество байтов, которое будет отправлено, что CSS minifier не оптимизирует себя (я не думаю).
  • Я использовал бы только длинный метод, если бы установил одно значение, например. padding-left: 3px.