Erb vs haml vs slim
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
5,432
On Slideshare
3,907
From Embeds
1,525
Number of Embeds
9

Actions

Shares
Downloads
4
Comments
0
Likes
3

Embeds 1,525

http://lushpai.org 1,496
http://abtasty.com 18
https://twitter.com 5
http://53e8f7019586e015c5588956fb3ecf9a.mtproxy.yandex.net 1
http://a9da70fbcae1a1db178543c6c01bb8ff.mtproxy.yandex.net 1
http://c3ad1ce6cc72e98a7ce7fbf4c76ef0ce.mtproxy.yandex.net 1
http://translate.googleusercontent.com 1
http://prlog.ru 1
http://lushpai.lushpai.org 1

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. ERB vs HAML vs SLIM Так ли хорош старый добрый ERB(HTML), если есть что-то получше?
  • 2. ERB vs HAML или SLIM
  • 3. А если серьезно…Преимущества HAML и SLIM перед ERB• Более читабельный код представлений.• Теги автоматически закрываются, нельзя пропустить закрывающий тег.• Вывод ошибок.Недостатки HAML и SLIM перед ERB• Один тег на строку. Большая длина строк при большой вложенности элементов.• Ниже производительность.• Дополнительные зависимости.
  • 4. Пример SLIMdoctype htmlhtml head title Rubydev = stylesheet_link_tag "application", :media => "all" = javascript_include_tag "application" = csrf_meta_tags body header .center h1 Development with Rails h5 and other technologies = render partial: "devise/devise_links" = render partial: "layouts/navigation" section{width=“720px”} .center = yield footer | © RubyDev 2012-2013
  • 5. Пример HAML!!! 5%html %head %title Rubydev = stylesheet_link_tag "application", :media => "all" = javascript_include_tag "application" = csrf_meta_tags %body %header .center %h1 Development with Rails %h5 and other technologies = render partial: "devise/devise_links" = render partial: "layouts/navigation" %section(:width => “720px”) .center = yield %footer | © RubyDev 2012-2013
  • 6. Великий и ужасный ERB<!DOCTYPE html><html> <head> <title>Rubydev</title> <%= stylesheet_link_tag "application", :media => "all" %> <%= javascript_include_tag "application" %> <%= csrf_meta_tags %> </head> <body> <header> <div class="center"> <h1>Development with Rails</h1> <h5>and other technologies</h5> <%= render partial: "devise/devise_links" %> <%= render partial: "layouts/navigation" %> </header> <section width="720px"> <div class="center"> <%= yield %> </div> </section> <footer> &copy; RubyDev 2012-2013 </footer> </body></html>
  • 7. Заметили ошибку?<header> <div class="center"> <h1>Development with Rails</h1> <h5>and other technologies</h5> <%= render partial: "devise/devise_links" %> ??? <%= render partial: "layouts/navigation" %></header>
  • 8. Синтаксический сахар. Такой сладкий- сладкий.#articles<div id="articles"></div>.article<div class="article"></div>P (Slim)<p></p>%P (HAML)<p></p>
  • 9. Интерполяцияp Hello #{@user.name}! или %p Hello #{@user.name}!Вместо:<p>Hello <%= @user.name %>!</p>Фильтрыjavascript: alert(“Welcome to rubydev.ru");markdown: #Hello #{“@user.name"} !… textile, ruby, coffeescript, plain, sass, scss, lesscss, RedCloth, Haml, etc.(thanks to Tilt)
  • 10. … и много других улучшенийсинтаксиса в сравнении с ERB (HTML)
  • 11. Haml, Slim = быстрая разработка
  • 12. HAML vs SLIMПреимущества HAML• Более распространен.• Теги четко выделены.• Лучше документация.• Есть возможность создавать собственные фильтры.Преимущества SLIM• Больше фильтров благодаря Tilt.• Больше производительность.• Позволяет писать несколько тегов в одну строку (лучше не злоупотреблять)
  • 13. Мнения разработчиковМое мнение:Я использовал и Haml и Slim. Первым был Haml, затем Slim. Разница невелика. Haml/Slim позволяют мне писать более чистый код, код, которыйлегче читать и поддерживать, код, который просто из-за того, что лишнеевыброшено быстрее писать. В HTML легко можно допустить ошибку,Haml/Slim не дают разработчику ошибаться, 100% тегов будут закрыты!
  • 14. Мнения разработчиковПо поводу альтернатив HTML/CSS могу сказать следующее:В своей работе я использую Haml и SCSS и они меня вполне устраивают.Работать с шаблонизаторами альтернативными ERB – Haml или Slim оченьудобно. Работа с ними становится гораздо приятнее. Помню как в первыйсвой раз, используя Haml, я верстал и наслаждался процессом, не чувствовалусталости от разработки. С Haml и SCSS работа как отдых.-- Евгений Жлобо, front-end разработчик, фрилансер
  • 15. Мнения разработчиковERB меня совсем огорчает, а вот HAML радует. Для себя я выделяюнесколько причин, почему HAML лучший выбор:• Закрывать теги давно уже не модно,• структура хамл исключает ошибки вложенности html тегов,• скорость разработки,• гибкость оформления кода и параметров,• легкость парсинга мозгом тегов и текстовой информации (в отличие от Slim, где теги и текст очень тяжело отличить друг от друга)-- Илья Зыкин – фронтэнд разработчик из kupibilet.ru
  • 16. Мнения разработчиковВсе новые проекты Hashrocket мы разрабатываем используя HAML и мысобираемся перенести все существующие в нашем портфолио проекты наHAML как можно быстрее. Разметка кода основанная на отступах работаетпросто замечательно для генерации чистого и семантичного кода в такойспособ, когда вы можете ясно видеть разметку и ее связь с CSS кодом. Этоочень круто!-- Оби Фернандез (http://blog.obiefernandez.com/content/2008/01/are-you-using-h.html)
  • 17. Хорошо, но как перевести существующий код на Haml/Slim? Это ведь очень долго! Нет, не долго! https://github.com/dhl/erb2haml, https://github.com/fredwu/haml2slim, etc.
  • 18. ВыводИспользуйте Haml/Slim
  • 19. Все еще хочется поспорить? ERB HAML/SLIM