ERB vs HAML vs SLIM.pptx
- Количество слайдов: 18
ERB vs HAML vs SLIM Так ли хорош старый добрый ERB (HTML), если есть что-то получше?
ERB vs HAML или SLIM
А если серьезно… Преимущества HAML и SLIM перед ERB • Более читабельный код представлений. • Теги автоматически закрываются, нельзя пропустить закрывающий тег. • Вывод ошибок. Недостатки HAML и SLIM перед ERB • Один тег на строку. Большая длина строк при большой вложенности элементов. • Ниже производительность. • Дополнительные зависимости.
Пример SLIM doctype html head title Rubydev = stylesheet_link_tag "application", : media => "all" = javascript_include_tag "application" = csrf_meta_tags body header. center h 1 Development with Rails h 5 and other technologies = render partial: "devise/devise_links" = render partial: "layouts/navigation" section{width=“ 720 px”}. center = yield footer | © Ruby. Dev 2012 -2013
Пример HAML !!! 5 %html %head %title Rubydev = stylesheet_link_tag "application", : media => "all" = javascript_include_tag "application" = csrf_meta_tags %body %header. center %h 1 Development with Rails %h 5 and other technologies = render partial: "devise/devise_links" = render partial: "layouts/navigation" %section(: width => “ 720 px”). center = yield %footer | © Ruby. Dev 2012 -2013
Великий и ужасный ERB <!DOCTYPE html> <head> <title>Rubydev</title> <%= stylesheet_link_tag "application", : media => "all" %> <%= javascript_include_tag "application" %> <%= csrf_meta_tags %> </head> <body> <header> <div class="center"> <h 1>Development with Rails</h 1> <h 5>and other technologies</h 5> <%= render partial: "devise/devise_links" %> <%= render partial: "layouts/navigation" %> </header> <section width="720 px"> <div class="center"> <%= yield %> </div> </section> <footer> © Ruby. Dev 2012 -2013 </footer> </body> </html>
Заметили ошибку? <header> <div class="center"> <h 1>Development with Rails</h 1> <h 5>and other technologies</h 5> <%= render partial: "devise/devise_links" %> ? ? ? <%= render partial: "layouts/navigation" %> </header>
Синтаксический сахар. Такой сладкий. #articles <div id="articles"> </div>. article <div class="article"> </div> P (Slim) <p></p> %P (HAML) <p></p>
Интерполяция 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, Red. Cloth, Haml, etc. (thanks to Tilt)
… и много других улучшений синтаксиса в сравнении с ERB (HTML)
Haml, Slim = быстрая разработка
HAML vs SLIM Преимущества HAML • • Более распространен. Теги четко выделены. Лучше документация. Есть возможность создавать собственные фильтры. Преимущества SLIM • Больше фильтров благодаря Tilt. • Больше производительность. • Позволяет писать несколько тегов в одну строку (лучше не злоупотреблять)
Мнения разработчиков Мое мнение: Я использовал и Haml и Slim. Первым был Haml, затем Slim. Разница не велика. Haml/Slim позволяют мне писать более чистый код, который легче читать и поддерживать, код, который просто из-за того, что лишнее выброшено быстрее писать. В HTML легко можно допустить ошибку, Haml/Slim не дают разработчику ошибаться, 100% тегов будут закрыты!
Мнения разработчиков ERB меня совсем огорчает, а вот HAML радует. Для себя я выделяю несколько причин, почему HAML лучший выбор: • • • Закрывать теги давно уже не модно, структура хамл исключает ошибки вложенности html тегов, скорость разработки, гибкость оформления кода и параметров, легкость парсинга мозгом тегов и текстовой информации (в отличие от Slim, где теги и текст очень тяжело отличить друг от друга) -- Илья Зыкин – фронтэнд разработчик из kupibilet. ru
Мнения разработчиков Все новые проекты Hashrocket мы разрабатываем используя HAML и мы собираемся перенести все существующие в нашем портфолио проекты на HAML как можно быстрее. Разметка кода основанная на отступах работает просто замечательно для генерации чистого и семантичного кода в такой способ, когда вы можете ясно видеть разметку и ее связь с CSS кодом. Это очень круто! -- Оби Фернандез (http: //blog. obiefernandez. com/content/2008/01/are-you-usingh. html)
Хорошо, но как перевести существующий код на Haml/Slim? Это ведь очень долго! Нет, не долго! https: //github. com/dhl/erb 2 haml, https: //github. com/fredwu/haml 2 slim, etc.
Вывод Используйте Haml/Slim
Все еще хочется поспорить? ERB HAML/SLIM
ERB vs HAML vs SLIM.pptx