Стоит ли изучать haml & sass?

Ответ 1

Хэмл хорош, и я использую его много, но Сасс стоит того, что нужно, особенно если вам нужно создавать сложные таблицы стилей. Например, одна из худших вещей о CSS - это то, сколько избыточности вы должны делать, когда выбираете имена. В CSS вам нужно сделать

#navbar ul 
#navbar ul li a
#navbar ul li a:hover

С Сасс, вы можете просто вложить эти декандаторы естественно.

#navbar

  ul
    margin: 0
    padding: 0
    list-style: none
    width: 100%

    li
      margin: 0
      float: left
      margin-right: 10px
      border: 1px solid #000

      a
        text-decoration: none

        &:hover
          color: red

Вы также можете использовать переменные

!border_color = #333

.box
  border = 1px "solid" !border_color

И вы можете использовать математику с ними

!measure = 18px
!text_size = !measure / 1.5

body
  font-size = !text_size
  line-height = !measure

h1
  font-size = !measure
  margin-bottom = !measure

h2
  font-size = !measure + 2

#wrapper
  width = !measure * 50

Вы также можете использовать код

=rounded
  -moz-border-radius: 4px
  -webkit-border-radius: 4px
  border-radius: 4px
  border: 1px solid #000

.box
 +rounded

В этом так много власти, что вы должны сделать это ради себя, чтобы узнать это. Кроме того, конечным результатом является простой CSS, поэтому его можно преобразовать.

Не забывайте о css2sass, который преобразует существующие css в sass файлы!

Вы можете играть с некоторыми примерами в http://rendera.heroku.com/, если хотите. Это сайт, который я создал, чтобы помочь людям изучать HTML5 и CSS3, и у меня есть поддержка как HAML, так и SASS.

Кроме того, взгляните на StaticMatic (staticmatic.rubyforge.org) для удивительного способа работы с статическими веб-сайтами с HAML и SASS. Он создает веб-сайты, которые вы можете загрузить на статические хосты, и имеет систему макета и шаблонов, похожую на Ruby on Rails.

Чтобы обратиться к прямому вопросу, который вы задали, путем "стоит ли это", ответ "да". Будучи способным использовать переменные, легко группировать вещи по селектору и обмениваться кодами через модули, упрощает составление таблиц стилей. Построение таблиц стилей не займет много времени, и вы можете использовать превосходную инфраструктуру Compass, чтобы идти еще дальше. Например, вы можете использовать модули 960.gs или Blueprint для объединения этих фреймворков в существующие таблицы стилей. Таким образом, вам не нужно менять разметку вашего кода. Добавление 960.gs и его классов "grid_12" и "container_12" ко всей вашей разметке может быть невозможно, но с Compass и Sass это легкий ветерок.

Sass также упрощает создание нескольких таблиц стилей для режима разработки и генерирует единую таблицу стилей для производства, тем самым улучшая производительность на стороне клиента (меньше вызовов на сервер при загрузке страницы).

У HAML есть свои преимущества, хотя они не так заметны, как Sass. HAML делает невероятно легким вложение элементов и объявляет DIVS... используя даже обычные 960.gs, например, легко с HAML:

#header.container_12
  .grid_12
     %h1 Welcome!
#middle.container_12
  .grid_8
     %h2 Main content
  .grid_4
     %h3 Sidebar

Гораздо меньше набрав. И если вы решите, что по какой-то причине вам нужно добавить оболочку вокруг всего этого, просто отпустите все это под новым тегом.

Надеюсь, что это поможет. я < 3 Sass.

Ответ 2

Мой текущий веб-сайт имеет более 800 файлов Haml и 150 файлов Sass, и позвольте мне сказать вам, что это очень помогло моему развитию.

Самое большое преимущество заключается в быстром развитии: создание файлов Haml/Sass требует гораздо меньшего набора текста, поэтому вы можете выровнять логику представления с гораздо меньшим количеством нажатий клавиш, чем если бы вы делали шаблон erb.

Я также считаю, что файлы Haml намного легче читать и меньше подвержены ошибкам.

YMMV, но я дошел до того, что не использовать Хэмл, как хохот.

Ответ 3

TL; DR - В то время как популярно, я предпочитаю не использовать HAML или SASS, но мне нравится SCSS.

Похоже, что общий консенсус по HAML в подавляющем большинстве в пользу этого, но лично я не забочусь о нем.

Если я намерен генерировать HTML-код, я предпочитаю, чтобы язык шаблонов был как можно ближе к HTML. Это позволяет избежать необходимости изучать другой слой косвенности, который добавляет возможности для путаницы и ошибки, а также приводит к когнитивным издержкам.

Я нахожу ограничения, которые HAML помещает на мое предпочтительное использование пробелов для удобства чтения и переноса строк, и они часто приводят к синтаксису, который может быть трудночитаемым.

Недавно я столкнулся с тонкой ошибкой в ​​шаблоне HAML, который был бы сразу же очевидным, если бы шаблон был ERB, например:

 .table
   .thead
   .tr
   .tr

Строки таблицы не входят в тег THEAD, который является абсолютно допустимым HAML, но неверен в отношении предполагаемой структуры HTML. Несмотря на то, что страница отображалась правильно, селектор CSS не удался, что привело к молчаливому сбою некоторых Javascript-кода.

Я уверен, что такая ошибка будет очевидна для большинства пользователей HAML, как показано изолированно, но в контексте более крупного шаблона это может быть трудно обнаружить; особенно для разработчика, нового для HAML.

С другой стороны, если это были ERB или HTML:

 <table>
   <thead>
   <tr>...</tr>
   <tr>...</tr>

На мой взгляд, ошибки в структуре гораздо легче обнаружить из-за того, что ERB и HTML почти всегда отступают.

Проведя почти два десятилетия, написав HTML, я должен признать, что у меня есть определенная гордость в написании хорошо сформированного HTML, и я не вижу причин изучать другой способ его представления и изучения всех новых визуальных шаблонов, необходимых для выявления ошибок.

С другой стороны, мне очень нравится SCSS (в отличие от SASS), потому что SCSS по сути является надмножеством CSS. Он не добавляет совершенно новый слой косвенности, который мне нужно мысленно перевести. Он добавляет лишь небольшое изменение в синтаксисе, которое обеспечивает более сжатое (и DRY) представление CSS, которое я считаю очень легким для чтения и понимания.

В самом деле, я предпочитаю не использовать какой-либо язык, который обеспечивает строгий синтаксис относительно того, как я должен отступать или переносить строки моего кода, такого как python. Или языки, которые служат только как слой косвенности поверх основного языка, такого как coffeescript.

Я не говорю, что я считаю, что абстракция и косвенность плохой в языках программирования; только я предпочитаю не использовать их в отношении конкретных языков, обсуждаемых здесь.