Это сайт — моя персональная записная книжка. Интересна мне, по большей части, история, своя жизнь и немного программирование.

CSS vs. JSSS

Почти никто не помнит, но в прошлом веке, в браузере Netscape Navigator (который позже стал Communicator) был ещё один способ задавать таблицы стилей — JSSS.

Вообще, сейчас принято с теплотой вспоминать поделие Netscape и осуждать Microsoft за самоуправство в стандартах, но тогда время было такое. Кто такие были W3C и кто — Microsoft с Netscape. В Netscape придумывали «стандартов» никак не меньше (а то и больше), чем в Microsoft. И где сейчас LAYER, MULTICOL или тот же JSSS? Впрочем, фирма Netscape в 1996 году отправила JSSS в W3C.

Выглядел JSSS примерно так (даже функции поддерживались!):

<style type="text/javascript">
 tags.p.fontSize = "14pt";
 with(tags.H2)
 {
   color = "red";
   fontSize = "16pt";
   marginTop = "2cm";
 }
contextual(tags.H1, tags.EM, ids.x78, classes.foo.all).color = evaluate_color();
tags.P.firstLine.fontStyle = "small-caps";
tags.IMG.width = .50 * document.width;
if (visual.colorDepth > 2) {
  body.bgColor = "white";
  body.color = "blue";
} else {
  body.bgColor = "black";
  body.color = "white";
}
</style>

И иногда, перебирая в голове ушедшие технологии, я задумываюсь — а не было бы принятие JSSS вместо CSS более удачным шагом? Нужно было бы учить на один язык меньше (JS уже есть в браузере), да и последние тенденции в CSS3 показывают, что он медленно двигается в сторону какой-то странного скриптового языка.

Вот пример:

@media only screen and (max-width: 1024px) {
    div {
        width: -moz-calc(100% - 2 * 3px);
        height: -moz-max(50%, 18px);
    }
}

@-webkit-variables {
   step: -1;
}

ol {
    counter-reset: list -webkit-var(step);  
}
li:before {
    counter-increment: list;
    content: counter(list) ". ";
}

Уже похоже на какой-то язык программирования, не так ли? Переменные, какие-никакие циклы, функции (min, max), условия, арифметические действия.

Так вот, нужно ли это всё было городить? В JavaScript это уже есть. Впрочем, нужны, конечно, ограничения, чтобы JSSS не превратился в труднопроходимую кашу, CSS более лаконичен и строг. Но вопрос в том, удобно ли уже сейчас читать CSS больших проектов? Я пробовал, мой ответ — вряд ли. Это чудовищно сложно.

В общем, мне кажется, что Netscape был в чём-то прав. В этом направлении стоило двигаться.

13 комментариев
vava (vadim.atlygin.com) 2010

Мне кажется наоборот. CSS медленно движется и обновляется, но JS-то еще медленнее. Точнее, вообще никак.
Все дело в том, что CSS — декларативный язык. И, будучи таковым, в нем могут запросто существовать правила, поддерживаемые не всеми браузерами. Такие правила просто игнорируются и в результате получается более-менее приемлимый результат. С JS же такое не прокатит, игнорирование одной инструкции приведет к некорректной работе программы.

Никита Васильев (elv1s.ru) 2010

Как в JSSS с селекторами типа «a img»?

Переменные были?

Никита Васильев (elv1s.ru) 2010

Комментарий для elv1s.ru:

Это могло быть например так:

with (tags.A.descendants(«IMG»)) {
  border = 0
}

(вот и поговорил сам с собой)

Никита Васильев (elv1s.ru) 2010

А если там были функции, то можно было бы сделать такое API:

at(«A IMG»).css(«\
    border: none\
„)

А если бы JS не требовал „\“ на конце строк, то было бы совсем хорошо :)

bolknote.com 2010

Комментарий для vadim.atlygin.com:

JavaScript медленно обновляется? Это, конечно же, не так! Он очень быстро прогрессирует как язык, добавляется новое API, движки совершенствуются.

bolknote.com 2010

Комментарий для elv1s.ru:

Никита, откуда мне помнить, столько лет прошло:) почитай стандарт

Victor Grinchik (wiktar.com) 2010

Как раз именно сейчас что-то похожее на «JSSS» возрождается. И я вижу это прямо на переводой.

И речь о jQuery.

Пример:

$(«a img»).css(«border», «1 px solid black»);

и даже всякие

if ($(«.list li:nth-child(3)»).css(«color») == «black»)
{
    $(«a»).css(«color», «blue»);
}

Чем не JSSS?

Евгений Степанищев (bolknote.ru) 2010

Комментарий для wiktar.com:

Да вполне себе :) Но это немного в другом качестве, к сожалению.

Евгений Степанищев (bolknote.ru) 2010

Комментарий для vadim.atlygin.com:

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

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

Кроме того, очень просто вводить новые единицы и селекторы самому. Нет поддержки hsla? Достаточно сделать эмулирующую функцию. Не поддерживается «A > B ~ C»? Запрограммируй!

Евгений Степанищев (bolknote.ru) 2010

Комментарий для elv1s.ru:

Как в JSSS с селекторами типа «a img»?

contextual(tags.A, tags.IMG).color = «red»

Переменные были?

Там полноценный JS (насколько он поддерживался Netscape тогда, конечно).

Victor Grinchik (wiktar.com) 2010

Комментарий для Евгения Степанищева:

В каком качестве?

Да, есть отличия во времени выполнения. Но ведь делает всё то же.

Что интересно, вёрстка всё дальше уходит от простого набора тегов и css-свойств.
HTML5/CSS3/JS — непрограммист с этим уже не справится.

P.S. А что такое «bolknote.com»?

Евгений Степанищев (bolknote.ru) 2010

Комментарий для wiktar.com:

В каком качестве? Да, есть отличия во времени выполнения.

Именно в этом и отличие.

Что интересно, вёрстка всё дальше уходит от простого набора тегов и css-свойств.

HTML5/CSS3/JS — непрограммист с этим уже не справится.
Точно, уже и не справляется.

P.S. А что такое «bolknote.com»?

Это я в трамвае трясся, перепутал домены :)

astur (astur.net.ru) 2010

По-моему, люди, которые делали css2, отлично понимали, какие вещи просто не стоит вытаскивать из скриптов и совать в стили. А те, кто делают css3, подобны тем, кто делает швейцарский нож из дамасского меча.

...то есть я понимаю, что в css3 много разумного, но.