Языковые Альтернативы для Веба
Sep. 24th, 2010 09:12 amЧто делать несчастному веб-программисту, связанному по рукам и ногам старыми языками разметки, представления и скриптования? Что делать, если ужасно надоели горы всякой ботвы, накопившиеся за прошедшие годы и существующие исключительно для обратной совместимости? Что делать, если хочется чего-то нового, изящного, чистого, светлого?
Правильно! Надо написать свои аналогичные языки, с блэкджеком и шлюхами, правильно задизайненные с самого начала. А потом, в определённый момент (либо при деплойменте, либо даже на лету) компилировать их в старые языки, которые уже и выдавать ничего не подозревающим клиентам.
HAML (HTML Abstraction Markup Language)
HAML призван заменить HTML-based темплейтные движки и преследует такие цели:
- Код должен быть легко читаемым
- Код должен быть неизбыточным (DRY)
- Код должен быть правильно выровнен
- Код должен создавать структурированный XHTML
В результате HAML-код выглядит примерно так:
!!!
%html{ :xmlns => "http://www.w3.org/1999/xhtml", :lang => "en", "xml:lang" => "en"}
%head
%title BoBlog
%meta{"http-equiv" => "Content-Type", :content => "text/html; charset=utf-8"}
= stylesheet_link_tag 'main'
%body
#header
%h1 BoBlog
%h2 Bob's Blog
#content
- @entries.each do |entry|
.entry
%h3.title= entry.title
%p.date= entry.posted.strftime("%A, %B %d, %Y")
%p.body= entry.body
#footer
%p
All content copyright © Bob
Изначально HAML создавался для RoR, но сейчас доступен и для Python, и для Java, и для Scala, и для Perl и т.д.
SCSS (Sassy CSS)
SCSS (так же являющийся третьей версией SASS) создавался как язык описания стилей, отвечающий примерно тем же требованиям:
- Совместимость с CSS3
- Поддержка SSI в стилевых файлах
- Поддержка переменных и функций
- Поддержка вложенных правил и mixin'ов
- Поддержка примитивных управляющих директив (if/for/while)
- Создание правильно форматированных выходных стилевых файлов
- Встроенная интеграция с FireBug'ом
Примерный вид SCSS-файла таков:
$width: 2px;
$color: #ccc;
$style: solid;
.fakeshadow {
border: {
style: $style;
left: {
width: 2 * $width;
color: darken($color, 50%);
}
right: {
width: $width;
color: $color;
}
}
}
Есть и альтернативы: SASS, LESS (Leaner CSS), HSS.
Coffee Script
Альтернативный JavaScript в виде Coffee Script выглядит несколько сложнее, однако однозначно транслируется в более объёмный JS-код. Язык пока ещё находится в предварительных стадиях развития, однако уже содержит несколько интересных фич: свою реализацию класс-объектной модели, yaml-подобные определения структур, списковое присваивание (pattern matching/destructuring assignment), усовершенствованная работа с массивами и range'ами.
Пример кода на CoffeeScript, работающий с jQuery и Raphael (из блога the next 10000 hours, где приводится и результирующий JS-код):
app: {
init: ->
app.paper: Raphael('playspace',320,200)
app.draw_circle()
app.draw_square()
# simple circle with event-based on-click event
draw_circle: ->
circle: app.paper.circle(50,40,30)
circle.attr("fill","#f00")
circle.attr("stroke","#fff")
$(circle.node).click((e) -> app.kick(e))
# square with object-based on-click event
draw_square: ->
square: app.paper.rect(150,40,50,30)
square.attr("fill","#0f0")
square.attr("stroke","#fff")
$(square.node).click((e) -> app.punt(square,e))
kick: (e) ->
app.paper.text(e.pageX + 10, e.pageY + 10, "Raphaël\nkicks\nbutt!")
punt: (obj,e) ->
obj.translate(10,10)
}
# make it globally visible - not really needed, handy for debugging
if window?
window.APP: app
$(app.init)
Выглядит несколько непривычно, однако потом - более компактно и более читаемо, чем традиционный JS. Посмотрим, как этот проект будет развиваться дальше...
Очень любопытные технологии. Надо будет попробовать на практике.
no subject
Date: 2010-09-24 08:30 pm (UTC)Надеюсь, что это всего лишь дело привычки.